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

turbot · №1976

oleg953
Сейчас потыкаюсь. Для закладок (не папок) нужен впуклы или выпуклый вид?

oleg953 · №1977

выпуклые бы,очень надеюсь что найдёте решение.

turbot · №1978

oleg953

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

Выделить код

Код:

/*AGENT_SHEET*/
#PersonalToolbar toolbarbutton.bookmark-item{
    -moz-appearance: none !important;
    border-radius: 0!important;
    border: 2px outset ButtonHighlight!important;
    background: ButtonFace!important;
}
#PersonalToolbar toolbarbutton.bookmark-item:-moz-any([selected="true"],[open="true"],:hover,:active,[_moz-menuactive="true"]){
    border: 2px inset ButtonShadow!important;
    border-radius: 0px !important;
    background: ButtonHighlight!important;
    -moz-appearance: none !important;
}

Проверял только в Stylish. В настройках Classic Toolbar Buttons отключаем все опции (кроме цвета текста) касающиеся панели закладок. Если не так:

то что-то мешает.

oleg953 · №1979

да! то что надо

turbot · №1980

oleg953
Кстати, если вы этот стиль для вкладок брали, то обратите внимание на продолжение. А то у вас как-то перекорежены вкладки.

oleg953 · №1981

Ещё раз огромное спасибо.Завтра добъю этот вопрос.

oleg.sgh · №1982

villa7 пишет

oleg.sgh
С privacy.trackingprotection.enabled;true
Выделить код
Код:
#bad-content-blocked-notification-icon {display: none!important;}

Я уже да же смирился с отключением
Неа, да же стилиш установил...для пробы. Иконка на месте.

Отредактировано oleg.sgh (30-05-2015 06:01:07)

villa7 · №1983

oleg.sgh
Иконка так выглядит?

Попробуйте ещё так.

Выделить код

Код:

#bad-content-blocked-notification-icon {-moz-appearance: none !important; 
 display: none!important; }

oleg.sgh · №1984

Да. только появляются белые пиксели как здесь.
Все убирается

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

Выделить код

Код:

#bad-content-blocked-notification-icon {-moz-appearance: none !important; 
 display: none!important; } 
}
#notification-popup-box {
  background: none!important;
  box-shadow: none!important;
  transition: none!important;
  border: none!important; /* уберет остающуюся стрелку в адресной строке */
}
#notification-popup-box:not([hidden='true']) + #identity-box {
  -moz-padding-start: 7px!important; /* меняйте под себя, чтоб не дергался */
}

но цвет фона панели становится черным.
пс. цвет панели становится черным если добавить в юзерхром где и код панели. если его добавить в стилиш то цвет панели не меняется.

Отредактировано oleg.sgh (30-05-2015 07:48:25)

villa7 · №1985

oleg.sgh
Не имея возможности воспроизвести вашу ситуацию - стили, расширения, не могу что либо посоветовать, гадание на кофейной гуще. Увы

oleg.sgh · №1986

villa7
Это понятно. Спасибо за участие.

oleg953 · №1987

Всем добра. Очередная хотелка .Хочу панели меню придать вид панели закладок формат /*AGENT_SHEET*/ Спасибо

Отредактировано oleg953 (30-05-2015 14:06:13)

turbot · №1988

oleg953
Пишите уж в соседнюю тему по Stylish. Не так уж и важно, но ради порядку.

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

Выделить код

Код:

/*AGENT_SHEET*/
#main-menubar > menu{
    -moz-appearance: none !important;
    border-radius: 0!important;
    border: 2px outset ButtonHighlight!important;
    background: ButtonFace!important;
}
#main-menubar > menu:-moz-any([selected="true"],[open="true"],:hover,:active,[_moz-menuactive="true"]){
    border: 2px inset ButtonShadow!important;
    border-radius: 0px !important;
    background: ButtonHighlight!important;
    -moz-appearance: none !important;
}

Можете эти три стиля в один объединить, оставив /*AGENT_SHEET*/ толтко в самом начале стиля.

Добавлено 30-05-2015 14:56:13
Если что не так, то, соответственно, отключаем в CTR и CTB опции относящиееся к менюбару.

Отредактировано turbot (30-05-2015 14:56:13)

oleg953 · №1989

turbot пишет

Если что не так

всё так!

turbot · №1990

oleg953

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

Свел три стиля в один и кое-что подправил:

Выделить код

Код:

