Настройка внешнего вида Firefox в userChrome.css

oleg.sgh · №5101

ALEX_45_ORP
https://forum.mozilla-russia.org/viewto … 05#p727905

Vitaliy V. · №5102

MrDenver пишет

Пожалуйста напишите код для перекраски этих маленьких стрелок перед всеми папками, в разделах закладки/журнал.

добавил, и заодно иконки.

ALEX_45_ORP пишет

другие варианты есть?

а так тоже нет?

userChrome.css

скрытый текст

Выделить код

Код:

@-moz-document url("chrome://browser/content/browser.xul") {

    #tabbrowser-tabpanels, tabbrowser#content, .browserContainer > .browserStack > browser {
        -moz-appearance: none !important;
        background: rgb(27,27,29) !important;
    }

}

userContent.css

скрытый текст

Выделить код

Код:

@-moz-document url("about:blank") {
    body:empty {
        background: rgb(27,27,29) !important;
    }
}

@-moz-document url("about:newtab"), url("about:home") {
    body {
        background: rgb(27,27,29) !important;
    }

    body[lwt-newtab-brighttext] {
        background: var(--newtab-background-color, rgb(27,27,29)) !important;
    }
}

drage2 пишет

Как бы опустить эту popup панель на 1-2px ?

скрытый текст

Выделить код

Код:

#downloadsPanel, #widget-overflow, #appMenu-popup, #customizationui-widget-panel {
    margin-top: 0px !important;
}

значение по умолчанию -6px

Отредактировано Vitaliy V. (01-12-2018 14:18:02)

drage2 · №5103

Vitaliy V.
Класс! #customizationui-widget-panel { margin-top: -4px !important; ) Идеально!
А эту штуку влево-вправо сдвинуть можно? А то сами кнопки двигать приходится, опять треугольник не по центру...Тут то по центру, но padding-left пришлось лепить к кнопкам

Отредактировано drage2 (01-12-2018 15:31:55)

ALEX_45_ORP · №5104

Vitaliy V. к сожалению, тоже нет. Сам уже в недоумении ...

Добавлено 01-12-2018 15:19:41
oleg.sgh тоже нет.

Отредактировано ALEX_45_ORP (01-12-2018 15:25:41)

Vitaliy V. · №5105

ALEX_45_ORP
куда код то добавляете? другие стили работают?
для проверки попробуйте

Выделить код

Код:

* {
    color: red !important;
}

или выложите вашу папку chrome

ALEX_45_ORP · №5106

Vitaliy V. добавляю туда куда указывают, что есть в userChrome.css работает, а что добавляю от вас-нет, ну а вот папка chrome.

Отредактировано ALEX_45_ORP (01-12-2018 15:44:32)

Vitaliy V. · №5107

ALEX_45_ORP
ага где же она заработает

Выделить код

Код:

toolbarbutton { padding: 0px !important; } в userChrome.css

не закомментировано в userChrome.css

drage2 пишет

А эту штуку влево-вправо сдвинуть можно?

лучше не трогать, центруй кнопку

Отредактировано Vitaliy V. (01-12-2018 16:01:04)

drage2 · №5108

Vitaliy V.
Гуд! Все пришлось , да нормально...есть там минус, конечно...

ALEX_45_ORP · №5109

Vitaliy V.

Vitaliy V. пишет

ага где же она заработает

как же быть?

Отредактировано ALEX_45_ORP (01-12-2018 16:16:44)

Vitaliy V. · №5110

ALEX_45_ORP
да очень просто удалите в userChrome.css
или закомментируйте /* в userChrome.css */ если это так нужно

ALEX_45_ORP · №5111

Vitaliy V. СПС, просто удалил, это попало туда по недоразумению (в этом и была моя проблема)

Отредактировано ALEX_45_ORP (01-12-2018 19:45:50)

Вит · №5112

Vitaliy V.
Виталий, помогите с фоном меню (закладки, вкладки, страница и т.д)

Вит · №5113

sandro79
Спасибо за письмо и наводку!

