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

leshiy_odessa · №3826

leshiy_odessa пишет

В классической теме Windows при открытии видео с youtube на весь экран на вертикальном скроле (1) появляется тень (2) и если закрыть табы, чтобы скрол исчез, то тень остается (3)

Отвечу сам себе. Автор CustomCSSforFx после моего репорта пофиксил в новом релизе.

Выделить код

Код:

.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-start-indicator:not([collapsed]),
.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-end-indicator:not([collapsed]) {
  opacity: 0 !important;
}

Vitaliy V. пишет

Скорей всего из-за псевдо-элемента, можно убрать так

Это не помогло, но всё равно спасибо.

Vitaliy V. пишет

Кстати насчёт многострочной панели вкладок, ваши стили так не могут https://vitaliyvstyle.github.io/stylesb … e/#image05

Могут. И вкладки выше адресной строки тоже.

Выделить код

Код:

/* BOOKMARKS TOOLBAR - MULTIPLE LINES ***********************************************************/
/* [!] the amount of visible bookmark items is limited internally to ~90-110 bookmarks **********/
/* [!] not compatible to 'bookmarks toolbar autohide' option ************************************/
/* - SUPPORT THREAD: https://github.com/aris-t2/customcssforfx/issues/99 ************************/
/* @import url(./css/toolbars/bookmarks_toolbar_multiple_lines.css); /**/ /* <--- EXPERIMENTAL */

css пишет

Результаты моей очередной самодеятельности:

Что-то у меня не сработало. Это весь код или нужно листать то что было выше?

Отредактировано leshiy_odessa (31-01-2018 22:49:39)

Vitaliy V. · №3827

leshiy_odessa пишет

Это не помогло

Ну у меня Win10 там нет классической темы, а виртуалку лень было запускать

leshiy_odessa пишет

Могут. И вкладки выше адресной строки тоже.

Что же интересно? Но нет не могут, сначала просмотрите до конца APNG анимацию может поймёте о чём речь... https://vitaliyvstyle.github.io/stylesb … e/#image05

Отредактировано Vitaliy V. (31-01-2018 23:09:44)

css · №3828

leshiy_odessa пишет

Что-то у меня не сработало

Я ж неполный код привела. Там только настройки для того, чтоб значки вообще можно было назначить и один пример. Сами значки указаны в моём коде ниже, я его не выкладывала. Вот код и сами значки http://www.mediafire.com/file/xumj1l20s81gzue/ContextMenuIcons.zip

leshiy_odessa · №3829

Vitaliy V. пишет

Но нет не могут, сначала просмотрите до конца APNG анимацию может поймёте о чём речь... https://vitaliyvstyle.github.io/stylesb … e/#image05

Вы написали про — «Кстати насчёт многострочной панели вкладок». На гифе я вижу вроде бы открытие табы в 4 строки. В CustomCSSforFx можно задать количество строк, а по их достижении появится скрол. Скрол в принципе можно убрать.

Отредактировано leshiy_odessa (31-01-2018 23:26:20)

Vitaliy V. · №3830

leshiy_odessa пишет

На гифе я вижу вроде бы открытие табы в 4 строки.

APNG а не GIF, 3 строки а не 4 но не в этом суть
1. прокрутка вкладок колесом мыши
2. перетаскивание вкладок в многострочном режиме
3. закреплённые вкладки всегда видимы независимо от положения прокрутки
4. при открытии вкладок и их выборе, вкладки прокручиваются чтобы выбранная стала видимой
Ну вот основное что не могут ваши стили.

Отредактировано Vitaliy V. (31-01-2018 23:41:50)

leshiy_odessa · №3831

Vitaliy V.

1. Не могут. Но подробно я не разбирался.
2. Могут, но кривовато. С некоторыми табами нормально, а с другими не очень. Но всегда получается любой таб перемести к первому закрепленному табу.
3. Не могут. Подробно не разбирался, там до чертиков субнастроек. Возможно что там и есть.
4. Почти понял о чем вы, но да, не прокручивается, фокуса на таб нет, хотя он может быть открыт.

Vitaliy V. · №3832

leshiy_odessa пишет

там до чертиков субнастроек. Возможно что там и есть.

нет это не так просто, одним стилем такое сделать и чтобы работало невозможно

Отредактировано Vitaliy V. (31-01-2018 23:57:07)

leshiy_odessa · №3833

css пишет

Зато вот такой код:
Выделить код
Код:
:-moz-any(menuitem[label*="Настройки"],menuitem[label*="Options"])
{list-style-image:url("./icons/options.png") !important;}
отлично работает