/*AGENT_SHEET*/
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabbrowser-tab > .tab-stack > .tab-content, .tabbrowser-tab[selected=true] > .tab-stack > .tab-content,
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabbrowser-tab:not([selected=true]):not(:-moz-lwtheme) > .tab-stack > .tab-content,.tabs-newtab-button:not(:-moz-lwtheme){
  border: none!important;
  border-radius: 0!important;
  padding-bottom: 4px!important;
  background: none!important;
}
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabbrowser-tab,
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabs-newtab-button:not(:-moz-lwtheme),
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #PersonalToolbar toolbarbutton.bookmark-item,
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #main-menubar > menu{
  -moz-appearance: none !important;
  margin-bottom: 2px!important; /* отступ под вкладками/закладками/меню */
  border-radius: 0!important;
  border: 2px outset ButtonHighlight!important;
  background: ButtonFace!important;
  -moz-margin-end: 2px!important; /* отступ между вкладками/закладками/меню */
  transition: all 100ms ease-in-out 0ms!important; /* это придаст плавность при смене впуклости/выпуклости (удалите строку, если не нужно */
}
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabbrowser-tab[selected=true]:not(:-moz-lwtheme),
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #PersonalToolbar toolbarbutton.bookmark-item:-moz-any([selected="true"],[open="true"],:hover,:active,[_moz-menuactive="true"]),
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #main-menubar > menu:-moz-any([selected="true"],[open="true"],:hover,:active,[_moz-menuactive="true"]){
  border: 2px inset ButtonShadow!important;
  background: ButtonHighlight!important;
}
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #PersonalToolbar {
  padding-top: 2px!important; /* отступ между панелью навигации и панелью закладок*/
}

Должно быть так:

Без CTB. В CTR - "квадратные вкладки v.1".
Или, бонусом, вариант:

Выделить код

Код:

/*AGENT_SHEET*/
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabbrowser-tab > .tab-stack > .tab-content, .tabbrowser-tab[selected=true] > .tab-stack > .tab-content,
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabbrowser-tab:not([selected=true]):not(:-moz-lwtheme) > .tab-stack > .tab-content,.tabs-newtab-button:not(:-moz-lwtheme){
  border: none!important;
  border-radius: 0!important;
  padding-bottom: 4px!important;
  background: none!important;
}
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabbrowser-tab,
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabs-newtab-button:not(:-moz-lwtheme),
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #PersonalToolbar toolbarbutton.bookmark-item,
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #main-menubar > menu:not([disabled='true']),
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .toolbarbutton-1:not([disabled='true']), /* это применит выпуклость ко всем кнопкам. строка ниже - только к кнопкам на панели навигации. удалите эту, если не нужно */
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #nav-bar .toolbarbutton-1:not([disabled='true']){
  -moz-appearance: none !important;
  margin-bottom: 2px!important; /* отступ под вкладками/закладками/меню */
  border-radius: 0!important;
  border: 2px outset ButtonHighlight!important;
  background: ButtonFace!important;
  -moz-margin-end: 2px!important; /* отступ между вкладками/закладками/меню */
  transition: all 100ms ease 0ms!important; /* это придаст плавность при смене впуклости/выпуклости (удалите строку, если не нужно */
}
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabbrowser-tab[selected=true]:not(:-moz-lwtheme),
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #PersonalToolbar toolbarbutton.bookmark-item:-moz-any([selected="true"],[open="true"],:hover,:active,[_moz-menuactive="true"]),
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #main-menubar > menu:-moz-any([selected="true"],[open="true"],:hover,:active,[_moz-menuactive="true"]),
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .toolbarbutton-1:not([disabled='true']):-moz-any([selected="true"],[open="true"],:hover,:active,[_moz-menuactive="true"]), /* это применит впуклость ко всем кнопкам. строка ниже - только к кнопкам на панели навигации. удалите эту, если не нужно */
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #nav-bar .toolbarbutton-1:not([disabled='true']):-moz-any([selected="true"],[open="true"],:hover,:active,[_moz-menuactive="true"]){
  border: 2px inset ButtonShadow!important;
  background: ButtonHighlight!important;
}
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #PersonalToolbar {
  padding-top: 2px!important; /* отступ между панелью навигации и панелью закладок*/
}

С отключенным CTB (перед отключением, возвращаем в дефолт все значения, иначе в CTR будет неактивна следующая опция), а в CTR выбираем:

Добавлено 30-05-2015 16:21:06
Еще подправил, а то при рестарте CTR снова перебивал некоторые стили.

Добавлено 30-05-2015 16:30:08
И еще поправил. Пропустил кнопку новой вкладки.

Отредактировано turbot (30-05-2015 16:30:08)

turbot · №1991

~~И еще, добавьте в конец второго стиля, если его выбрали:~~
В общем, еще подправил. Окончательный вариант второго стиля:

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

Выделить код

Код:

