Персональный блог
Перекрашиваем Firefox
На первый взгляд изменения внешнего вида браузера может показатся не особо нужным, а для кого-то и попросту
бесполезным занятием, но на самом деле для вебмастера правильная подсветка кода и удобный интерфейс экономить кучу
времени и, что не мало важно, бережёт глаза.
Как стилизовать Firefox
По началу для стилизации ui я использовал дополнение stylish, но после недавнего обновления это дополнение перестало позволять изменять интерфейс и пришлось вернуться к «корням» и вносить изменения по старинке.
Где создавать файлы?
Первое что нужно сделать это создать два css файла
- userChrome.css – отвечает за стилизацию ui
- userContent.css – отвечает за стилизацию веб страниц
Оба файла должны располагаться в паке chrome вашего профиля. В Windows это
%appdata%\Mozilla\Firefox\Profiles\XXXXXXXX\chrome где XXXXXXXX имя вашего профиля.
Содержимое файлов
Само содержимое это Каскадные таблицы стилей с использованием пространства имен (namespace)
В новых версиях объявлять пространство имен уже не нужно. Так что ничего добавлять в начале файла не нужно.
Где искать селекторы?
Есть несколько вариантов просмотра селекторов.
Инструменты браузера
- Открыть Инструменты браузера:
Tools> WebDeveloper> Toggle Tools > Toolbox Options
Инструменты > Веб-разработка > Инструменты браузера - Перейти в настройки и включить две опции
- Enable browser chrome and add-on debugging toolboxes
Включить инструменты отладки browser chrome и дополнений - Enable remote debugging
Включить удалённую отладку
- Enable browser chrome and add-on debugging toolboxes
Открыть «Инструменты браузера» можно сочетанием клавиш Ctrl+Alt+Shift+I
Затем вы можете пользоваться «Выбрать элемент со страницы» наводя его на интерфейс браузера
Открыть интерфейс как страницу
Для этого через адресную строку браузер перейдите на следующею страницу chrome://browser/content/browser.xul
Посмотреть исходные css файлы
Сами файлы находиться в архиве omni.ja в корневой директории программы.
Мой стиль для Firefox
Написать статью и не поделиться своим стилем было бы мягко говоря не разумно, поэтому держите и мой стиль для Firefox
Внешний вид
Установка
- Скачать последнюю версию стиля с github
- Распаковать архив
- Переместить папку chrome в папку профиля firefox
- Перезапустить браузер
Обновления и дополнения
Разуметься стиль будет обновляться и дополняться, поэтому следите за репозиторием, ну и конечно написание Issues и Pull requests не возбраняется.
Дата публикции:
18.12.2017
Дата обновления:
25.12.2020
