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

vending_machine · №10951

momo2000 пишет

vending_machine пишет

И как вернуть жёлтые значки папок в закладках?

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

Код:

.bookmark-item[container] {
  list-style-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAADAFBMVEXOzs7d3d3b29vY2NjZ2dnW1tbBwcGvr6/Gxsa8vLy0tLSxsbF3d3fQ0NDS0tLU1NTJycmhoaG4uLi2tra0tLTIyMjPz8++vr67u7vNzc2SkpJ9fX3byXitra3ExMS5ubnNzMW/v7/Ly8uamprDr1S1ok/ItFmzoVGysrKNjY2JiYmGhoaCgoK5qWS4qmiTk5PMw5/HwaO8vLzJycnExMSYmJiioqKrq6uzs7O4uLi6urrGxsbFxcW4uLi5ubnGxsbHx8evm0fw8PDfxlvOt1T8/Pz898Hr6+v6+vr09PT4+Pjx34Lpz1/79LT687H58Kz47aTy4ojx4Ibu2nft7e379Ln47qf05pXw3X/v23ru2XT68a7476n366D26Zzv3H3awli+qU3+/v789r779bfz44zt13G1oUns1m3UvFbPuFW5pEvExMT377L47rD16Jjz5JDz5I7t3oTr1GrIslLErlAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAZ/mX8AAABAHRSTlMA////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////Cpf0PAAAALdJREFUGFc9zskOgjAUheHu9CFI1MRhpdFHIN50QylTmOcwCcRZ399bJJzd/7UlECKdp0lELKO4orBx2Qhlqao81CLtDy0dW3faATo6tKPHejcAUM7DCDuJYSngQ7mGnbhuDdsjwrfQsCpTqRhc1wi57T4qw1RSk8E9F3B7Ynq+pTAwBPSOOPatwEPoEZpY8VIrqC8+QiMgwevYb4vBa4Mgu/gF8SRgsDshHORp++HHVrNpi9Wc/ADuhj/7YwIMHwAAAABJRU5ErkJggg==") !important;
}

Спасибо.

Однако же всё же как уменьшить высоту вкладок? И поменять цвет неактивных вкладок (и панели), и соответственно цвет шрифта на них?
Воспользовался Firefox Color, но он меняет цвет когда браузер в фоне.

harryk · №10952

vending_machine
Про высоту здесь

kokoss · №10953

vending_machine пишет

Однако же всё же как уменьшить высоту вкладок?

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

Выделить код

Код:

#titlebar,
#tabbrowser-tabs {
    --tab-min-height: 26px !important;
}

Djon776 · №10954

vending_machine пишет

vending_machine

Не помогает. По ходу придется подождать решение.

Vitaliy V. · №10955

momo2000 пишет

отрубить функцию выключения звука на значке динамика вкладки, чтоб был не кликабелен?

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

Выделить код

Код:

.tab-icon-overlay:not([sharing],[crashed]):is([soundplaying],[muted],[activemedia-blocked]) {
    pointer-events: none !important;
}

vending_machine · №10956

harryk
kokoss

Спасибо.

katari4688908 · №10957

kokoss пишет

vending_machine пишетОднако же всё же как уменьшить высоту вкладок?скрытый текстВыделить кодКод:#titlebar,
#tabbrowser-tabs {
--tab-min-height: 26px !important;
}

замучательно. спасибо.
подправил для себя до 30px - в самый раз.

vending_machine · №10958

Всё же хотелось б сделать панель вкладок и неактивные вкладки - цветов этого форума - тёмно-серо-синими с белыми буквами
и белой активной вкладкой с чёрными буквами.

Количество тем на addons.mozilla.org с чёрными буквами на активной вкладке и белыми на неактивной вкладке очень мало. Нашёл пока всего две (из сотен). Но цвет или синий поглощает белые буквы или серо-сиреневый какой-то поглощает чёрные буквы на панели закладок.
¡Light Blue Theme!
Arctic Nord Theme

momo2000 · №10959

Djon776
https://forum.mozilla-russia.org/viewto … 10#p792410
Vitaliy V.

Выделить код

Код:

.tab-icon-overlay:not([sharing],[crashed]):is([soundplaying],[muted],[activemedia-blocked]) {
    pointer-events: none !important;
}

https://ic.pics.livejournal.com/igor_ts … iginal.jpg

Отредактировано momo2000 (11-08-2021 20:35:13)

Crimea · №10960

Уважаемые, подскажите, что и как! После обновления до 91-й версии опять появились интервалы в меню закладок (и контекстном меню), тут https://forum.mozilla-russia.org/viewto … 67#p792667 советуют применить некий код... Куда его вставить? Как применить? Ничё не могу понять!
P.S. Файл userChrome.css не нашёл.

