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

НовостиФайловые архивы
ПоискАктивные темыТоп лист
ПравилаКто в 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-селекторов элементов интерфейса встроенными средствами браузера

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

Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
grom17
вот https://dropmefiles.com/VDhWx
Пункт  

Код:
/* ПКМ спросить у ChatGPT */
#context-ask-chat {
    --menu-image: url("chat-sparkle.svg");
}
 

я нашел как сделать.
А вот выпадающее меню (там где Резюмировать...) никак не получается. Если использовать background-image, то там какая то каша из значков получается.

Всего записей: 403 | Зарегистр. 01-11-2006 | Отправлено: 14:55 24-04-2025
grom17



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Покопался в коде, тоже ничего не получилось. Может коллеги помогут разобраться.

Всего записей: 1633 | Зарегистр. 12-10-2002 | Отправлено: 17:58 24-04-2025
Smallette

Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
grom17
у меня за наведение порядка и организацию отступов необходимых для размещения иконок в меню отвечает еще один файл и ,я так понимаю, в нем сделаны отступы только для первого уровня меню, а для второго уровня раскрывающихся меню уже нет.
Вот этот файл:
https://dropmefiles.com/Vtk2Q
 
Разместить иконки я смог вот так:

Код:
/* Резюмировать */
#context-ask-chat menuitem:nth-child(1) {
    background: url("apps-list-detail.svg") no-repeat left !important;
}

Но они накладываются на надпись Резюмировать, нужно отступ текста сделать...
 
 
Нормальный кстати прогресс бар:
Подробнее
 
настроил его показываться по нижнему краю вкладки, но почему то когда идет загрузка неактивной вкладки прогресс бар появляется выше на пару пикселей чем на активной. Что тут можно сделать?

Всего записей: 403 | Зарегистр. 01-11-2006 | Отправлено: 06:11 25-04-2025 | Исправлено: Smallette, 08:01 25-04-2025
gutasiho

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Smallette
Читайте, плиз, шапку - не нужно выкладывать простыни. Плиз, отредактируйте свои посты (три), приведя их в норму.
Цитата:
Нормальный кстати прогресс бар:
Нормальный работал бы в приватном режиме.

Всего записей: 8876 | Зарегистр. 14-09-2020 | Отправлено: 07:39 25-04-2025 | Исправлено: gutasiho, 07:42 25-04-2025
Smallette

Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
gutasiho
Поправил, сорри...
Прогресс бар у меня работает и в приватном.

Всего записей: 403 | Зарегистр. 01-11-2006 | Отправлено: 08:06 25-04-2025
Death_INN

Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Smallette, я выкладывал как делать отступы, но только пару челов приняли во внимание и больше ни разу не обращались. Смотреть катавасию в css не могу, т.к. дропми у мя находится в топ 10 телеметрических аплоад сайтов, поэтому навеки в черном списке
 
На счет прогрес бара, то его реализация совсем не нра, ибо всегда вместо бефо заюзываю .tab-context-line (т.к. не юзаю расширу вкладки в контейнере), где положение линии можно регулировать ордером, либо подключаю border-image, который накладывается поверх фона вкладок.
 
В твоем случае может помочь рассчет топ маргина, т.е. вместо него
margin-block-start: calc(var(--tab-min-height) - var(--tab-block-margin));
а если нет, то могут и другие стили влиять

Всего записей: 3950 | Зарегистр. 24-10-2002 | Отправлено: 09:43 25-04-2025 | Исправлено: Death_INN, 09:58 25-04-2025
gutasiho

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Smallette
Цитата:
А вот выпадающее меню (там где Резюмировать...) никак не получается. Если использовать background-image, то там какая то каша из значков
Чтобы эту кашу убрать, добавить в код строку
Код:
    background-repeat: no-repeat;
и выравнять положение иконки.

Всего записей: 8876 | Зарегистр. 14-09-2020 | Отправлено: 13:59 25-04-2025
Smallette

Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Death_INN
спасибо, буду знать про дропми - удалю и забуду...
а можно попросить полностью твой код реализации прогресс бара?
 
я думаю в моем случае он прыгает из-за линии сверху активной вкладки, он у меня как раз 2 пикселя.
как бы их совместить? может быть можно чтобы прогресс бар появлялся вместо этой линии и после загрузки заменялся линией?

Всего записей: 403 | Зарегистр. 01-11-2006 | Отправлено: 18:42 25-04-2025
Death_INN

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

Цитата:
может быть можно чтобы прогресс бар появлялся вместо этой линии и после загрузки заменялся линией?

проще для линии сделать исключение
.tabbrowser-tab:not([busy])
 
а мой не знаю как будет пахать, т.к. он вкупе с другими стилями. вот выдрал
 