Вы не могли бы привести окончательный код и чуть подробнее? В идеале архив рабочими файлами. У меня такой код не заработал. Еще бы скриншоты не помешали. По моему это вообще супер идея сделать в меню по правой кнопке иконки.

Отредактировано leshiy_odessa (02-02-2018 11:30:54)

Viatcheslav · №3834

leshiy_odessa пишет

Вы не могли бы привести окончательный код и чуть подробнее? В идеале архив рабочими файлами

css пишет

Вот код и сами значки http://www.mediafire.com/file/xumj1l20s81gzue/ContextMenuIcons.zip

В стилях CustomCSSforFx от Aris включаются иконки к пунктам Назад, Обновить и Добавить в закладки (это у меня так включено и то из того, что успел заметить), одно с другим может конфликтовать

Phero · №3835

После обновления 58.0 стали большие интервалы между закладками в боковой панели закладок (избранного). Что с этим можно сделать?

css · №3836

Viatcheslav пишет

одно с другим может конфликтовать

Не факт, кстати. Стили редко яростно конфликтуют друг с другом, во всяком случае, я ни разу такого не встречала. Просто тот, который главнее, переписывает правила остальных. Зависит от порядка загрузки: тот, что позже прочтётся обработчиком, тот и в дамках. Максимальный негативный эффект от этого – либо неожиданный результат, либо кривое поведение текста ссылок.

leshiy_odessa, могу скинуть и скрины, если надо.

Вот ещё. Хотела добавить значки к контекстному меню для сайдбара, там где закладки и журнал. Но ничего не получается, переназначение -moz-binding просто не срабатывает. Соответственно, значкам банально некуда воткнуться. Это меню вообще особняком стоит, не в общем узле для контекстных меню, а в узле сайдбара.

Отредактировано css (03-02-2018 02:31:55)

Vitaliy V. · №3837

css пишет

Это меню вообще особняком стоит, не в общем узле для контекстных меню, а в узле сайдбара

Ну и что, какая разница? Это если стиль ограничен например только для браузера @-moz-document url("chrome://browser/content/browser.xul") { код }
тогда да для боковой панели не сработает, нужно или добавить нужный @-moz-document

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

Выделить код

Код:

@-moz-document url("chrome://browser/content/browser.xul"),  /* Окно браузера */
                           url("chrome://browser/content/bookmarks/bookmarksPanel.xul"),  /* Боковая панель - закладки */
                           url("chrome://browser/content/history/history-panel.xul"),  /* Боковая панель - история */
                           url("chrome://browser/content/places/places.xul") { /* Окно библиотеки */
menupopup#placesContext menuitem:-moz-any(#placesContext_open,[id="placesContext_open:newtab"],[id="placesContext_open:newwindow"],[id="placesContext_open:newprivatewindow"]) {
    -moz-binding: url("chrome://global/content/bindings/menu.xml#menuitem-iconic") !important;
}

menupopup#placesContext menuitem:-moz-any(#placesContext_open,[id="placesContext_open:newtab"],[id="placesContext_open:newwindow"],[id="placesContext_open:newprivatewindow"]) > .menu-iconic-left {
    -moz-appearance: menuimage !important;
    padding-top: 2px;
}

menuitem#placesContext_open {
    list-style-image: url("./svg/bookmark-16.svg") !important;
    -moz-image-region: auto !important;
}

menuitem[id="placesContext_open:newtab"] {
    list-style-image: url("./svg/bookmark-16.svg") !important;
    -moz-image-region: auto !important;
}

menuitem[id="placesContext_open:newwindow"] {
    list-style-image: url("./svg/bookmark-16.svg") !important;
    -moz-image-region: auto !important;
}

menuitem[id="placesContext_open:newprivatewindow"] {
    list-style-image: url("./svg/bookmark-16.svg") !important;
    -moz-image-region: auto !important;
}
}

или удалить их все

css пишет

Но ничего не получается, переназначение -moz-binding просто не срабатывает

всё срабатывает

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

Отредактировано Vitaliy V. (03-02-2018 13:47:44)

css · №3838

Vitaliy V. пишет

Это если стиль ограничен например только для браузера @-moz-document url("chrome://browser/content/browser.xul") { код }
тогда да для боковой панели не сработает, нужно или добавить нужный @-moz-document

Забыла про шапку... Искала, искала, где же ограничения, которые мешают, а в начало таблицы посмотреть не удосужилась. Спасибо!

Vitaliy V. пишет

всё срабатывает