ALEX_45_ORP · №5114

не нашел где спросить, поэтому спрашиваю здесь:
подскажите плз, прописано ли в about:config расстояние между закладками в панели закладок?

Отредактировано ALEX_45_ORP (01-12-2018 19:59:46)

elena_designer · №5115

Ребята, подскажите пожалуйста, как увеличить шрифт в меню и инспекторе?

Джархан · №5116

Фантастика. Пораскинул мозгами, посидел вечерок и вернул старый поиск через пакет от комрада Aris-t2. Всё работает, единственная заковырка была с путаницей двух версий oldsearch и oldsearch63.

Отредактировано Джархан (01-12-2018 23:08:04)

dezhnev · №5117

Приветствую!

Вроде видел здесь и найти не могу, уже 20 страниц последних промотал..
Где-то пролетал запрос и потом ответ на то, как сделать прозрачные (убрать тень) иконки при наведении на них мышкой (т.е. квадрат серый сзади)
Хотел подкрутить и прикрутить к иконкам в #urlbar'е, а найти не могу

MrDenver · №5118

Vitaliy V.
Спасибо большое, все получилось.
Как можно сделать чтобы боковая панель при закрытии всегда запоминала выделенные "закладки"/"записи журнала" и выделенные папки?

Vitaliy V. · №5119

v4386 пишет

Vitaliy V.
Здравствуйте! Не могли бы вы обратить внимание на мой пост №4957.

Vitaliy V. пишет

Нет я уже писал у меня нет пока готового стиля для меню ...
Если сделаю себе стиль то может поделюсь.

Цвет фона меню зависит от используемой темы
[firefox] 78 +

скрытый текст

Выделить код

Код:

@-moz-document url-prefix("chrome:"), url-prefix("about:") {
*|*:root {
    --v-arrowpanel-color: var(--arrowpanel-color, FieldText);
    --v-arrowpanel-background: var(--arrowpanel-background, Field);
    --v-arrowpanel-border-color: var(--arrowpanel-border-color, ThreeDShadow);
    --v-panel-separator-color: var(--panel-separator-color, ThreeDShadow);
    --v-arrowpanel-dimmed: var(--arrowpanel-dimmed, rgba(204, 204, 204, .35));
    --v-menupopup-item-min-height: 24px;
    --v-svg-filter-fill: url("data:image/svg+xml;charset=utf-8,<svg height='0' xmlns='http://www.w3.org/2000/svg'><filter id='fill'><feComposite in='FillPaint' in2='SourceGraphic' operator='in'/></filter></svg>#fill");
}

*|*:root[lwt-popup-brighttext] {
    --v-arrowpanel-dimmed: var(--arrowpanel-dimmed, rgba(249, 249, 250, .1));
}

*|*:root:is([lwt-sidebar-brighttext],.theme-dark) {
    --v-arrowpanel-color: var(--lwt-sidebar-text-color, rgb(177, 177, 179));
    --v-arrowpanel-background: var(--lwt-sidebar-background-color, rgb(27, 27, 29));
    --v-arrowpanel-border-color: rgba(249, 249, 250, .1);
    --v-panel-separator-color: rgba(249, 249, 250, .1);
    --v-arrowpanel-dimmed: rgba(249, 249, 250, .1);
}

menupopup {
    -moz-appearance: none !important;
    appearance: none !important;
    border: 1px solid var(--v-arrowpanel-border-color) !important;
    background: var(--v-arrowpanel-background);
    color: var(--v-arrowpanel-color);
}

:where(:not(#ContentSelectDropdown)) > menupopup {
    background: var(--v-arrowpanel-background) !important;
    color: var(--v-arrowpanel-color) !important;
}

#BMB_bookmarksPopup,
#context-navigation {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
}

#BMB_bookmarksPopup menupopup {
    --arrowpanel-border-color: transparent !important;
    --arrowpanel-background: transparent !important;
    padding-inline-start: 0 !important;
}

