Jak uzyskać motyw Google Chrome Material Design w przeglądarce Firefox

Jeśli nie podoba Ci się wygląd kwadratowych narożników na kartach w przeglądarce Firefox, możesz nadać im zaokrąglony wygląd interfejsu projektowania materiałów w Chrome.

Jeśli nie podoba ci się wygląd kwadratuw narożnikach kart w przeglądarce Firefox możesz nadać im zaokrąglony wygląd interfejsu Material Design Chrome. Możesz także umieścić zaokrąglone końce na pasku adresu i przekonwertować ikony paska narzędzi Firefox na ikony Material Design. Dzisiaj pokażemy, jak uzyskać interfejs użytkownika Material Design w Chrome w przeglądarce Firefox.

Przed przejściem do interfejsu projektowania materiałów

Oto, jak wyglądają karty i ikony Firefoksa przed zastosowaniem interfejsu Material Design w Firefox:

Kwadratowe zakładki w Firefoksie, przed zastosowaniem interfejsu Material Design UI

Teraz zastosujemy interfejs użytkownika Material Design do Firefoksa i zaokrąglimy rogi oraz ikony projektowania materiałów.

Pobierz i wyodrębnij wymagane pliki

Pobierz plik zip MaterialFox, aby uzyskać wymagane pliki.

Kliknij Klonuj lub pobierz na stronie internetowej, a następnie kliknij Pobierz ZIP. Zapisz plik w folderze na dysku twardym.

Pobierz plik zip MaterialFox

Wyodrębnij pliki za pomocą wbudowanego narzędzia do ekstrakcji w systemie Windows lub narzędzia innej firmy, takiego jak 7-Zip lub WinZip.

Wyodrębnij plik zip MaterialFox

Jeśli korzystasz z wbudowanego narzędzia do ekstrakcji systemu Windows, kliknij Przeglądaj wybrać lokalizację pobierania.

Sprawdź Pokaż wyodrębnione pliki po zakończeniu pole, aby otworzyć okno Menedżera plików bezpośrednio do pobranego folderu po zakończeniu rozpakowywania. Kliknij Wyciąg.

Okno dialogowe wyodrębniania systemu Windows 10

Otwórz folder profilu Firefox

Skopiujemy chrom folder z MaterialFox-master folder, który pobraliśmy. The chrom folder zawiera userChrome.css plik używany do zastosowania interfejsu Material Design UI w przeglądarce Firefox. Ale najpierw sprawdźmy, czy już masz chrom folder i własny niestandardowy userChrome.css plik w folderze profilu Firefox.

Aby otworzyć folder profilu, wpisz (lub skopiuj i wklej) następującą ścieżkę do paska adresu w Eksploratorze plików i naciśnij klawisz Enter.

% appdata% MozillaFirefoxProfiles

Wklej ścieżkę profilu w Eksploratorze plików

Możesz również uzyskać dostęp do swojego folderu profilu z poziomu przeglądarki Firefox.

Rodzaj: about: wsparcie na pasku adresu i naciśnij Wchodzić.

Lub możesz iść do Menu Firefox> Pomoc> Informacje dotyczące rozwiązywania problemów a następnie pod Podstawy aplikacji, Kliknij Otwórz folder obok Folder profilu.

Otwórz folder profilu w przeglądarce Firefox

Twój profil Chrome otworzy się w nowym oknie Eksploratora plików. Pozostaw to okno otwarte.

Edytuj istniejący plik userChrome.css

Jeśli nie masz jeszcze folderu chrome w folderze profilu, przejdź do następnej sekcji.

Jeśli masz chrom folder w folderze profilu i userChrome.css plik w folderze chrome, a następnie edytujemy istniejący userChrome.css plik. W ten sposób nie tracisz już wprowadzonych dostosowań.

The MaterialFox-master pobrany folder zawiera chrom folder z userChrome.css plik w nim. Otwórz to userChrome.css plik w edytorze tekstów, takim jak Notatnik, skopiuj wszystko i zamknij plik.

Następnie otwórz własne userChrome.css plik (w pliku chrom folder w folderze profilu) w edytorze tekstu. Wklej skopiowany tekst na końcu swojego userChrome.css plik i zapisz i zamknij plik.

Skopiuj zawartość pliku MaterialFox userChrome.css

Skopiuj i wklej pobrany folder chrome

Jeśli jeszcze nie masz chrom folder w folderze profilu, otwórz nowe okno Eksploratora plików, a następnie otwórz MaterialFox-master wyodrębniony folder.

Skopiuj chrom folder w MaterialFox-master teczka.

Skopiuj folder chrome do folderu MaterialFox

Wróć do okna Eksploratora plików z otwartym folderem profilu.

Wklej chrom folder skopiowany z MaterialFox-master folder do folderu profilu.

Wklej folder chrome do swojego profilu Firefox

Napraw czarne zakładki i dziwnie wyglądające ikony

Otwórz Firefox, aby zobaczyć wynik nowych ustawień interfejsu Material Design.

Zauważysz, że karty są czarne, a ikony wyglądają dziwnie.

Karty Black Material Design w przeglądarce Firefox

Naprawimy ten problem za pomocą ustawienia konfiguracji Firefoksa.

Rodzaj: about: config w pasku adresu Firefox i naciśnij Wchodzić. Zobaczysz komunikat ostrzegawczy.

Kliknij Akceptuję ryzyko! kontynuować.

Przejdź do about: config w Firefox

Rodzaj: svg.context w Szukaj pudełko. Wyświetlane są następujące preferencje:

svg.context-properties.content.enabled

Ta preferencja jest ustawiona na fałszywe domyślnie, co oznacza, że ​​jest wyłączony.

Aby włączyć tę funkcję, kliknij ją dwukrotnie, aby zmienić jej wartość na prawdziwe. Możesz także kliknąć preferencję prawym przyciskiem myszy i wybrać Przełącznik.

Kliknij dwukrotnie preferencję svg.context

Teraz przejdź do dowolnej innej karty lub uruchom ponownie Firefox. Czarne zakładki i dziwnie wyglądające ikony są naprawione.

Naprawiono czarne zakładki w przeglądarce Firefox

Pokaż kolor akcentu systemu Windows 10 na pasku tytułu Firefox

W Windows 10 jest jeszcze jedna rzecz do zmiany, jeśli chcesz, aby pasek tytułu i nieaktywne karty w Firefoksie nie były czarne.

Kliknij Ustawienia w menu Start i przejdź do Personalizacja> Kolory.

Sprawdź Paski tytułowe i obramowania okien pole pod Pokaż kolor akcentu na następujących powierzchniach.

Pokaż opcje kolorów akcentu w systemie Windows 10

Korzystaj z interfejsu Material Design UI w przeglądarce Firefox

Teraz zakładki mają ładne zaokrąglone rogi, a ikony mają wygląd Material Design. Pasek tytułu i nieaktywne karty mają kolor akcentu wybrany w ustawieniach systemu Windows 10.

Kolor akcentu na pasku tytułowym przeglądarki Firefox

Odinstaluj interfejs Material Design w przeglądarce Firefox

Jeśli zdecydujesz, że chcesz wrócić do ostrych narożników kart i oryginalnych ikon w przeglądarce Firefox, to proste. Wykonaj jedną z następujących czynności:

  • Jeśli skopiowałeś chrom folder z MaterialFox-master do folderu profilu, usuń ten folder chrome.
  • Jeśli skopiowałeś tekst z userChrome.css plik w MaterialFox-master folder i wkleił go do własnego userChrome.css plik, otwórz userChrome.css plik i usuń wklejony do niego tekst.
0

Podobne artykuły

zostaw komentarz