Ну, дык. После правки шапки срабатывает, конечно. ) Но некоторые пункты пришлось через [id*=""] указывать. Потому что id выглядят типа ...new:folder. И в таблице это становится псевдоклассом, а такого псевдокласса, естественно, нет. Вот правило и не работает, если напрямую id указывать.

Viatcheslav · №3839

css пишет

Хотела добавить значки к контекстному меню для сайдбара, там где закладки и журнал
После правки шапки срабатывает, конечно. ) Но некоторые пункты пришлось через [id*=""] указывать

css, пожалуйста, если можно - дополните комплект http://www.mediafire.com/file/xumj1l20s … uIcons.zip меню для сайдбара. Думаю, многим будет интересно. Спасибо

css · №3840

Viatcheslav пишет

дополните комплект

Безусловно. Только я не дополнила, а сделала новый. Вот он, имя такое же. Огромное спасибо Vitaliy V. за помощь!
Может, для каких-то меню иконок нет, я не везде в браузере лазаю. Например, я не пользуюсь сайдбарными закладками, да и вообще редко сайдбар открываю. В квантуме он стал таким жалким, что смотреть не хочется. Но что нашла, включила в правила.

modern888 · №3841

Ребят, подскажите:
1. Как изменить цвет панели инструментов, сделать как у стандартной темы Firefox 56 (вместо серого светло синий - голубой)?
2. Возможно ли сделать прозрачной (однотонной) неактивную вкладку?

Как оно сейчас:

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

Как нужно сделать:

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

Использую Firefox 58.0.1.
Спасибо

Viatcheslav · №3842

modern888 пишет

Ребят, подскажите:
1. Как изменить цвет панели инструментов, сделать как у стандартной темы Firefox 56 (вместо серого светло синий - голубой)?
2. Возможно ли сделать прозрачной (однотонной) неактивную вкладку?

Попробуйте научиться пользоваться комплектом стилей - Aris-t2/CustomCSSforFx. Внутри файлов userChrome.css и userContent.css есть описание, как всем этим пользоваться

base239 · №3843

Viatcheslav пишет

modern888 пишет
Ребят, подскажите:
1. Как изменить цвет панели инструментов, сделать как у стандартной темы Firefox 56 (вместо серого светло синий - голубой)?
2. Возможно ли сделать прозрачной (однотонной) неактивную вкладку?
Попробуйте научиться пользоваться комплектом стилей - Aris-t2/CustomCSSforFx. Внутри файлов userChrome.css и userContent.css есть описание, как всем этим пользоваться

А как пользоваться всей этой красотой?.. в папке image картинок много, а как их применять нигде ненаписано!.. :blush:

wrong · №3844

modern888 пишет

Ребят, подскажите:
1. Как изменить цвет панели инструментов, сделать как у стандартной темы Firefox 56 (вместо серого светло синий - голубой)?
2. Возможно ли сделать прозрачной (однотонной) неактивную вкладку?
Как оно сейчас:
скрытый текст
https://c.radikal.ru/c15/1802/56/dde6b09ce6a1.jpg

Как нужно сделать:
скрытый текст
https://d.radikal.ru/d03/1802/6e/fae6bb93c5ea.jpg

Использую Firefox 58.0.1.
Спасибо

Подправил на светло-голубой стиль от Wilfred Wee

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

Выделить код

Код:

:root {
  --tab-curve-width: 30px;
  --tabs-border: transparent !important;
}

.arrowscrollbox-scrollbox {
  padding-inline-start: 10px !important;
}

/* To be able to see the top border of the tab */
.tab-stack {
  margin-top: 2px !important;
}

/* When the window is maximized, the first pinned tab is properly displayed. */
#TabsToolbar  {
  padding-inline-start: 15px !important;
}

.titlebar-placeholder {
  border: none !important;
}

/* Remove unneeded styles from Photon */
.tabbrowser-tab::before,
.tabbrowser-tab::after {
  border: none !important;
}

.tabbrowser-tab > .tab-stack > .tab-background {
  background-image: none !important;
  -moz-box-orient: horizontal !important;
  background-color: transparent !important;
  margin-top: 1px !important;
}

.tab-background[selected="true"] {
  border: none !important;
}

.tab-line {
  display: none !important;
}

.tab-bottom-line {
  display: none !important;
}

/* Match height of new tab button (right svg) on hover */
.tabs-newtab-button {
  margin: 0 !important;
}

/* overlap the tab curves */
.tab-background {
  -moz-margin-end: -15px !important;
  -moz-margin-start: -15px !important;
}

/* Begin tab background customizations */
.tab-background[selected="true"]::before {
  border: none !important;
  content: "" !important;
  width: 30px !important;
  min-height: 30px !important;
  display: -moz-box !important;
  background-repeat: no-repeat !important;
}