menupopup menuseparator {
    -moz-appearance: none !important;
    appearance: none !important;
    height: 3px !important;
    min-height: 3px !important;
    max-height: 3px !important;
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border-image: url("data:image/svg+xml;charset=utf-8,<svg width='3' height='3' xmlns='http://www.w3.org/2000/svg'><line x1='0' y1='1.5' x2='3' y2='1.5' style='fill:none;stroke:black;stroke-width:.9;shape-rendering:crispEdges;'/></svg>") 0 fill !important;
    filter: var(--v-svg-filter-fill) !important;
    fill: var(--v-panel-separator-color) !important;
    color: inherit !important;
}

menupopup :is(menu,menuitem,menucaption) {
    -moz-appearance: none !important;
    appearance: none !important;
    min-height: var(--v-menupopup-item-min-height) !important;
    padding: 0px 10px !important;
}

menupopup :is(menu,menuitem,menucaption) {
    color: inherit;
}

:where(:not(#ContentSelectDropdown)) > menupopup :is(menu,menuitem,menucaption) {
    color: inherit !important;
}

menupopup :is(menu,menuitem)[_moz-menuactive="true"] {
    background: var(--v-arrowpanel-dimmed);
}

:where(:not(#ContentSelectDropdown)) > menupopup :is(menu,menuitem)[_moz-menuactive="true"] {
    background: var(--v-arrowpanel-dimmed) !important;
}

menupopup :is(menu,menuitem,menucaption)[disabled="true"] {
    opacity: 0.6 !important;
    background: none !important;
}

menupopup .menu-iconic-left {
    -moz-appearance: none !important;
    appearance: none !important;
    margin-inline-start: 0 !important;
    margin-inline-end: 3px !important;
    visibility: visible !important;
    min-width: 16px !important;
    width: 16px !important;
    padding: 0 !important;
}

menupopup .menu-iconic-left > .menu-iconic-icon {
    padding: 0 !important;
    margin: 0 !important;
}

menupopup .menu-iconic-text {
    -moz-appearance: none !important;
    appearance: none !important;
    padding-inline-start: 0 !important;
    margin-inline-start: 2px !important;
}

menupopup .contentSelectDropdown-ingroup .menu-iconic-text {
    padding-inline-start: 16px !important;
}

menupopup .menu-text {
    -moz-appearance: none !important;
    appearance: none !important;
    padding-inline-start: 0px !important;
    margin-inline-start: 21px !important;
}

menupopup menuitem:is([type="checkbox"],[type="radio"]) > .menu-iconic-left > .menu-iconic-icon,
menupopup .menu-right > image {
    display: -moz-box !important;
    visibility: visible !important;
    width: 16px !important;
    height: 16px !important;
    filter: var(--v-svg-filter-fill) !important;
    fill: currentColor !important;
    fill-opacity: 1 !important;
    color: inherit !important;
}

menupopup .menu-right {
    -moz-appearance: none !important;
    appearance: none !important;
    list-style-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' height='16' width='16'><path d='M 6,4 V 12 L 11,8 Z' style='fill:rgb(177,177,179)'/></svg>") !important;
    -moz-image-region: auto !important;
    width: 16px !important;
    height: 16px !important;
    padding: 0px !important;
}

menupopup menuitem[type="checkbox"][checked="true"] {
    list-style-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' height='16' width='16'><path d='M 4,5 7.5,8.5 12,4 V 8 L 8,12 H 7 L 4,9 Z' style='fill:rgb(177,177,179)'/></svg>") !important;
    -moz-image-region: auto !important;
}

menupopup menuitem[type="radio"][checked="true"] {
    list-style-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' height='16' width='16'><circle cx='8' cy='8' r='4' style='fill:rgb(177,177,179)'/></svg>") !important;
    -moz-image-region: auto !important;
}

menupopup menuitem[id$="create-screenshot"] > .menu-iconic-left > .menu-iconic-icon {
    -moz-context-properties: fill;
    fill: currentColor;
}

menupopup:-moz-locale-dir(rtl) .menu-right > image {
    transform: scaleX(-1) !important;
}
}

[firefox] 78 + V2

скрытый текст

Выделить код

Код:

@-moz-document url-prefix("chrome:"), url-prefix("about:") {
*|*:root {
    --v-arrowpanel-color: var(--arrowpanel-color, FieldText);
    --v-arrowpanel-background: var(--arrowpanel-background, Field);
    --v-arrowpanel-border-color: var(--arrowpanel-border-color, ThreeDShadow);
    --v-panel-separator-color: var(--panel-separator-color, ThreeDShadow);
    --v-arrowpanel-dimmed: var(--arrowpanel-dimmed, rgba(204, 204, 204, .35));
    --v-menupopup-item-min-height: 24px;
    --v-svg-filter-fill: url("data:image/svg+xml;charset=utf-8,<svg height='0' xmlns='http://www.w3.org/2000/svg'><filter id='fill'><feComposite in='FillPaint' in2='SourceGraphic' operator='in'/></filter></svg>#fill");
}

*|*:root[lwt-popup-brighttext] {
    --v-arrowpanel-dimmed: var(--arrowpanel-dimmed, rgba(249, 249, 250, .1));
}

*|*:root:is([lwt-sidebar-brighttext],.theme-dark) {
    --v-arrowpanel-color: var(--lwt-sidebar-text-color, rgb(177, 177, 179));
    --v-arrowpanel-background: var(--lwt-sidebar-background-color, rgb(27, 27, 29));
    --v-arrowpanel-border-color: rgba(249, 249, 250, .1);
    --v-panel-separator-color: rgba(249, 249, 250, .1);
    --v-arrowpanel-dimmed: rgba(249, 249, 250, .1);
}

menupopup {
    -moz-appearance: none !important;
    appearance: none !important;
    border: 1px solid var(--v-arrowpanel-border-color) !important;
    background: var(--v-arrowpanel-background);
    color: var(--v-arrowpanel-color);
}

:where(:not(#ContentSelectDropdown)) > menupopup {
    background: var(--v-arrowpanel-background) !important;
    color: var(--v-arrowpanel-color) !important;
}

#BMB_bookmarksPopup,
#context-navigation {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
}

#BMB_bookmarksPopup menupopup {
    --arrowpanel-border-color: transparent !important;
    --arrowpanel-background: transparent !important;
    padding-inline-start: 0 !important;
}

menupopup menuseparator {
    -moz-appearance: none !important;
    appearance: none !important;
    height: 3px !important;
    min-height: 3px !important;
    max-height: 3px !important;
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border-image: url("data:image/svg+xml;charset=utf-8,<svg width='3' height='3' xmlns='http://www.w3.org/2000/svg'><line x1='0' y1='1.5' x2='3' y2='1.5' style='fill:none;stroke:black;stroke-width:.9;shape-rendering:crispEdges;'/></svg>") 0 fill !important;
    filter: var(--v-svg-filter-fill) !important;
    fill: var(--v-panel-separator-color) !important;
    color: inherit !important;
}

menupopup :is(menu,menuitem,menucaption) {
    -moz-appearance: none !important;
    appearance: none !important;
    min-height: var(--v-menupopup-item-min-height) !important;
    padding: 0px 10px !important;
}

menupopup :is(menu,menuitem,menucaption) {
    color: inherit;
}

:where(:not(#ContentSelectDropdown)) > menupopup :is(menu,menuitem,menucaption) {
    color: inherit !important;
}

menupopup :is(menu,menuitem)[_moz-menuactive="true"] {
    background: var(--v-arrowpanel-dimmed);
}

:where(:not(#ContentSelectDropdown)) > menupopup :is(menu,menuitem)[_moz-menuactive="true"] {
    background: var(--v-arrowpanel-dimmed) !important;
}

menupopup :is(menu,menuitem,menucaption)[disabled="true"] {
    opacity: 0.6 !important;
    background: none !important;
}

menupopup .menu-iconic-left {
    -moz-appearance: none !important;
    appearance: none !important;
    margin-inline-start: 0 !important;
    margin-inline-end: 3px !important;
    visibility: visible !important;
    min-width: 16px !important;
    width: 16px !important;
    padding: 0 !important;
}

menupopup .menu-iconic-left > .menu-iconic-icon {
    padding: 0 !important;
    margin: 0 !important;
}

menupopup .menu-iconic-text {
    -moz-appearance: none !important;
    appearance: none !important;
    padding-inline-start: 0 !important;
    margin-inline-start: 2px !important;
}

menupopup .contentSelectDropdown-ingroup .menu-iconic-text {
    padding-inline-start: 16px !important;
}

menupopup .menu-text {
    -moz-appearance: none !important;
    appearance: none !important;
    padding-inline-start: 0px !important;
    margin-inline-start: 21px !important;
}

menupopup menuitem:is([type="checkbox"],[type="radio"]) > .menu-iconic-left > .menu-iconic-icon,
menupopup .menu-right > image {
    display: -moz-box !important;
    visibility: visible !important;
    width: 16px !important;
    height: 16px !important;
    filter: var(--v-svg-filter-fill) !important;
    fill: currentColor !important;
    fill-opacity: 1 !important;
    color: inherit !important;
}

menupopup .menu-right {
    -moz-appearance: none !important;
    appearance: none !important;
    list-style-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' height='16' width='16'><path d='M 6,13 11,8 6,3' style='fill:none;stroke:rgb(177,177,179);stroke-width:1;'/></svg>") !important;
    -moz-image-region: auto !important;
    width: 16px !important;
    height: 16px !important;
    padding: 0px !important;
}

menupopup menuitem[type="checkbox"] {
    list-style-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' height='16' width='16'><rect x='.5' y='.5' width='15' height='15' style='fill:none;stroke:rgb(177,177,179);stroke-width:1;opacity:.15;'/></svg>") !important;
    -moz-image-region: auto !important;
}

menupopup menuitem[type="checkbox"][checked="true"] {
    list-style-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' height='16' width='16'><g><rect x='.5' y='.5' width='15' height='15' style='fill:none;stroke:rgb(177,177,179);stroke-width:1;opacity:.15;'/><path d='M 3,7 7,11 13,5' style='fill:none;stroke:rgb(177,177,179);stroke-width:1;'/></g></svg>") !important;
}

menupopup menuitem[type="radio"] {
    list-style-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' height='16' width='16'><circle cx='8' cy='8' r='7.5' style='fill:none;stroke:rgb(177,177,179);stroke-width:1;opacity:.15;'/></svg>") !important;
    -moz-image-region: auto !important;
}

menupopup menuitem[type="radio"][checked="true"] {
    list-style-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' height='16' width='16'><g><circle cx='8' cy='8' r='7.5' style='fill:none;stroke:rgb(177,177,179);stroke-width:1;opacity:.15;'/><circle cx='8' cy='8' r='4.5' style='fill:none;stroke:rgb(177,177,179);stroke-width:1;'/></g></svg>") !important;
}

menupopup menuitem[id$="create-screenshot"] > .menu-iconic-left > .menu-iconic-icon {
    -moz-context-properties: fill;
    fill: currentColor;
}

menupopup:-moz-locale-dir(rtl) .menu-right > image {
    transform: scaleX(-1) !important;
}
}

Отредактировано Vitaliy V. (09-02-2021 18:55:37)

ALEX_45_ORP · №5120

Vitaliy V. пишет

почти не тестировал особенно на , если что не так пишите

шикарно Vitaliy V., закладки стали на темном фоне

скрытый текст

но в другом userChrome.css не сработало, не пойму почему?

ответьте еще здесь плз ...

Отредактировано ALEX_45_ORP (02-12-2018 09:22:12)

Vitaliy V. · №5121

ALEX_45_ORP пишет

но в другом userChrome.css не сработало

лишняя скобка

скрытый текст

#tabbrowser-tabpanels, tabbrowser#content, .browserContainer > .browserStack > browser {
-moz-appearance: none !important;
background: rgb(27,27,29) !important;
}

}

