Перейти из форума на сайт.

НовостиФайловые архивы
ПоискАктивные темыТоп лист
ПравилаКто в on-line?
Вход Забыли пароль? Первый раз на этом сайте? Регистрация
Компьютерный форум Ru.Board » Компьютеры » Программы » Mozilla Firefox: стили userChrome.css и скрипты js

Модерирует : gyra, Maz

 Версия для печати • ПодписатьсяДобавить в закладки
Страницы: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155

Открыть новую тему     Написать ответ в эту тему

gutasiho

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору



В теме обсуждается настройка внешнего вида Firefox с использованием userChrome.css, userContent.css, а так же использование скриптов js (uc.js).

Родственные темы: Mozilla Firefox | Расширения для Firefox
 
Обсуждение на "Форуме Mozilla Россия":
Настройка внешнего вида Firefox в userChrome.css,
UCF - ваши кнопки, темы, дополнения, скрипты…
 
Темы на GitHub:
Aris-t2 CustomCSSforFx | Aris-t2 CustomJSforFx | xiaoxiaoflood/firefox-scripts | Endor8/userChrome.js | Alice0775 userChrome.js  
VitaliyV UCF - UserChromeFiles | MrOtherGuy/firefox-csshacks (known as MOG) | VicDobrov UCF-скрипты


Просьба публикуемые коды заключать в тэг [code][/code] (из выпадающего меню), а коды более 10 строк - в двойной тэг [more][code][/code][/more] Подробное разъяснение.
 
Как подключить скрипты JS:
метод Aris-t2 | метод xiaoxiaoflood | метод Endor8 | метод user_chrome_files (UCF)
Как подключить скрипты JSM, MJS в загрузчик скриптов от Aris-t2 , а если у вас Firefox v117+, то дополнительно...
 
Еще один способ активации, нюансы: скрипты можно поместить в пользовательслую папку, можно не прописывать активацию каждого скрипта отдельно.
 
Куда вписывать код для стиля userChrome.css и userContent.css
1\ Также не забываем про такую строку в user.js / prefs.js (для включения userChrome.css и userContent.css):
Код:
// Turn on userChrome.css and userContent.css support
// Включить поддержку userChrome.css и userContent.css
user_pref("toolkit.legacyUserProfileCustomizations.stylesheets", true);  
либо эту настройку включить через about:config.
2\ v136+: отключить CSP (Content Security Policy - Политика безопасности контента), снижает безопасность!:
Код:
security.browser_xhtml_csp.enabled = false
3\ v139+: если некоторые скрипты JS не работают, можете сделать так, снижает безопасность!:
Код:
security.allow_unsafe_dangerous_privileged_evil_eval = true  

Полезные ссылки
Онлайн-конвертер иконок в\из Base64
Онлайн-редактор иконок SVG
Онлайн-конвертер SVG to Data URI
Мануал по определению CSS-селекторов элементов интерфейса встроенными средствами браузера

Всего записей: 8874 | Зарегистр. 14-09-2020 | Отправлено: 08:34 29-07-2023 | Исправлено: gutasiho, 16:26 26-07-2025
Death_INN

Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
grom17

Цитата:
но при этом скрывают иконки неактивных строк

Я в теме говорил, что макс гибкость, когда трафарет для иконок через before делается. А тебе разве что вместо
background: none !important; пробовать
background-color: var(--panel-background) !important;
т.е. цвет фона при наведении на неактивный пункт равен цвету фона самого меню

Всего записей: 3949 | Зарегистр. 24-10-2002 | Отправлено: 22:12 25-07-2024
gutasiho

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Стиль окна встроенного контекстного переводчика
Код:
/* userChrome.css */
/* Notice - if you want fully disabling context translator: browser.translations.select.enable = false */
panel.translations-panel-view {
    width: 920px !important;
}
panel.translations-panel-view textarea#select-translations-panel-text-area {
    height: 240px !important;
    font-size: 20px !important;
    color: #6f0045 !important;
}