.tab-background[selected="true"]::after {
  border: none !important;
  content: "" !important;
  width: 30px !important;
  min-height: 30px !important;
  display: -moz-box !important;
  background-repeat: no-repeat !important;
}

.tab-background[selected="true"] > spacer {
  margin-top: 0px !important;
}

#new-tab-button,
.tabs-newtab-button {
  width: calc(36px + 30px) !important;
  margin-inline-start: -15px !important;
  margin-top: 1px !important;
}

/* Tab hover customizations */

/* Regular tabs */
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::before {
  display: -moz-box !important;
  background-repeat: no-repeat !important;
  content: "" !important;
  width: 30px !important;
  max-height: 30px !important;
  background-color: transparent !important;
}

.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::after {
  display: -moz-box !important;
  background-repeat: no-repeat !important;
  content: "" !important;
  width: 30px !important;
  max-height: 30px !important;
  background-color: transparent !important;
}

.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]) > spacer {
  margin-top: 0px !important;
}

#TabsToolbar[brighttext] > #tabbrowser-tabs > .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"]),
.tabs-newtab-button:hover,
.tabs-newtab-button:hover::before,
.tabs-newtab-button:hover::after {
  background-color: transparent !important;
}

/* New tab hover customizations */
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"]), .tabs-newtab-button:hover {
  background-position: 0px 2px, 30px 4px , 36px 2px !important;
  background-repeat: no-repeat !important;
  background-size: 30px 30px, calc(100% - (2 * 30px)) 30px, 30px !important;
}

.tabs-newtab-button:hover > .toolbarbutton-icon {
  background: none !important;
  background-color: transparent !important;
}

/* Color specific customizations */
:root {
  --svg-selected-before: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgb(233,243,252);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>");

  --svg-selected-after: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgb(233,243,252);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>");

  --background-selected-middle:
    linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)),
    linear-gradient(
      transparent
      2px,
      rgb(233,243,252) 2px,
      rgb(233,243,252)
    ),
    none;

  --svg-hover-before: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='30px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='30' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgba(0,0,0, .1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>");

  --svg-hover-after: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgba(0,0,0,.1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>");

  --background-hover-middle:
    linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)),
    linear-gradient(
      transparent
      2px,
      rgba(0,0,0,.1) 2px,
      rgba(0,0,0,.1)
    ),
    none !important;

  --newtab-hover: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgba(0,0,0,.1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"),
    linear-gradient(rgba(0,0,0,.1), rgba(0,0,0,.1)),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='30px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgba(0,0,0,.1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>");
}


/* OS-specific color variables */
@media screen and (-moz-windows-theme) {
  :root {

  }
}

@media not screen and (-moz-windows-theme) {
  :root {

  }
}

.tab-background[selected="true"]::before {
  background-image: var(--svg-selected-before) !important;
}

.tab-background[selected="true"]::after {
  background-image: var(--svg-selected-after) !important;
}

.tab-background[selected="true"] > spacer {
 background-image: var(--background-selected-middle) !important;
}

.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::before {
  background-image: var(--svg-hover-before) !important;
}

.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::after {
  background-image: var(--svg-hover-after) !important;
}

.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]) > spacer {
  background-image: var(--background-hover-middle) !important;

}

.tabs-newtab-button:hover {
  background-image: var(--newtab-hover) !important;
}

#nav-bar {background: #e9f3fc !important;
}

Viatcheslav · №3845

base239 пишет

А как пользоваться всей этой красотой?.. в папке image картинок много, а как их применять нигде ненаписано!..

Скачайте архив по ссылке 'Classic' CSS tweaks for Firefox 57+ v1.6.4 и распакуйте в папку chrome внутри профиля [firefox] . Открывайте файлы userChrome.css и userContent.css любым текстовым редактором. В шапке текста есть такое

ENABLING options: remove the combination of / and * before '@import'.
DISABLING options: add the combination of / and * before '@import'.

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

only use one at a time