вы же открывающую удалили @-moz-document url("chrome://browser/content/browser.xul") {

ALEX_45_ORP пишет

подскажите плз, прописано ли в about:config расстояние между закладками в панели закладок?

такую мелочь в about:config делать не будут
впрочем там есть browser.uidensity режим обычный, компактный, мобильный то что в персонализации настраивается

стилем это всё делается

скрытый текст

Выделить код

Код:

#PlacesToolbarItems > toolbarbutton.bookmark-item {
    margin: 0 1px !important;
    padding: 1px 2px !important;
}

Отредактировано Vitaliy V. (02-12-2018 10:55:57)

Джархан · №5122

Как увеличить пространство между вкладками и адресной строкой?

ALEX_45_ORP · №5123

Vitaliy V. гранд мадлопт, лишнюю кавычку убрал и все сработало, вот только цвет шрифта остался там темным, не комильфо как-то ...

скрытый текст

Добавлено 02-12-2018 11:52:52

Vitaliy V. пишет

стилем это всё делается + код

вот за это тоже мuchas gracias

Отредактировано ALEX_45_ORP (02-12-2018 11:52:52)

Vitaliy V. · №5124

Джархан пишет

Как увеличить пространство между вкладками и адресной строкой?

может так

скрытый текст

Выделить код