Отредактировано Crimea (11-08-2021 21:17:26)

Pifontiy · №10961

Crimea
Здесь https://forum.mozilla-russia.org/viewtopic.php?pid=792730#p792730 смотреть...

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

Отредактировано Pifontiy (11-08-2021 21:26:58)

sandro79 · №10962

vending_machine пишет

Всё же хотелось б сделать панель вкладок и неактивные вкладки - цветов этого форума - тёмно-серо-синими с белыми буквами
и белой активной вкладкой с чёрными буквами.

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

Выделить код

Код:

:root {
    --tab-selected-bgcolor: white !important;
    --lwt-selected-tab-background-color: white !important;
}
.tabbrowser-tab[selected="true"] .tab-label {
    color: black !important;
     text-shadow: none !important;
}
.tabbrowser-tab[selected="true"] .close-icon {
    color: black !important;
}
.tabbrowser-tab > .tab-stack > .tab-background:not([selected="true"], [multiselected]) {
    background-color: #4e78a0 !important;
}
.tabbrowser-tab:not([selected="true"], [multiselected]) .tab-label {
    color: white !important;
}
.tabbrowser-tab:not([selected="true"], [multiselected]) .close-icon {
    color: white !important;
}
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"], [multiselected]) {
    background-color: #25598a !important;
}
#TabsToolbar {
    background-color: #4e78a0 !important;
}

Отредактировано sandro79 (12-08-2021 01:58:46)

egorsemenov06 · №10963

Vitaliy V. Можно ли сделать эту область что бы цвет брался из системной темы Аэро на windows 7

и как сделать что бы на логинах был такой же цвет как в выпадающих менюшках строки поиска и адреса

[firefox] 91.0

Отредактировано egorsemenov06 (12-08-2021 02:10:34)

Злой Буратино · №10964

Подскажите, можно ли как-то увеличить по ширине саму зону, в которой находятся превьюшки закреплённых сайтов на новой вкладке? Т.е. мне надо , чтобы при заданном в css-стиле размере превьюшек их помещалось больше в ряд.

Отредактировано Злой Буратино (12-08-2021 08:45:27)

Crimea · №10965

Pifontiy пишет

Здесь https://forum.mozilla-russia.org/viewtopic.php?pid=792730#p792730 смотреть

Благодарность!
Но интересное, или скорее, странное дело: дома 10-ка х64, на работе 7-ка х64, так вот на работе после обновления всё как и было, никаких интервалов не добавилось! А так хотел всё это попробовать! Ну а дома уже буду менять как рекомендовано!

Отредактировано Crimea (12-08-2021 08:54:17)

sandro79 · №10966

Злой Буратино
https://forum.mozilla-russia.org/viewto … 41#p792841 и далее.

Crimea пишет

Но интересное, или скорее, странное дело: дома 10-ка х64, на работе 7-ка х64, так вот на работе после обновления всё как и было, никаких интервалов не добавилось!

На [windows] 7 разработчикам [firefox] удалось пока лишь частично реализовать все прелести Протона.
Но они делают всё возможное, и начиная с 92-oй версии, у папок на панели закладок им удалось всё-таки внедрить эти раздутые протоновские меню.
Да и 7-ка уже как бы устаревшая ОС, глядишь, и скоро вообще для неё с какой-то версии [firefox] уберут поддержку.

OlegCh · №10967

Для уменьшения межстрочного интервала между закладками и в контекстном меню помог код из этого сообщения:
https://forum.mozilla-russia.org/viewtopic.php?pid=792660#p792660 :

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

Выделить код

Код:

@media (-moz-os-version: windows-win10) {
menupopup > menuitem, menupopup > menu {
	padding-block: 2px !important;
	padding-inline-start: 12px !important;
}
/* выровнять положение подменю... необязательно */
menupopup > menu > menupopup {
	margin-inline-start: -2px !important;
	margin-top: -5px !important;
}
}

Спасибо тебе, добрый человек! Два дня мучился. Разработчики Мозиллы - и вам тоже "спасибо"...

Отредактировано OlegCh (12-08-2021 10:19:32)

leshiy_odessa · №10968

OlegCh пишет

Для уменьшения межстрочного интервала между закладками и в контекстном меню помог код из этого сообщения:

Мне больше понравился этот код — popup_compact_menus.css

Vitaliy V. · №10969

egorsemenov06 пишет

Можно ли сделать эту область что бы цвет брался из системной темы Аэро на windows 7

У меня сейчас нет [windows] 7 и посмотреть как там протон выглядит не могу, но раньше эта область была нативной.
Или у вас тема установлена?

egorsemenov06 пишет

как сделать что бы на логинах был такой же цвет как в выпадающих менюшках строки поиска и адреса

цвета свои можно

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

Выделить код

Код:

#PopupAutoComplete {
    --panel-color: var(--toolbar-field-focus-color, FieldText) !important;
    --panel-background: var(--toolbar-field-focus-background-color, Field) !important;
    --panel-border-color: var(--arrowpanel-border-color, ThreeDShadow) !important;
}

Отредактировано Vitaliy V. (12-08-2021 13:25:06)

Eggorka · №10970

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

egorsemenov06 · №10971

Vitaliy V. пишет

egorsemenov06 пишет
Можно ли сделать эту область что бы цвет брался из системной темы Аэро на windows 7
У меня сейчас нет 7 и посмотреть как там протон выглядит не могу, но раньше эта область была нативной.
Или у вас тема установлена?

egorsemenov06 пишет
как сделать что бы на логинах был такой же цвет как в выпадающих менюшках строки поиска и адреса
цвета свои можно
скрытый текст
Выделить код
Код:
#PopupAutoComplete {
    --panel-color: var(--toolbar-field-focus-color, FieldText) !important;
    --panel-background: var(--toolbar-field-focus-background-color, Field) !important;
    --panel-border-color: var(--arrowpanel-border-color, ThreeDShadow) !important;
}

Большое спасибо!!!
нет тема не устоновлена стоит стиль для табов

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

Выделить код

Код:

:root {
  --tab-curve-width: 26px;
  --tabs-border: transparent !important;
  --tab-border-radius: 0 !important;
}

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

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

/* To prevent tab label appearing on pinned tab in compact mode. */
.tab-content {
  padding: 0 12px !important;
}

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

.tabbrowser-tab[first-visible-tab="true"] {
  padding-left: 12px !important;
}

#tabbrowser-tabs {
  margin-left: -15px !important;
}

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

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

/* Styles to account for when tab scrollbar is visible, and margin-inline-start kicks in */
.tabbrowser-tab[pinned="true"] {
  width: 40px !important; /* Actual photon pinned tab is 41px, but 40px removes pixelated artifact from pinned tab favicon */
}

.tabbrowser-tab[pinned="true"][style^="margin-inline-start"] {
  padding-left: 12px !important;
}

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

/* Remove uneeded styles from Proton */
.tabbrowser-tab {
  padding-inline: 0px !important;
}

.tab-background {
  margin-bottom: 0 !important;
  display: flex !important;
}

.tab-background > .tab-context-line {
  flex: 1 !important;
}

#tabbrowser-tabs[haspinnedtabs]:not([positionpinnedtabs]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab[first-visible-unpinned-tab] {
  margin-inline-start: 0px !important;
}

/* Remove container colors */
.tabbrowser-tab[usercontextid] > .tab-stack > .tab-background > .tab-context-line {
  background-color: rgba(0,0,0,0) !important;
  height: inherit !important;
  border-radius: 0px !important;
  margin: 0px !important;
}

/* Default theme customization: Vibrant (transparent, dark) titlebar for mac */
:root:is([inFullscreen], [tabsintitlebar]) #TabsToolbar:not(:-moz-lwtheme) {
  appearance: auto !important;
  -moz-default-appearance: -moz-mac-vibrant-titlebar-dark !important;
  -moz-font-smoothing-background-color: -moz-mac-vibrant-titlebar-dark !important;
  background-color: #232323 !important;
  color: hsl(240, 9%, 98%) !important;
  text-shadow: none !important;
}

#navigator-toolbox {
  background-color: transparent !important;
}

#new-tab-button > .toolbarbutton-icon,
#tabs-newtab-button > .toolbarbutton-icon {
  fill: rgb(249,249,250) !important;
}
/* End default theme customizations */