Всего записей: 8874 | Зарегистр. 14-09-2020 | Отправлено: 08:21 26-07-2024
grom17



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Всем доброго вечера!
В userChrome.css есть такие строки:
@import url("css/gamburger/gamburger_context_menu.css");
@import url("css/icons_context_menu.css");
Это для иконок меню Гамбургер и Контекстного меню и всё прекрасно работает, но стоит их поменять местами
и стили перестают работать, как по мне, этого не должно быть, или я чего-то недопонимаю?

Всего записей: 1633 | Зарегистр. 12-10-2002 | Отправлено: 20:30 27-07-2024
AlAvis

Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
grom17
Стили применяются в том порядке - в каком записаны . При импортировании всё считывается как один файл .
Если у вас в первом общее правило , а во втором частное (противоречащее общему) - всё работает .
А при изменении порядка - учтётся только общее .
 
Вобщем то потому и используются настолько подробные адреса элементов - что бы на другие не влияло .

Всего записей: 2483 | Зарегистр. 15-07-2013 | Отправлено: 20:39 27-07-2024 | Исправлено: AlAvis, 20:42 27-07-2024
grom17



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
AlAvis
Ну хорошо. А почему тогда другие строки переставляю и всё работает?
А в данном случае если я подниму @import url("css/icons_context_menu.css"); над @import url("css/gamburger/gamburger_context_menu.css"); перестаёт работать только @import url("css/icons_context_menu.css");, а всё остальное работает. Я вас понимаю, что всё должно работать как вы описали, но я честно говоря в "ступоре" почему именно строка @import url("css/icons_context_menu.css"); вызывает такой "глюк"?

Всего записей: 1633 | Зарегистр. 12-10-2002 | Отправлено: 21:07 27-07-2024
AlAvis

Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
grom17
Пример :
если в первом правиле указано скрыть все кнопки , а во втором некоторую показать - все кнопки будут скрыты , но одна показана ;
при изменении очерёдности последним сработает скрыть все , в том числе и которую хотели показать .
 
Так и у вас , какое то правило оказывается более общим и переписывающим частное .
Если же пересекающихся правил нет - очерёдность не важна .

Всего записей: 2483 | Зарегистр. 15-07-2013 | Отправлено: 21:36 27-07-2024 | Исправлено: AlAvis, 21:36 27-07-2024
Death_INN

Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
grom17

Цитата:
Это для иконок меню Гамбургер и Контекстного меню и всё прекрасно работает, но стоит их поменять местами
и стили перестают работать

Это надо смотреть содержимое userChrome.css (трабл вариант) и gamburger_context_menu.css
 
AlAvis

Цитата:
Если же пересекающихся правил нет - очерёдность не важна

У себя делаю так, чтобы очередность была не важна и при пересекающихся правилах

Всего записей: 3949 | Зарегистр. 24-10-2002 | Отправлено: 22:41 27-07-2024
grom17



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
AlAvis
Death_INN
Спасибо вам за разъеснение! Действительно "мешал" один параметр. Закоментировав его всё заработало и теперь куда бы я не переставлял строки в userChrome.css всё работает "как надо".
Единственный "косячок" - пропала иконка "Новая вкладка" в icons_context_menu.css но это уже часная проблема, думаю разберусь.
Я взял и "раздербанил" leptonChrome.css (не спрашивайте зачем) из набора Lepton-Proton-Style на два файла: 1) icons_context_menu.css 2) gamburger_context_menu.css
и вроде всё получилось, за исключением небольшого нюанса о котором я писал выше.
Ещё раз СПАСИБО ВАМ БОЛЬШОЕ!

Всего записей: 1633 | Зарегистр. 12-10-2002 | Отправлено: 11:01 28-07-2024 | Исправлено: grom17, 11:17 28-07-2024
Death_INN

Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
grom17, ты выбрал самый сложный способ добавления иконок с этим монстроподобным css от Lepton, который завязан на куче новых добавленных никому не нужных конфиг параметров

Всего записей: 3949 | Зарегистр. 24-10-2002 | Отправлено: 12:30 28-07-2024
deannik

Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Подскажите, пожалуйста, как:
Убрать ореол в текстовых полях и сделать тоньше рамку?
На панели закладок и в закладках изменить иконки папок?

Всего записей: 682 | Зарегистр. 04-08-2013 | Отправлено: 13:24 28-07-2024
gutasiho

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
deannik
http://forum.ru-board.com/topic.cgi?forum=5&topic=50823&start=3200#17
 