Не помню как в FF136, а для
FF135: linear-gradient(red, red)
FF137: linear-gradient(red)
но для совместимости можно оставить дублирование

Всего записей: 3950 | Зарегистр. 24-10-2002 | Отправлено: 22:27 25-04-2025 | Исправлено: Death_INN, 22:50 25-04-2025
gutasiho

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Death_INN
Тот SaveTo.js выдает ошибку в консоли, устранил добавлением таких строк
Код:
  if(!document.getElementById("unknownContentType"))  
    return;
перед строкой
Код:
   const button = document.getElementById('unknownContentType').getButton('cancel');

Всего записей: 8876 | Зарегистр. 14-09-2020 | Отправлено: 10:25 26-04-2025
Death_INN

Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
gutasiho, я задержку в 1 ставил и все равно нет ошибок. Скрипт покажи

Всего записей: 3950 | Зарегистр. 24-10-2002 | Отправлено: 10:52 26-04-2025 | Исправлено: Death_INN, 10:58 26-04-2025
grom17



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

Код:
    /* Скрыть ярлыки веб-сайтов при добавлении текста в строке поиска */
    .top-site-outer {
        opacity: 0 !important;
        pointer-events: none !important;
    }
     body:has(#searchSuggestionTable[hidden]) .top-site-outer {
        opacity: 1 !important;
        pointer-events: auto !important;
    }  

Всего записей: 1633 | Зарегистр. 12-10-2002 | Отправлено: 14:41 26-04-2025
Smallette

Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
В итоге сделал вот так - полоса над активной вкладкой и прогресс бар по низу активной вкладки (получилось как в вивальди).
Код
 

Цитата:
Чтобы эту кашу убрать, добавить в код строку

это я уже нашел как сделать, но нужно отступы надписей сделать - не пойму как

Всего записей: 403 | Зарегистр. 01-11-2006 | Отправлено: 07:27 27-04-2025 | Исправлено: Smallette, 13:16 27-04-2025
73



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Smallette
От чего зависит цвет прогресс-бара? Меня и так все устраивает, чисто из любопытства.

Всего записей: 1505 | Зарегистр. 18-08-2012 | Отправлено: 16:48 27-04-2025
LubitelSofta



Full Member
Редактировать | Профиль | Сообщение | ICQ | Цитировать | Сообщить модератору
FirefoxCSS Store - вот чего нашёл. Вроде в шапке нету.

Всего записей: 550 | Зарегистр. 25-06-2009 | Отправлено: 16:52 27-04-2025
Smallette

Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
73
меня тоже устраивает, код нашел здесь, но думаю, что где то вот тут "собака порылась":

Код:
 
background-color:transparent;
background-repeat: no-repeat;
background-image: linear-gradient(currentColor,currentColor);

Всего записей: 403 | Зарегистр. 01-11-2006 | Отправлено: 06:26 28-04-2025 | Исправлено: Smallette, 06:27 28-04-2025
grom17



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
В FF138 углы контекстного округлились, как отрегулировать не пойму, прежние способы не помогли.

Всего записей: 1633 | Зарегистр. 12-10-2002 | Отправлено: 17:30 28-04-2025
gutasiho

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
grom17
Цитата:
В FF138 углы контекстного округлились, как отрегулировать не пойму,
Чем я закруглял с давних пор, тем и выпрямляю
Код:
menupopup,
.menupopup-arrowscrollbox {
border-radius: 0 !important;    /* 0px без закругления */
}

Всего записей: 8876 | Зарегистр. 14-09-2020 | Отправлено: 17:54 28-04-2025
grom17



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
gutasiho У меня до сих пор было так:
Код:
@-moz-document url-prefix("chrome:"), url-prefix("about:") {
* {
      border-radius: 0px !important;
    --tab-border-radius: 0px !important;
    --toolbarbutton-border-radius: 0px !important;
    --urlbar-icon-border-radius: 0px !important;
    --arrowpanel-border-radius: 0px !important;
    --arrowpanel-menuitem-border-radius: 0px !important;
    --panel-border-radius: 0px !important;
    --in-content-button-border-radius: 0px !important;
    --textbox-border-radius: 0px !important;
}
}
и работало безупречно.

Цитата:
Чем я закруглял с давних пор, тем и выпрямляю
к сожалению не сработало.

Всего записей: 1633 | Зарегистр. 12-10-2002 | Отправлено: 18:40 28-04-2025
gutasiho

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
grom17
Конфликт стилей, у тебя слишком намудрено, попробуй прописать этот код в самое начало userChrome.css, или с чистым userChrome.css, или папку стилей переименуй.

Всего записей: 8876 | Зарегистр. 14-09-2020 | Отправлено: 18:47 28-04-2025
Открыть новую тему     Написать ответ в эту тему

Страницы: 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