/* Windows 7 specific */
@media (-moz-os-version: windows-win7) {
  .tabbrowser-tab {
    background-color: transparent !important;
    border: none !important;
  }

  @media (-moz-windows-default-theme) {
    .tabbrowser-tab:not(:-moz-lwtheme) {
      background-color: transparent !important;
      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-background {
  pointer-events: 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;
}

/* Remove blue animation on tab on page load complete */
.tab-loading-burst {
  display: none !important;
}

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

.tab-background[selected="true"]::after {
  border: none !important;
  content: "" !important;
  width: 26px !important;
  min-height: 26px !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 */
.close-icon:hover {
  border-radius: 50% !important;
}
 .tab-close-button:hover {
  fill: red !important;
  padding: 3px !important;
} 
.tab-close-button {
	width: 20px !important;
	height: 20px !important;
	padding: 3px !important;
}
/* 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: 26px !important;
  max-height: 26px !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: 26px !important;
  max-height: 26px !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='26px' height='27px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.065 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.065 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.065 -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.065 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='26' height='27' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgb(249,249,250);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='26px' height='27px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.065 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.065 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.065 -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.065 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='26' height='27' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgb(249, 249, 255);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(249,249,255) 2px,
      rgb(249,249,255)
    ),
    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='26px' height='26px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.065 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.065 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.065 -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.065 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='26' height='26' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgba(255, 255, 255, .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='26px' height='27px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.065 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.065 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.065 -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.065 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='26' height='27' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgba(255, 255, 255,.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(255,255,255,.1) 2px,
      rgba(255,255,255,.1)
    ),
    none;

  --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='26px' height='26px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.065 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.065 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.065 -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.065 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='26' height='27' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgba(255,255,255,.1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"),
  linear-gradient(rgba(255,255,255,.1), rgba(255,255,255,.1)),
  url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='26px' height='27px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.065 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.065 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.065 -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.065 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='26' height='27' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgba(255,255,255,.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"] > .tab-context-line {
  background-image: var(--background-selected-middle) !important;
}

.tabbrowser-tab[visuallyselected="true"] > .tab-stack > .tab-background {
  box-shadow: none !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]) > .tab-context-line {
  background-image: var(--background-hover-middle) !important;
}

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

вот так выгледит без этого стиля

а так с этим стилем

Отредактировано egorsemenov06 (12-08-2021 14:49:38)

vending_machine · №10972

sandro79 пишет

vending_machine пишет
Всё же хотелось б сделать панель вкладок и неактивные вкладки - цветов этого форума - тёмно-серо-синими с белыми буквами
и белой активной вкладкой с чёрными буквами.
скрытый текст
Выделить код
Код:
:root {
    --tab-selected-bgcolor: white !important;
    --lwt-selected-tab-background-color: white !important;
}
.tabbrowser-tab[selected="true"] .tab-label {
    color: black !important;
     text-shadow: none !important;
}
.tabbrowser-tab[selected="true"] .close-icon {
    color: black !important;
}
.tabbrowser-tab > .tab-stack > .tab-background:not([selected="true"], [multiselected]) {
    background-color: #4e78a0 !important;
}
.tabbrowser-tab:not([selected="true"], [multiselected]) .tab-label {
    color: white !important;
}
.tabbrowser-tab:not([selected="true"], [multiselected]) .close-icon {
    color: white !important;
}
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"], [multiselected]) {
    background-color: #25598a !important;
}
#TabsToolbar {
    background-color: #4e78a0 !important;
}

Спасибо.
Есть нюанс: стали невидны кнопки свернуть, свернуть в окно, закрыть.

Stkvsky · №10973

Vitaliy V. пишет

скорее всего вы перепутали about:newtab с about:home

Видимо да, разобрался, но не понимаю почему
Так не работает:
Когда указана новая вкладка:пустая страница

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

Так работает: (если изменить на домашнюю страницу)

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

Странно как то в коде указано не about:home, а about:newtab
Ну да ладно, главное работает
Спасибо большое за помощь

sandro79 · №10974

vending_machine пишет

стали невидны кнопки свернуть, свернуть в окно, закрыть

Скриншот бы посмотреть. Можно цвет сменить

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

Выделить код

Код:

.titlebar-buttonbox > .titlebar-button {
    color: white !important;
}

или кнопки

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

Выделить код

Код:

.titlebar-min {
	list-style-image: url(chrome://browser/skin/window-controls/minimize-themes.svg) !important;
}
.titlebar-max {
	list-style-image: url(chrome://browser/skin/window-controls/maximize-themes.svg) !important;
}
.titlebar-restore {
	list-style-image: url(chrome://browser/skin/window-controls/restore-themes.svg) !important;
}
.titlebar-close {
	list-style-image: url(chrome://browser/skin/window-controls/close-themes.svg) !important;
}

Уменьшение кнопок управления окном для win10

Отредактировано sandro79 (12-08-2021 16:00:13)

Vitaliy V. · №10975

egorsemenov06
убрать туман на панели вкладок

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

Выделить код

Код:

#TabsToolbar {
    background-image: none !important;
}

и удалите в вашем стиле правило

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

/* Default theme customization: Vibrant (transparent, dark) titlebar for mac */
:root:is([inFullscreen], [tabsintitlebar]) #TabsToolbar:not(:-moz-lwtheme) {
appearance: auto !important;
-moz-default-appearance: -moz-mac-vibrant-titlebar-dark !important;
-moz-font-smoothing-background-color: -moz-mac-vibrant-titlebar-dark !important;
background-color: #232323 !important;
color: hsl(240, 9%, 98%) !important;
text-shadow: none !important;
}

Stkvsky пишет

Так не работает:
Когда указана новая вкладка:пустая страница

Пустая страница это about:blank
А домашняя страница [firefox] по умолчанию - about:newtab и about:home (при открытии окна)

Отредактировано Vitaliy V. (12-08-2021 16:40:54)

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

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