Всего записей: 8874 | Зарегистр. 14-09-2020 | Отправлено: 13:56 28-07-2024 | Исправлено: gutasiho, 14:10 28-07-2024
DeZz



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Как то можно отметить (цветом другим к примеру) не загруженные (т.н. "спящие") вкладки?

Всего записей: 1359 | Зарегистр. 23-01-2006 | Отправлено: 17:17 28-07-2024 | Исправлено: DeZz, 17:37 28-07-2024
Death_INN

Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
deannik

Цитата:
Убрать ореол в текстовых полях и сделать тоньше рамку?

Часть стилизации берет на себя OS. Нужно у нее отобрать права и подгонять по шаблону, если получится
Код для UserContent.css

Всего записей: 3949 | Зарегистр. 24-10-2002 | Отправлено: 18:23 28-07-2024 | Исправлено: Death_INN, 18:31 28-07-2024
Death_INN

Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
DeZz

Цитата:
Как то можно отметить (цветом другим к примеру) не загруженные (т.н. "спящие") вкладки?

Можно. Если не ошибаюсь, то в этом случае элемент с классом tabbrowser-tab получает атрибут pending

Всего записей: 3949 | Зарегистр. 24-10-2002 | Отправлено: 22:34 28-07-2024
grom17



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Как подровнять иконки и текст на доп. меню?

Всего записей: 1633 | Зарегистр. 12-10-2002 | Отправлено: 22:41 28-07-2024
DeZz



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Death_INN

Код:
.tabbrowser-tab:pending .tab-content {
  border-top-style: solid !important;
  border-top-width: 3px !important;
  border-top-color: green !important;
}

 
пробую так, но не выходит (
 
grom17
встречный вопрос - а как Вы прикрутили иконки в это меню?

Всего записей: 1359 | Зарегистр. 23-01-2006 | Отправлено: 09:31 29-07-2024
Death_INN

Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
DeZz, атрибут в квадратных скобках без двоеточия .tabbrowser-tab[pending]

Всего записей: 3949 | Зарегистр. 24-10-2002 | Отправлено: 09:57 29-07-2024 | Исправлено: Death_INN, 09:57 29-07-2024
DeZz



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Death_INN
супер! правда у меня теперь not(:hover) "перебивает" [pending]. Их как то можно "подружить" ?
 

Код:
.tabbrowser-tab:not([selected="true"]):not(:hover) .tab-content {
  border-top-style: solid !important;
  border-top-width: 3px !important;
  border-top-color: gray !important;
}
 
.tabbrowser-tab[pending] .tab-content {
  border-top-style: solid !important;
  border-top-width: 3px !important;
  border-top-color: white !important;
}

Всего записей: 1359 | Зарегистр. 23-01-2006 | Отправлено: 10:29 29-07-2024
Death_INN

Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
DeZz, повысить специфику

Код:
.tabbrowser-tab:not([selected], :hover) .tab-content {
  border-block-start: 3px solid gray;
}
.tabbrowser-tab[pending] > .tab-stack > .tab-content {
  border-block-start-color: white;
}

Не могу тестить (все отрублено), замороженных вкладок не бывает, но думаю, что можно не исключать активную вкладку, т.к. при переключении на нее атрибут pending удаляется

Всего записей: 3949 | Зарегистр. 24-10-2002 | Отправлено: 11:19 29-07-2024 | Исправлено: Death_INN, 11:27 29-07-2024
DeZz



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
grom17
вопрос снят, подошёл этот вариант
 
Death_INN
все работает как надо, спасибо

Всего записей: 1359 | Зарегистр. 23-01-2006 | Отправлено: 11:53 29-07-2024
Открыть новую тему     Написать ответ в эту тему

Страницы: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155

Компьютерный форум Ru.Board » Компьютеры » Программы » Mozilla Firefox: стили userChrome.css и скрипты js


Реклама на форуме Ru.Board.

Powered by Ikonboard "v2.1.7b" © 2000 Ikonboard.com
Modified by Ru.B0ard
© Ru.B0ard 2000-2025

BitCoin: 1NGG1chHtUvrtEqjeerQCKDMUi6S6CG4iC

Рейтинг.ru