то сие означает, что включить (т. е. удалить в начале строки символы /*) можно только одну настройку из всей группы. Пробуйте, экспериментируйте, спрашивайте - помогу я или другой кто-нибудь

Отредактировано Viatcheslav (04-02-2018 13:03:13)

modern888 · №3846

Viatcheslav пишет

Попробуйте научиться пользоваться комплектом стилей - Aris-t2/CustomCSSforFx. Внутри файлов userChrome.css и userContent.css есть описание, как всем этим пользоваться

wrong пишет

Подправил на светло-голубой стиль от Wilfred Wee

Немного разобрался с CustomCSSforFx. Неактивную вкладку прозрачной сделать не получается, да и фиг с ней. А стиль панели инструментов я научился менять.
Цвет #e9f3fc, предложенный товарищем wrong немного не совпадает.

Как узнать цвет который был на FF56 и ниже, откуда его выдернуть (может в каком то файле хранятся параметры стандартных тем)?

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

Как оно сейчас

Отличие цвета

Появляется уже спортивный интерес ко всему этому. А на Google Chrome менять дизайн так можно?

Отредактировано modern888 (04-02-2018 13:59:07)

css · №3847

modern888 пишет

Как узнать цвет который был на FF56 и ниже

Самый простой способ, имхо, найти скрин и сграбить какой-нибудь пипеткой типа ColorZilla. У нижней части 2го скрина цвет #DBEBFA.

base239 · №3848

Viatcheslav пишет

base239 пишет
А как пользоваться всей этой красотой?.. в папке image картинок много, а как их применять нигде ненаписано!..
Скачайте архив по ссылке 'Classic' CSS tweaks for Firefox 57+ v1.6.4 и распакуйте в папку chrome внутри профиля . Открывайте файлы userChrome.css и userContent.css любым текстовым редактором. В шапке текста есть такое
ENABLING options: remove the combination of / and * before '@import'.
DISABLING options: add the combination of / and * before '@import'.
Тут даже моих знаний английского достаточно, чтобы понять. Если перед группой настроек есть фраза
only use one at a time
то сие означает, что включить (т. е. удалить в начале строки символы /*) можно только одну настройку из всей группы. Пробуйте, экспериментируйте, спрашивайте - помогу я или другой кто-нибудь

А тут-же еще закладки становятся под адресную строку? Не подскажете как сделать нужно?..

Viatcheslav · №3849

modern888 пишет

Немного разобрался с CustomCSSforFx. Неактивную вкладку прозрачной сделать не получается, да и фиг с ней

Нормальные парни не сдаются так легко В файле userChrome.css в разделе TABS - appearance and position включите (т. е. удалите в начале строки символы /*), например, @import url(./css/tabs/classic_squared_tabs_australized_aero.css);

base239 пишет

А тут-же еще закладки становятся под адресную строку? Не подскажете как сделать нужно?

Закладки не пробовал, а вкладки ниже панели навигации ставятся так. В файле userChrome.css в разделе TABS TOOLBAR POSITION (not in titlebar / not on top) оставить неактивной (добавить впереди /*) @import url(./css/tabs/tabs_below_titlebar_above_navigation_toolbar.css);, включить @import url(./css/tabs/tabs_below_navigation_toolbar.css);. В таком положении панель закладок находится ниже адресной строки и над вкладками. Описание даю для версии 1.4.7 - в последней (1.6.5.1), может, чего изменилось

Для удобства, чтобы после каждого изменения файлов userChrome.css и userContent.css не перезапускать [firefox] , можно пользоваться кнопкой для перезапуска этих файлов - https://forum.mozilla-russia.org/viewto … 39#p747839

Отредактировано Viatcheslav (04-02-2018 18:40:16)

base239 · №3850

Viatcheslav пишет

modern888 пишет
Немного разобрался с CustomCSSforFx. Неактивную вкладку прозрачной сделать не получается, да и фиг с ней
Нормальные парни не сдаются так легко В файле userChrome.css в разделе TABS - appearance and position включите (т. е. удалите в начале строки символы /*), например, @import url(./css/tabs/classic_squared_tabs_australized_aero.css);
base239 пишет
А тут-же еще закладки становятся под адресную строку? Не подскажете как сделать нужно?
Закладки не пробовал, а вкладки ниже панели навигации ставятся так. В файле userChrome.css в разделе TABS TOOLBAR POSITION (not in titlebar / not on top) оставить неактивной (добавить впереди /*) @import url(./css/tabs/tabs_below_titlebar_above_navigation_toolbar.css);, включить @import url(./css/tabs/tabs_below_navigation_toolbar.css);. В таком положении панель закладок находится ниже адресной строки и над вкладками. Описание даю для версии 1.4.7 - в последней (1.6.5.1), может, чего изменилось
Для удобства, чтобы после каждого изменения файлов userChrome.css и userContent.css не перезапускать , можно пользоваться кнопкой для перезапуска этих файлов - https://forum.mozilla-russia.org/viewto … 39#p747839

Спасибо! Все получилось, панель внизу, только кнопку на перезагрузку не могу найти?.. куда встала?

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

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