Создание тем для Dofamin.org

YAPONSKIY CAT

Есть несколько вариантов создания тем и на каждом есть свой (небольшой) костылик...

все данные проверены на новейших версиях

Mozilla Firefox

Удобный редактор
Корректное отображение киррилицы
Отображение изменений сразу после редактирования
Нет Color Picker для HEX цветов, но можно добавить с помощью расширения, либо использовать сторонний сервис
Все (кроме color picker) работает из коробки

Google Chrome & Yandex

Чуть менее интуитивный редактор
Отображение изменений сразу после редактирования
Проблемы с кириллицей (есть фикс)
Удобный color picker находится сразу рядом с HEX-кодом каждого цвета

! Opera (не проверялась)

Непосредственное создание тем в разных браузерах

Обязательные действия для всех браузеров:

Классный парнишка @nanashinogonbee решил облегчить вам жизнь и прокомментировал код темы, а другой парнишка @japanesscat в каждой новой теме продолжил подробное комментирование. В итоге самая прокомментированная и интуитивно настраиваемая тема - Cyberpunk. Поэтому делаем следующее:

В настройках дофамина выбираем cyberpunk-by-netlight

Отлично! теперь весь код будет прокомментирован!

Mozilla Firefox (новейшая)

Переходим на любую страницу дофамина и жмем ПКМ -> Inspect Element

Там у нас открывается DevTools в котором мы выбираем Style Editor

Выбираем название_темы.css и вуаля! Приступаем к работе!

Для тех кто хочет иметь под рукой палитру цветов имеется расширение
Во вкладке Color Picker после установки расширения можно накрутить цвет а затем скопировать его HEX-значение вместо цвета в CSS-файле (HEX-цвета пишутся в виде #a1b2c3)

Yandex Browser & Chrome

Так же как и в лисичке, либо CTRL+SHIFT+I

Заходим во вкладку Sources

А затем идем по пути css/themes/название_темы.css

Chrome

У вас могут быть проблемы с кодировкой, комментарии будут отображаться в виде непонятных символов.

Фикс:

После того как вы открыли окно и увидели кракозябры, не закрывайте его
Жмем CTRL + SHIFT + R
Страница перезагрузится и когда вы снова откроете css-файл, то текст будет на русском!
Если не сработало - повторите или перезагрузите Chrome

Если мой фикс на новой версии вам не помог, пишите, и будем разбираться!

Yandex Browser

У вас могут быть проблемы с отображением изменений. Мне помогли следующие действия изображенные на скринах:

Единственное, что этим способом как мне показалось отображение страницы станет слегка некорректным (лично у меня тени стали светлыми)

ОЧЕНЬ важное замечание

После каждой перезагрузки страницы или перехода на другую вкладку все, что вы написали сразу же исчезнет! Поэтому копируйте все изменения в свой документ и вставляйте его вместо исходного после перезагрузки страницы!

Удачного творчества дофачане!

(статья будет обновляться)

версия 2: в связи с обновлениями браузеров и комментированием кода заменены скрины и упрощена статья