В одной из наших статей мы рассматривали способ восстановления старого дизайна Google Chrome, обновление которого до 69 версии привнесло в графическую оболочку популярного браузера элементы нового стиля Material Design 2, также известного как Material Refresh.
Обновляем дизайн Mozilla
Нельзя, однако, сказать, что большинству пользователей обновленный дизайн пришелся не по вкусу. Скорее наоборот, многие из них остались довольны. Более того, среди пользователей других браузеров, в частности, Firefox, нашлось немало таких, которые хотели бы примерить Material Refresh на своего «огнелиса» (тем более новинка отчасти перекликается с прежним стилем Australis, что был в Firefox до обновления Quantum).
Так вот, это вполне реально. Если вы хотите сделать свой Firefox похожим на обновленный Google Chrome, следуйте этой инструкции.
Для дела вам понадобится специальный набор стилей и SVG-файлов под названием MaterialFox. Скачать его можно совершенно бесплатно с этой страницы проекта GitHub.
Распаковав архив, вы найдете в нём папку chrome с набором разных файлов. Она как раз вам и нужна. За тем перейдите в Проводнике Windows по адресу:
%appdata%/Mozilla/Firefox/Profiles
Он приведёт вас в папку профиля Firefox.
У нас данная папка называется za4airzp.default. У вас название, а точнее, его первая часть, будет отличаться. Теперь скопируйте в эту папку полученный из архива каталог chrome.
В том случае, если вы раньше настраивали интерфейс Firefox с помощью собственных стилей и в папке профиля у вас имеется файл userChrome.css, вам нужно будет открыть файл с таким же названием в папке chrome, скопировать имеющийся там код и вставить его в конец уже существующего файла userChrome.css.
Итак, папка chrome скопирована в каталог профиля и можно смотреть, что получилось. Запустив Firefox, вы увидите, что дизайн изменился, но вкладки выглядят черными, да и значки на панели инструментов смотрятся не очень привлекательно.
Устраним эту проблему. Перейдите в браузере по внутреннему адресу about:config на страницу скрытых настроек, нажмите кнопку принятия риска и найдите в списке с помощью поисковой строки параметр svg.context-properties.content.enabled.
По умолчанию он имеет значение false, вы же замените его на true, для чего кликните по нему два раза мышкой.
Перезапустив Firefox, вы увидите результат применения темы во всей красе.
И вот еще один момент. Если вы работаете в Windows 10, то для полноты картины в разделе персонализации можете установить птичку в чекбоксе «В заголовках окон» для опции «Отображать цвет элементов на следующих поверхностях».
На страничке загрузки темы вы также найдете полезные советы от разработчика по модификации мелких деталей интерфейса Firefox с тем, чтобы сделать его еще более похожим на новый интерфейс Chrome. Если хотите, можете ими воспользоваться.
Александр Ануфриев, журналист, в свободное время любит работать с компьютерами, уделяя особое внимание браузерам.
Страница автора — ВКонтакте
Здравствуйте!
Спасибо за статью! Получилось изменить вкладки своей «лисы», а то новые как-то непривычные.
Но с применением стилей под chrome не всё получилось гладко, адресная строка и строка поиска почему-то стали чёрными.
[IMG]http://images.vfl.ru/ii/1558071100/0f4cf0bb/26562732_m.jpg[/IMG]
Да и функциональные кнопки получились обрезанными сверху.
[IMG]http://images.vfl.ru/ii/1558071100/9f8bfc08/26562731_m.jpg[/IMG]
Подскажите, пожалуйста, в каких файлах css поковыряться и какие параметры нужно изменить, чтобы сделать адресную строку белой и кнопки нормальными ?
Заранее благодарен за ответ.
Вот пока
https://guidepc.ru/applications/mozilla-firefox/kak-nastroit-polzovatelskij-interfejs-firefox-s-userchrome-css/
Aleks, спасибо большое! Просмотрю, там много интересных ссылок есть…
Не могу только понять как именуется адресная строка в синтаксисе css, нигде нет такой информации
Вот тут много всего
https://forum.mozilla-russia.org/viewforum.php?id=38
Да, это именно то, нужно посмотреть по форуму или воспользоваться DOM Inspector’ом, как там советуют.
Aleks, благодарю!
не работает