/*AGENT_SHEET*/
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabbrowser-tab > .tab-stack > .tab-content, .tabbrowser-tab[selected=true] > .tab-stack > .tab-content,
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabbrowser-tab:not([selected=true]):not(:-moz-lwtheme) > .tab-stack > .tab-content,.tabs-newtab-button:not(:-moz-lwtheme){
  border: none!important;
  border-radius: 0!important;
  padding-bottom: 4px!important;
  background: none!important;
}
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabbrowser-tab,
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabs-newtab-button:not(:-moz-lwtheme),
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #PersonalToolbar toolbarbutton.bookmark-item,
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #main-menubar > menu:not([disabled='true']),
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .toolbarbutton-1:not([disabled='true']), /* это применит выпуклость ко всем кнопкам. строка ниже - только к кнопкам на панели навигации. удалите эту, если не нужно */
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #nav-bar .toolbarbutton-1:not([disabled='true']){
  -moz-appearance: none !important;
  margin-bottom: 2px!important; /* отступ под вкладками/закладками/меню */
  border-radius: 0!important;
  border: 2px outset ButtonHighlight!important;
  background: ButtonFace!important;
  -moz-margin-end: 2px!important; /* отступ между вкладками/закладками/меню */
  transition: background 200ms ease 0ms, border 200ms ease 0ms!important; /* это придаст плавность при смене впуклости/выпуклости (удалите строку, если не нужно */
}
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabbrowser-tab[selected=true]:not(:-moz-lwtheme),
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #PersonalToolbar toolbarbutton.bookmark-item:-moz-any([selected="true"],[open="true"],:hover,:active,[_moz-menuactive="true"]),
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #main-menubar > menu:-moz-any([selected="true"],[open="true"],:hover,:active,[_moz-menuactive="true"]),
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .toolbarbutton-1:not([disabled='true']):-moz-any([selected="true"],[open="true"],:hover,:active,[_moz-menuactive="true"]), /* это применит впуклость ко всем кнопкам. строка ниже - только к кнопкам на панели навигации. удалите эту, если не нужно */
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #nav-bar .toolbarbutton-1:not([disabled='true']):-moz-any([selected="true"],[open="true"],:hover,:active,[_moz-menuactive="true"]){
  border: 2px inset ButtonShadow!important;
  background: ButtonHighlight!important;
}
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #PersonalToolbar {
  padding-top: 2px!important; /* отступ между панелью навигации и панелью закладок*/
}
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #main-menubar > menu[disabled='true'],
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .toolbarbutton-1[disabled='true'], /* это применит выпуклость ко всем кнопкам. строка ниже - только к кнопкам на панели навигации. удалите эту, если не нужно */
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #nav-bar .toolbarbutton-1[disabled='true']{
  -moz-appearance: none !important;
  margin-bottom: 2px!important; /* отступ под вкладками/закладками/меню */
  border-radius: 0!important;
  border: 2px outset transparent!important;
  background: transparent!important;
  -moz-margin-end: 2px!important; /* отступ между вкладками/закладками/меню */
  transition: background 200ms ease 0ms, border 200ms ease 0ms!important; /* это придаст плавность при смене впуклости/выпуклости (удалите строку, если не нужно */
}

Если не хотим, чтобы стиль применялся к кнопка в панели меню, то так:

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

Выделить код

Код:

/*AGENT_SHEET*/
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabbrowser-tab > .tab-stack > .tab-content, .tabbrowser-tab[selected=true] > .tab-stack > .tab-content,
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabbrowser-tab:not([selected=true]):not(:-moz-lwtheme) > .tab-stack > .tab-content,.tabs-newtab-button:not(:-moz-lwtheme){
  border: none!important;
  border-radius: 0!important;
  padding-bottom: 4px!important;
  background: none!important;
}
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabbrowser-tab,
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabs-newtab-button:not(:-moz-lwtheme),
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #PersonalToolbar toolbarbutton.bookmark-item,
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #main-menubar > menu:not([disabled='true']),
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .toolbarbutton-1:not([cui-anchorid="PanelUI-menu-button"]):not([disabled='true']), /* это применит выпуклость ко всем кнопкам. строка ниже - только к кнопкам на панели навигации. удалите эту, если не нужно */
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #nav-bar .toolbarbutton-1:not([disabled='true']){
  -moz-appearance: none !important;
  margin-bottom: 2px!important; /* отступ под вкладками/закладками/меню */
  border-radius: 0!important;
  border: 2px outset ButtonHighlight!important;
  background: ButtonFace!important;
  -moz-margin-end: 2px!important; /* отступ между вкладками/закладками/меню */
  transition: background 200ms ease 0ms, border 200ms ease 0ms!important; /* это придаст плавность при смене впуклости/выпуклости (удалите строку, если не нужно */
}
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .tabbrowser-tab[selected=true]:not(:-moz-lwtheme),
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #PersonalToolbar toolbarbutton.bookmark-item:-moz-any([selected="true"],[open="true"],:hover,:active,[_moz-menuactive="true"]),
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #main-menubar > menu:-moz-any([selected="true"],[open="true"],:hover,:active,[_moz-menuactive="true"]),
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .toolbarbutton-1:not([cui-anchorid="PanelUI-menu-button"]):not([disabled='true']):-moz-any([selected="true"],[open="true"],:hover,:active,[_moz-menuactive="true"]), /* это применит впуклость ко всем кнопкам. строка ниже - только к кнопкам на панели навигации. удалите эту, если не нужно */
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #nav-bar .toolbarbutton-1:not([disabled='true']):-moz-any([selected="true"],[open="true"],:hover,:active,[_moz-menuactive="true"]){
  border: 2px inset ButtonShadow!important;
  background: ButtonHighlight!important;
}
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #PersonalToolbar {
  padding-top: 2px!important; /* отступ между панелью навигации и панелью закладок*/
}
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #main-menubar > menu[disabled='true'],
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] .toolbarbutton-1:not([cui-anchorid="PanelUI-menu-button"])[disabled='true'], /* это применит выпуклость ко всем кнопкам. строка ниже - только к кнопкам на панели навигации. удалите эту, если не нужно */
#main-window:not(:-moz-lwtheme)[defaultfxtheme="true"] #nav-bar .toolbarbutton-1[disabled='true']{
  -moz-appearance: none !important;
  margin-bottom: 2px!important; /* отступ под вкладками/закладками/меню */
  border-radius: 0!important;
  border: 2px outset transparent!important;
  background: transparent!important;
  -moz-margin-end: 2px!important; /* отступ между вкладками/закладками/меню */
  transition: background 200ms ease 0ms, border 200ms ease 0ms!important; /* это придаст плавность при смене впуклости/выпуклости (удалите строку, если не нужно */
}