Код:

#urlbar, #searchbar .searchbar-textbox {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
}

или покажите где увеличить

ALEX_45_ORP пишет

цвет шрифта остался там темным,

ну на другом же скриншоте у вас светлый текст, очевидно проблема в других стилях.
С стилями от Aris разбирайтесь сами, пробуйте отключать стили по одному таким образом найдёте проблемный.
Некоторые его стили несовместимы с моим.

Uxapb · №5125

Приветствую.
Расстояние между строк в боковой панели уменьшил следующим кодом, подсмотренным тут на форуме.

скрытый текст

Выделить код

Код:

treechildren.sidebar-placesTreechildren::-moz-tree-row {
 min-height: 18px !important;
 height: 1.3em !important;
 }

А как сделать такое же расстояние в выпадающем списке закладок/журнала/истории, появляющимся при клике по соответсвующей кнопке, помещенной на панель?
Спасибо.

Полезная информация

Re: Настройка внешнего вида Firefox в userChrome.css

Re: Настройка внешнего вида Firefox в userChrome.css

Код:

Код:

Код:

Re: Настройка внешнего вида Firefox в userChrome.css

Re: Настройка внешнего вида Firefox в userChrome.css

Re: Настройка внешнего вида Firefox в userChrome.css

Код:

Re: Настройка внешнего вида Firefox в userChrome.css

Re: Настройка внешнего вида Firefox в userChrome.css

Код:

Re: Настройка внешнего вида Firefox в userChrome.css

Re: Настройка внешнего вида Firefox в userChrome.css

Re: Настройка внешнего вида Firefox в userChrome.css

Re: Настройка внешнего вида Firefox в userChrome.css

Re: Настройка внешнего вида Firefox в userChrome.css

Re: Настройка внешнего вида Firefox в userChrome.css

Re: Настройка внешнего вида Firefox в userChrome.css

Re: Настройка внешнего вида Firefox в userChrome.css

Re: Настройка внешнего вида Firefox в userChrome.css

Re: Настройка внешнего вида Firefox в userChrome.css

Re: Настройка внешнего вида Firefox в userChrome.css

Re: Настройка внешнего вида Firefox в userChrome.css

Код:

Код:

Re: Настройка внешнего вида Firefox в userChrome.css

Re: Настройка внешнего вида Firefox в userChrome.css

Код:

Re: Настройка внешнего вида Firefox в userChrome.css

Re: Настройка внешнего вида Firefox в userChrome.css

Re: Настройка внешнего вида Firefox в userChrome.css

Код:

Re: Настройка внешнего вида Firefox в userChrome.css

Код:

Board footer