Отредактировано turbot (30-05-2015 18:13:06)

turbot · №1992

broker
Меняйте ссылки на локальные, вида: file:///C:/bla-bla/bla.png , либо. Или вообще, конвертируйте картинки в base64 (в гугле полно онлайн-конвертеров) и вставляйте их в таком виде.

villa7 · №1993

broker
Замените url("http://abload.de/img/kubrickbgcolor2darkr8skc.png")
на url("file:///C:/Firefox/Profile/chrome/1.png") понятно что путь к папке свой пропишите. И картинку в папку chrome положите 1.png, или base64 вставьте, но портянка будет большая.

Отредактировано villa7 (01-06-2015 16:44:49)

turbot · №1994

broker

broker пишет

чтоб не было привязки?

https://forum.mozilla-russia.org/viewto … 68#p682968 - по идее. С картинкой в base64, тоже будет без привязки.

broker пишет

правильно?

Да. Т.е:

Выделить код

Код:

url("data:image/png;base64,bla-bla-bla-остальной-код")

Добавлено 01-06-2015 17:00:14

turbot пишет

по идее

Т.е., в кавычках указываете только имя файла, а картинку кладете в папку chrome своего портабельного лиса.

Отредактировано turbot (01-06-2015 17:00:14)

turbot · №1995

broker
А где у вас стиль находится? Вы Stylish'ем пользуетесь? Так и надо было писать в соседнюю тему.

broker пишет

его создать?

Да. Создаете папку chrome в папке профиля браузера и в ней userContent.css (содержит стили для сайтов. userChrome.css - для браузера. Для применения стилей - нужен рестарт браузера.). Некоторые стили предназначенные для Stylish могут не работать или работать некорректно в нем. (Например, параметр /* AGENT_SHEET */ - в них не работает). Но в данном случае, я проверил, вроде порядок. Хотя, если стиль применялся к каким-то элементам браузера или внутренним страницам (about:, chrome: и т.п.), то продублируйте его в userChrome.css.

Отредактировано turbot (01-06-2015 17:47:35)

turbot · №1996

broker пишет

понимает

Да.

broker пишет

без результата

Что-то, значит, не так. Сам тоже Stylish'ем пользуюсь, но проверил:

- относительные пути работают.

villa7 · №1997

broker

userChrome.css понимает png? Такое очущение что нет все зделал закинул в папку и без результата.

userContent.css

turbot · №1998

broker
Все там нормально. Лишнее и ошибочное просто проигнорируется. У меня работает нормально на ютубе и с base64 и с файлом:

В Stylish'е других стилей нет, что перебивать могут? Этот стиль в нем отключили?

villa7 · №1999

"background-image: url("pebbydark.png") !important;"
на
"background: url("pebbydark.png") #222 !important;"

Отредактировано villa7 (01-06-2015 19:06:23)

turbot · №2000

О, точно. Не обратил внимания. Вообще, там еще и цвет дальше прописан. Полностью так должно выглядеть (убрал закомментированные строки для наглядности):

Не важно. villa7 уже дополнил.

Отредактировано turbot (01-06-2015 19:13:28)

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

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