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

GOROOOO · №12351

Добрый вечер. Хочу заставить принудительно отображать фавиконку для закладки сайта. Нашел такой код

Код:

#PlacesToolbarItems > toolbarbutton.bookmark-item[container][label="имя_закладки"] { list-style-image: url("адрес_иконки") !important; }

но у меня не получилось чтоб он заработал. Есть рабочее решение? Сайт https://lk.megafon.ru фавиконка вроде https://lk.megafon.ru/public/rwlk/static/cdc5504119f8d0058c38.svg

_zt · №12352

GOROOOO
Это для папок корня панели закладок.

Выделить код

Код:

toolbarbutton.bookmark-item[container="true"][label="..."] > .toolbarbutton-icon {
    list-style-image: url("...") !important;
}

Для отдельных закладок панели закладок любой вложенности так:

Выделить код

Код:

.bookmark-item:not([container])[label="..."] image {
    object-position: ??px ??px !important;
    list-style-image: none !important;
    background: url("...") !important;
}

или по домену

.bookmark-item[image^="page-icon:https://домен.ком"] image {
    object-position: ??px ??px !important;
    list-style-image: none !important;
    background: url("...") !important;
}

На 105 все это еще работало, на 106 не проверял.

Отредактировано _zt (08-11-2022 18:15:12)

sandro79 · №12353

Neytrino пишет

Обводка активной вкладки - нашёл такой код:

У меня он вообще не сработал, может так попробовать

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

Выделить код

Код:

#tabbrowser-tabs .tab-background {
  border: 1px solid AccentColor;
  box-shadow: none !important;
}

Duche пишет

Не могу победить изменение адресной строки, изменил цвет, размер, форму

Там так просто не победить, строка же раздвигается при фокусе. Попробуйте такой способ, ненужное выкиньте. Цвета бордюров я свои вставил, для наглядности.

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

Выделить код

Код:

#urlbar, #searchbar {
  --urlbar-min-height: 22px !important;
  --urlbar-icon-padding: 2px !important;
}
.urlbarView {
  display: none !important;
}
#urlbar-input-container {
  border-radius: 50px !important;
}
#urlbar[breakout][breakout-extend] {
  width: 100% !important;
  top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !important;
  left: 0 !important;
}
#urlbar[breakout][breakout-extend] > #urlbar-input-container {
  height: var(--urlbar-height) !important;
  padding-block: var(--urlbar-container-padding) !important;
  padding-inline: var(--urlbar-container-padding) !important;
  border-radius: 50px !important;
}
#urlbar > #urlbar-background, #searchbar {
  border-color: gold !important;
  border-radius: 50px !important;
  background-color: #dbebf5 !important;
}
#urlbar[focused="true"] > #urlbar-background, #searchbar:focus-within {
  outline: none !important;
  border-color: red !important;
  border-radius: 50px !important;
  background-color: #dbebf5 !important;
  box-shadow: none !important;
}

Другой вариант, получше вроде

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

Выделить код

Код:

#urlbar[breakout][breakout-extend] {
  width: 100% !important;
  top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !important;
  left: 0 !important;
}
#urlbar[breakout][breakout-extend] > #urlbar-background {
  animation-duration: 0s !important;
}
#urlbar[breakout][breakout-extend] > #urlbar-input-container {
  height: var(--urlbar-height) !important;
  padding-block: var(--urlbar-container-padding) !important;
  padding-inline: var(--urlbar-container-padding) !important;
}
#urlbar[focused="true"] > #urlbar-background, #searchbar:focus-within {
  outline: none !important;
  border-color: grey !important;
  box-shadow: none !important;
}
#urlbar-background, #searchbar {
  --toolbar-field-border-color: ThreeDShadow;
}
#PopupSearchAutoComplete {
  --arrowpanel-border-color: grey;
}
#urlbar-background, #searchbar {
  --toolbarbutton-border-radius: 2px;
}
#urlbar-container, #search-container {
  --urlbar-margin-inline: 2px;
}

GOROOOO пишет

Есть рабочее решение?

Этот метод пока работает. Так попробуйте

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

Выделить код

Код:

.bookmark-item:not([container])[image^="page-icon:https://lk.megafon.ru"] image {
    object-position: 16px 0px !important;
    list-style-image: none !important;
    background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTExIiBoZWlnaHQ9IjExMSIgdmlld0JveD0iMCAwIDExMSAxMTEiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgICA8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIKICAgICAgICBkPSJNNjIuMDYxMyA1Ny4zNDk3VjAuNDQxNzExQzg5LjMwMDYgMy43NTQ2IDExMC40MjkgMjcuMDE4NCAxMTAuNTAzIDU1LjE0MTFDMTEwLjUwMyA4NS42MTk2IDg1Ljc2NjggMTEwLjM1NiA1NS4yODgzIDExMC4zNTZDNTMuNTk1MSAxMTAuMzU2IDUxLjkwMTggMTEwLjI4MiA1MC4yMDg2IDExMC4xMzVWNjIuNDI5NUM1MC4yMDg2IDYyLjEzNSA1MC40Mjk0IDYxLjg0MDUgNTAuNzk3NSA2MS44NDA1SDU3LjU3MDVDNjAgNjEuODQwNSA2Mi4wNjEzIDU5Ljg1MjggNjIuMDYxMyA1Ny4zNDk3Wk02MC44ODM0IDg1LjMyNTJDNTcuMDU1MiA4NS4zMjUyIDUzLjk2MzEgODIuMjMzMSA1My45NjMxIDc4LjQwNDlDNTMuOTYzMSA3NC41NzY3IDU3LjA1NTIgNzEuNDg0NyA2MC44ODM0IDcxLjQ4NDdDNjQuNzExNiA3MS40ODQ3IDY3LjgwMzYgNzQuNTc2NyA2Ny44MDM2IDc4LjQwNDlDNjcuODAzNiA4Mi4yMzMxIDY0LjcxMTYgODUuMzI1MiA2MC44ODM0IDg1LjMyNTJaTTcwLjE1OTQgNzguNDA0OUM3MC4xNTk0IDgyLjIzMzEgNzMuMjUxNSA4NS4zMjUyIDc3LjA3OTcgODUuMzI1MkM4MC45MDc5IDg1LjMyNTIgODMuOTk5OSA4Mi4yMzMxIDgzLjk5OTkgNzguNDA0OUM4My45OTk5IDc0LjU3NjcgODAuOTA3OSA3MS40ODQ3IDc3LjA3OTcgNzEuNDg0N0M3My4yNTE1IDcxLjQ4NDcgNzAuMTU5NCA3NC41NzY3IDcwLjE1OTQgNzguNDA0OVpNODYuMzU1OCA3OC40MDQ5Qzg2LjM1NTggODIuMjMzMSA4OS40NDc4IDg1LjMyNTIgOTMuMjc2IDg1LjMyNTJDOTcuMTA0MiA4NS4zMjUyIDEwMC4xOTYgODIuMjMzMSAxMDAuMTk2IDc4LjQwNDlDMTAwLjE5NiA3NC41NzY3IDk3LjEwNDIgNzEuNDg0NyA5My4yNzYgNzEuNDg0N0M4OS40NDc4IDcxLjQ4NDcgODYuMzU1OCA3NC41NzY3IDg2LjM1NTggNzguNDA0OVoiCiAgICAgICAgZmlsbD0iIzAwQjk1NiIgLz4KICAgIDxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIgogICAgICAgIGQ9Ik0wIDU1LjIxNDdDMCAyNC43MzYyIDI0LjczNjIgMCA1NS4yMTQ3IDBINTUuMzYyVjU0LjYyNThDNTUuMzYyIDU0Ljk5MzkgNTUuMDY3NSA1NS4yMTQ3IDU0Ljc3MyA1NS4yMTQ3SDUwLjEzNUg0Ny44NTI4QzQ1LjQ5NjkgNTUuMjg4MyA0My41ODI4IDU3LjI3NjEgNDMuNTA5MiA1OS42MzE5VjEwOS4xNzhDMTguNjI1OCAxMDMuODA0IDAgODEuNzE3OCAwIDU1LjIxNDdaTTM3LjY5MzIgMzguNTc2N0MzNy42OTMyIDQyLjQwNDkgNDAuNzg1MiA0NS40OTY5IDQ0LjYxMzUgNDUuNDk2OUM0OC40NDE3IDQ1LjQ5NjkgNTEuNTMzNyA0Mi40MDQ5IDUxLjUzMzcgMzguNTc2N0M1MS41MzM3IDM0Ljc0ODUgNDguNDQxNyAzMS42NTY0IDQ0LjYxMzUgMzEuNjU2NEM0MC43ODUyIDMxLjY1NjQgMzcuNjkzMiAzNC43NDg1IDM3LjY5MzIgMzguNTc2N1oiCiAgICAgICAgZmlsbD0iIzAwQjk1NiIgLz4KPC9zdmc+") transparent center no-repeat !important;
    background-size: 16px !important;
}

Да, наверно лучше вместо data:image/svg+xml;*** просто адрес https://lk.megafon.ru/public/rwlk/static/cdc5504119f8d0058c38.svg вписать, но у меня при таком способе при запуске/перезапуске браузера иконка появляется с задержкой.

Отредактировано sandro79 (08-11-2022 23:40:53)

GOROOOO · №12354

_zt
sandro79
Большое спасибо! Это мне очень помогло, моя проблема теперь решена

Duche · №12355

sandro79 пишет

Там так просто не победить

sandro79 Код работает отлично. Примите искреннюю благодарность за Вашу великолепную работу.
Ещё вопрос, может быть иконка кнопки (физически и технически) больше панели nav-bar или toolbar , как бы внахлёст, без ломки высоты панели.

Отредактировано Duche (08-11-2022 20:05:34)

Neytrino · №12356

sandro79 пишет

У меня он вообще не сработал, может так попробовать

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

Отредактировано Neytrino (08-11-2022 20:05:43)

sandro79 · №12357

Duche пишет

Ещё вопрос, может быть иконка кнопки (физически и технически) больше панели nav-bar или toolbar , как бы внахлёст, без ломки высоты панели.

Не знаю, наверно можно сделать, не хочу с этим экспериментировать.

Neytrino пишет

Только вот действует оно на все вкладки, а надо только на активную

Добавьте тогда после .tab-background :is([selected="true"], [multiselected]) или просто [selected="true"]
Изначально я код таким и делал, но потом почему-то выкинул :is([selected="true"], [multiselected])

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

Выделить код

Код:

#tabbrowser-tabs .tab-background:is([selected="true"], [multiselected]) {
  border: 1px solid AccentColor;
  box-shadow: none !important;
}

А с остальным уже нет энтузиазма разбираться.

Отредактировано sandro79 (08-11-2022 20:48:21)

Neytrino · №12358

sandro79, хорошо! Но мультиселект почему-то синим выделяет...

sandro79 · №12359

Neytrino пишет

Но мультиселект почему-то синим выделяет...

Точно, там уже outline накладывается. Добавьте тогда ещё outline: none !important;

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

Выделить код

Код:

#tabbrowser-tabs .tab-background:is([selected="true"], [multiselected]) {
  border: 1px solid AccentColor;
  box-shadow: none !important;
  outline: none !important;
}

Neytrino · №12360

sandro79, теперь шикардос, ещё раз спасибо!

Orchello · №12361

Всем привет. С кнопками вкладок немножко разобрался, а вот дальше никак, чё-то... Подскажете —

Всё, сделал. Почти что сам (-: Теперь обе панельки по высоте стали как кнопки вкладок в чистом FF. Мб, чуть больше.

Отредактировано Orchello (10-11-2022 18:39:07)

6e73epo · №12362

Firefox 106, Win7 Aero. Возможно ли чисто стилями изменить кнопки свертывания, свертывания в окно и закрытия на маковские?

xrun1 · №12363

6e73epo
Наверное, возможно. Был стиль от Vitaliy V., которого теперь по ссылке нет. У меня он немного модифицированный, цвет при наведении жёлтый и фон синий, но как было просто закомментировано, разберётесь. Иконки маковские сами подставьте.

Замена кнопок управления окном

Выделить код

Код:

/* Замена кнопок управления окном https://forum.mozilla-russia.org/viewtopic.php?pid=765572#p765572 */
@-moz-document url("chrome://browser/content/browser.xhtml") {
:root {
    --v-titlebar-button-vert-padding: 6px; /* 5px */
    --v-titlebar-button-horizont-padding: 6px; /* 10px */
    --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");
    --v-titlebar-min-image: url("data:image/svg+xml;charset=utf-8,<svg width='12' height='12' xmlns='http://www.w3.org/2000/svg'><line stroke='black' stroke-width='.9' fill='none' shape-rendering='crispEdges' x1='1' y1='5.5' x2='11' y2='5.5'/></svg>");
    --v-titlebar-max-image: url("data:image/svg+xml;charset=utf-8,<svg width='12' height='12' xmlns='http://www.w3.org/2000/svg' stroke='black' stroke-width='.9' fill='none' shape-rendering='crispEdges'><rect x='1.5' y='1.5' width='9' height='9'/></svg>");
    --v-titlebar-maximized-image: url("data:image/svg+xml;charset=utf-8,<svg width='12' height='12' xmlns='http://www.w3.org/2000/svg' stroke='black' stroke-width='.9' fill='none' shape-rendering='crispEdges'><rect x='1.5' y='3.5' width='7' height='7'/><polyline points='3.5,3.5 3.5,1.5 10.5,1.5 10.5,8.5 8.5,8.5'/></svg>");
    --v-titlebar-close-image: url("data:image/svg+xml;charset=utf-8,<svg width='12' height='12' xmlns='http://www.w3.org/2000/svg'><path stroke='black' stroke-width='.9' fill='none' d='M1,1 l 10,10 M1,11 l 10,-10'/></svg>");
    --v-titlebar-button-image-height: 12px;
    --v-titlebar-button-image-width: 12px;
    --v-titlebar-button-background-hover: rgba(0, 0, 0, .12);
    --v-titlebar-button-background-active: rgba(0, 0, 0, .22);
    --v-titlebar-close-background-hover: rgb(227, 27, 93);
    --v-titlebar-close-background-active: rgb(191, 22, 78);
}

:root:-moz-lwtheme-brighttext,
toolbar[brighttext] {
    --v-titlebar-button-background-hover: rgba(255, 255, 255, .22);
    --v-titlebar-button-background-active: rgba(255, 255, 255, .12);
}

:root {
    background-color: -moz-Dialog !important;
    color: -moz-DialogText !important;
}

@media (-moz-windows-glass), (-moz-os-version: windows-win8) {
    :root {
        -moz-appearance: none !important;
        appearance: none !important;
        background-color: ActiveCaption !important;
        color: CaptionText !important;
    }

    :root:-moz-window-inactive {
        background-color: InactiveCaption !important;
        color: InactiveCaptionText !important;
    }

    vbox#appcontent {
        -moz-appearance: none !important;
        appearance: none !important;
    }
}

@media (-moz-windows-glass: 0) and (-moz-os-version: windows-win7) {
    :root {
        background-color: ActiveCaption !important;
        color: CaptionText !important;
    }

    :root:-moz-window-inactive {
        background-color: InactiveCaption !important;
        color: InactiveCaptionText !important;
    }
}

:root:-moz-lwtheme {
    --v-lwt-accent-color-for-lwtheme: var(--lwt-accent-color, rgb(227, 228, 230));
    background-color: var(--v-lwt-accent-color-for-lwtheme) !important;
    color: var(--lwt-text-color, rgb(24, 25, 26)) !important;
}

:root:-moz-lwtheme-brighttext {
    --v-lwt-accent-color-for-lwtheme: var(--lwt-accent-color, rgb(12, 12, 13));
    color: var(--lwt-text-color, rgb(249, 249, 250)) !important;
}

:root:-moz-lwtheme:-moz-window-inactive {
    background-color: var(--lwt-accent-color-inactive, var(--v-lwt-accent-color-for-lwtheme)) !important;
}

@media (-moz-windows-accent-color-in-titlebar) {
    :root[tabsintitlebar]:not(:-moz-lwtheme):not(:-moz-window-inactive),
    :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) {
        background-color: -moz-win-accentcolor !important;
        color: -moz-win-accentcolortext !important;
    }
}

:root[tabsintitlebar]:not([inDOMFullscreen]) #titlebar {
    visibility: hidden !important;
}

:root[tabsintitlebar]:not([inDOMFullscreen]):not([chromehidden~="menubar"]) #titlebar > #toolbar-menubar,
:root[tabsintitlebar]:not([inDOMFullscreen]):not([chromehidden~="toolbar"]) #titlebar > #TabsToolbar {
    visibility: visible;
}

:root[sizemode="normal"] #titlebar {
    -moz-appearance: none !important;
    appearance: none !important;
}

.titlebar-buttonbox-container {
    -moz-box-align: start !important;
}

.titlebar-buttonbox {
    -moz-appearance: none !important;
    appearance: none !important;
    -moz-box-align: start !important;
    -moz-box-pack: end !important;
    margin: 0 !important;
    padding: 0 !important;
}

:root[data-l10n-id="browser-main-window-mac"] .titlebar-buttonbox:-moz-locale-dir(ltr) {
    -moz-box-direction: reverse !important;
}

:root[sizemode="normal"] #navigator-toolbox {
    border-top: none !important;
    padding-top: 0 !important;
    box-shadow: none !important;
    background-image: none !important;
}

:root[tabsintitlebar][sizemode="normal"] #toolbar-menubar {
    margin-top: 0 !important;
}

#toolbar-menubar {
    text-shadow: inherit !important;
}

#main-menubar {
    text-shadow: inherit !important;
    background-color: transparent !important;
    color: inherit !important;
    border-radius: 0 !important;
}

#toolbar-menubar,
#TabsToolbar {
    color: inherit !important;
    background-image: none !important;
}

#TabsToolbar:not(:-moz-lwtheme) .tabbrowser-tab {
    background-color: transparent !important;
}

:root[tabsintitlebar] #TabsToolbar .tab-label {
    opacity: 1 !important;
}

#TabsToolbar:-moz-lwtheme {
    --lwt-toolbarbutton-icon-fill: currentColor !important;
}

.titlebar-buttonbox > :is(.titlebar-min,.titlebar-max,.titlebar-restore,.titlebar-close),
#minimize-button, #restore-button, #close-button {
    display: -moz-box !important;
    -moz-appearance: none !important;
    appearance: none !important;
    margin: 0 !important;
    padding: var(--v-titlebar-button-vert-padding) var(--v-titlebar-button-horizont-padding) !important;
    color: var(--lwt-toolbarbutton-icon-fill, inherit) !important;
    background-color: transparent !important;
}

:root:not([sizemode="maximized"]) .titlebar-buttonbox > .titlebar-restore[tooltiptext],
:root[sizemode="maximized"] .titlebar-buttonbox > .titlebar-max[tooltiptext] {
    display: none !important;
}

#window-controls {
    -moz-box-align: start !important;
}

.titlebar-buttonbox > :is(.titlebar-min,.titlebar-max,.titlebar-restore,.titlebar-close) > .toolbarbutton-icon,
:is(#minimize-button,#restore-button,#close-button) > .toolbarbutton-icon {
    filter: var(--v-svg-filter-fill) !important;
    fill: currentColor !important;
    color: inherit !important;
    margin: 0 !important;
    padding: 0 !important;
    height: var(--v-titlebar-button-image-height) !important;
    width: var(--v-titlebar-button-image-width) !important;
}

.titlebar-buttonbox > .titlebar-min,
#minimize-button {
    list-style-image: var(--v-titlebar-min-image) !important;
    -moz-image-region: auto !important;
}

.titlebar-buttonbox > .titlebar-max {
    list-style-image: var(--v-titlebar-max-image) !important;
    -moz-image-region: auto !important;
}

:root[sizemode="maximized"] .titlebar-buttonbox > .titlebar-max,
.titlebar-buttonbox > .titlebar-restore,
#restore-button {
    list-style-image: var(--v-titlebar-maximized-image) !important;
    -moz-image-region: auto !important;
}

.titlebar-buttonbox > :is(.titlebar-min,.titlebar-max,.titlebar-restore):hover,
:is(#minimize-button,#restore-button):hover {
/*    background-color: var(--v-titlebar-button-background-hover) !important; */
    background-color: blue !important;
    color: yellow !important;
}

.titlebar-buttonbox > :is(.titlebar-min,.titlebar-max,.titlebar-restore):hover:active,
:is(#minimize-button,#restore-button):hover:active {
/*    background-color: var(--v-titlebar-button-background-active) !important; */
    background-color: blue !important;
    color: yellow !important;
}

.titlebar-buttonbox > .titlebar-close,
#close-button {
    list-style-image: var(--v-titlebar-close-image) !important;
    -moz-image-region: auto !important;
}

.titlebar-buttonbox > .titlebar-close:hover,
#close-button:hover {
    background-color: var(--v-titlebar-close-background-hover) !important;
    color: yellow !important;
}

.titlebar-buttonbox > .titlebar-close:hover:active,
#close-button:hover:active {
    background-color: var(--v-titlebar-close-background-active) !important;
    color: yellow !important;
}
}

kokoss · №12364

Orchello

Выделить код

Код:

:root {
    --tab-border-radius: 3px !important;
    --tab-block-margin: 0px !important;
}

#urlbar-container,
#search-container {
    padding: 1px 0 !important;
    margin: 0 1px !important;
}

Отредактировано kokoss (09-11-2022 21:40:19)

Duche · №12365

Добрый день. Случайно заменил интересный артефакт. К кнопкам приложений не работает padding , кнопки браузера и CB реагируют на padding а кнопки приложений нет, размер увеличивают те и те . кнопки приложений с большим padding а остальные кромки не имеют .

sandro79 · №12366

Duche
Ничего толком не понял. Вы размер иконок дополнений увеличить хотите? Так можно

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

Выделить код

Код:

#navigator-toolbox .webextension-browser-action > .toolbarbutton-badge-stack {
  transform: scale(1.4);	 
  padding: 2px !important; 
  margin-inline: 3px !important;  
}

Отредактировано sandro79 (10-11-2022 00:18:33)

Orchello · №12367

kokoss пишет

#urlbar-container,
#search-container {
padding: 1px 0 !important;
margin: 0 1px !important;
}

Спасибо.

kokoss · №12368

Orchello
А что >

Выделить код

Код:

:root {
    --tab-border-radius: 3px !important;
    --tab-block-margin: 0px !important;
}

у вас не работает ?

Orchello · №12369

kokoss пишет

:root {
--tab-border-radius: 3px !important;
--tab-block-margin: 0px !important;
}

Это у меня уже было написано.

Duche · №12370

sandro79 пишет

Ничего толком не понял

Да я и сам, не понял что случилась . Иконки я увеличил нормально , но иконки почему-то начали ломать "панель инструментов" и "urlbar" ,решил уменьшить margin-top , margin-bottom и padding с "-", а тут такое. Потом нашёл , тщательно проверив весь FG_userChrome ,случайно испортил этот код......

Выделить код

Код:

/* toolbarbutton[class="bookmark-item"] > .toolbarbutton-text {
  display: none !important;
}
toolbarbutton[class="bookmark-item"] > .toolbarbutton-icon {
  -moz-margin-end: 0px !important;
}

m_nikolay · №12371

Всем привет. Ребята, подскажите как уменьшить высоту панели вкладок - чтобы не было промежутка между верхней границей вкладки и вешней границей окна браузера

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

Спасибо и всяческого всем добра

FF версии 102 ESR

Отредактировано m_nikolay (13-11-2022 07:47:58)

kokoss · №12372

m_nikolay
https://forum.mozilla-russia.org/viewto … 35#p802435

Отредактировано kokoss (11-11-2022 11:25:26)

m_nikolay · №12373

kokoss
Я это уже пробовал-безрезультатно. Использую последний стиль Виталия. На 91 версии все было нормально, а в 102 появился этот промежуток. Как жалко что Виталий ушел, только он один полностью держал тему

kokoss · №12374

m_nikolay пишет

Я это уже пробовал-безрезультатно. Использую последний стиль Виталия.

Этот код рабочий! Какой стиль используйте... ?

m_nikolay · №12375

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

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

Выделить код

Код:

@namespace html url("http://www.w3.org/1999/xhtml");

@-moz-document url("chrome://browser/content/browser.xhtml") {
:root {
    --v-tabs-min-height: 26px;
    --v-tabs-tab-max-width: 180px;
    --v-tabs-border-inactive-color: color-mix(in srgb, currentColor 25%, transparent);
    --tabs-border-color: rgb(71, 36, 11) !important;           
    --tab-border-radius: 0px !important;
    --tab-shadow-max-size: 0px !important;
    --tab-block-margin: 0px !important;
    --proton-tab-block-margin: 0px !important;
    --space-above-tabbar: 0px !important;
    --v-newtab-button-width: 26px;
    --v-placeholder-post-tabs: 20px;
    --toolbarbutton-border-radius: 0px !important;
    --toolbarbutton-outer-padding: 1px !important;
    --bookmark-block-padding: 1px !important;
    --toolbarbutton-inner-padding: 4px !important;
    --toolbar-start-end-padding: var(--toolbarbutton-outer-padding) !important;
    --v-main-menubar-min-height: 20px;
    --v-main-menubar-min-width: 15px;
    --v-main-menubar-color: rgb(255, 255, 255);
    --v-main-menubar-background-color: rgb(71, 36, 11);         
    --v-main-menubar-background-color-hover: rgb(23, 139, 255);
    --v-main-menubar-background-color-active: rgb(0, 89, 232);
    --v-textbox-border-radius: 0px;
    --urlbar-min-height: 24px !important;
    --urlbar-icon-padding: 3px !important;
    --urlbar-container-padding: 0px !important;
    --urlbar-icon-border-radius: 0px !important;
    --v-textbox-padding: 1px;
    --v-textbox-margin: 1px;
    --focus-outline-width: 1px !important;
    --arrowpanel-menuitem-margin: 0px !important;
    --arrowpanel-menuitem-padding-block: 4px !important;
    --arrowpanel-menuitem-padding: var(--arrowpanel-menuitem-padding-block) 8px !important;
    --arrowpanel-menuitem-border-radius: 0px !important;
    --panel-separator-margin: 4px 0px !important;
    --panel-subview-body-padding: 4px 0 !important;
    --arrowpanel-border-radius: 0px !important;
    --arrowpanel-padding: 10px !important;
    --v-titlebar-button-vert-padding: 5px;
    --v-titlebar-button-horizont-padding: 10px;
    --v-titlebar-button-image-height: 12px;
    --v-titlebar-button-image-width: 12px;
    --v-titlebar-button-background-hover: var(--button-hover-bgcolor, color-mix(in srgb, currentColor 20%, transparent));
    --v-titlebar-button-background-active: var(--button-active-bgcolor, color-mix(in srgb, currentColor 10%, transparent));
    --v-titlebar-close-background-hover: rgb(227, 27, 93);
    --v-titlebar-close-background-active: rgb(191, 22, 78);
    --v-titlebar-button-fill-opacity: .85;
    --v-titlebar-close-fill-opacity: .85;
}
:root[uidensity="compact"] { /* компактный режим */
    --v-tabs-min-height: 26px;
    --v-tabs-tab-max-width: 180px;
    --v-newtab-button-width: 26px;
    --toolbarbutton-outer-padding: 1px !important;
    --bookmark-block-padding: 1px !important;
    --toolbarbutton-inner-padding: 4px !important;
    --v-main-menubar-min-height: 20px;
    --v-main-menubar-min-width: 15px;
    --urlbar-min-height: 24px !important;
    --urlbar-icon-padding: 3px !important;
    --v-textbox-padding: 1px;
    --v-textbox-margin: 1px;
}
:root[uidensity="touch"] { /* мобильный режим */
    --v-tabs-min-height: 41px;
    --v-tabs-tab-max-width: 225px;
    --v-newtab-button-width: 40px;
    --toolbarbutton-outer-padding: 2px !important;
    --bookmark-block-padding: 2px !important;
    --toolbarbutton-inner-padding: 9px !important;
    --v-main-menubar-min-height: 26px;
    --v-main-menubar-min-width: 21px;
    --urlbar-min-height: 34px !important;
    --urlbar-icon-padding: 7px !important;
    --v-textbox-padding: 4px;
    --v-textbox-margin: 6px;
    --v-titlebar-button-vert-padding: 7px;
    --v-titlebar-button-horizont-padding: 14px;
}
:root:-moz-lwtheme { /* Рамка панели поиска */
    --toolbar-field-border-color: transparent !important;
    --toolbar-field-focus-border-color: rgb(139, 69, 19) !important;                                          
}
:root[lwtheme-mozlightdark] { /* для встроенных - системной, темной, светлой тем */
    --arrowpanel-border-color: color-mix(in srgb, currentColor 25%, transparent) !important;
    --toolbar-field-background-color: color-mix(in srgb, currentColor 10%, transparent) !important;
    --toolbar-field-border-color: color-mix(in srgb, currentColor 10%, transparent) !important;
}
/* ************************************************ */

#titlebar,
#tabbrowser-tabs {
    --tab-min-height: var(--v-tabs-min-height) !important;
}
#TabsToolbar {
    background-color: transparent !important;
}
#tabbrowser-tabs .tabbrowser-tab {
    border: none !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    padding-inline: 0px !important;
}
#tabbrowser-tabs .tabbrowser-tab .tab-icon-overlay {
    padding: 0 !important;
}
#tabbrowser-tabs .tab-close-button {
    -moz-context-properties: fill, fill-opacity !important;
    list-style-image: url("./svg/close.svg") !important;
    color: inherit !important;
    fill: currentColor !important;
    fill-opacity: 0 !important;
    height: 20px !important;
    width: 20px !important;
    padding: 0 !important;
    margin-inline-start: 0 !important;
    margin-inline-end: -6px !important;
}
#tabbrowser-tabs .tabbrowser-tab:not([pinned="true"],:hover) .tab-close-button {
    display: none !important;
}
#tabbrowser-tabs .tabbrowser-tab:not([pinned="true"]) .tab-content {
    padding-inline: 6px !important;
}
#tabbrowser-tabs .tabbrowser-tab::after,
#tabbrowser-tabs .tabbrowser-tab::before {
    border: none !important;
    border-left: 1px solid var(--v-tabs-border-inactive-color) !important;
    opacity: 1 !important;
    margin: 0 !important;
    transition: none !important;
}
#tabbrowser-tabs:not([movingtab]) .tabbrowser-tab:is([beforeselected-visible],[before-multiselected])::after,
#tabbrowser-tabs .tabbrowser-tab:is([visuallyselected="true"],[multiselected="true"])::before,
#tabbrowser-tabs .tabbrowser-tab:is([visuallyselected="true"],[multiselected="true"])::after {
    border-color: var(--tabs-border-color) !important;
}
#tabbrowser-tabs .tabbrowser-tab::after,
#tabbrowser-tabs[positionpinnedtabs] .tabbrowser-tab[pinned="true"] + .tabbrowser-tab:not([pinned="true"])::before,
#tabbrowser-tabs[movingtab] .tabbrowser-tab[visuallyselected="true"]::before,
:root[tabsintitlebar][data-l10n-id="browser-main-window-mac"] #TabsToolbar .tabbrowser-tab[first-visible-tab]::before {
    content: "" !important;
    display: block !important;
}
#tabbrowser-tabs[positionpinnedtabs] .tabbrowser-tab[pinned] {
    display: flex !important;
    align-items: stretch !important;
    justify-content: center !important;
}
#tabbrowser-tabs .tab-background {
    border: none !important;
    border-top: 1px solid var(--v-tabs-border-inactive-color) !important;
    box-shadow: none !important;
}
#tabbrowser-tabs .tab-background > .tab-context-line {
    border-radius: 0 !important;
    margin: 0 !important;
}
#tabbrowser-tabs .tab-background > .tab-bottom-line {
    margin-bottom: 1px !important;
}
#tabbrowser-tabs .tabbrowser-tab .tab-background:is([selected="true"],[multiselected="true"]) {
    border-color: var(--tabs-border-color) !important;
}
#tabbrowser-tabs[haspinnedtabs]:not([positionpinnedtabs]) .tabbrowser-tab[first-visible-unpinned-tab] {
    margin-inline-start: 0px !important;
}
#tabbrowser-tabs .tabbrowser-tab .tab-label-container {
    height: auto !important;
}
#tabbrowser-tabs .tabbrowser-tab .tab-label {
    line-height: 1.25em !important;
    height: 1.25em !important;
    margin-block: 0 !important;
}
#tabbrowser-tabs .tabbrowser-tab .tab-secondary-label {
    margin-block: -0.25em 0 !important;
}
#tabbrowser-tabs .tabbrowser-tab .tab-icon-sound-label {
    line-height: 1.25em !important;
    height: 1.25em !important;
    margin-block: 0 !important;
}
#TabsToolbar #tabs-newtab-button {
    margin: 0 !important;
    background: none !important;
    border: none !important;
}
#TabsToolbar #tabs-newtab-button > .toolbarbutton-icon {
    border: none !important;
    border-radius: 0 !important;
}
#TabsToolbar #tabs-newtab-button {
    padding: 0 !important;
    margin: 0 !important;
    background: none !important;
    border: none !important;
    -moz-box-align: stretch !important;
    list-style-image: none !important;
    -moz-context-properties: fill, fill-opacity;
    fill: var(--lwt-toolbarbutton-icon-fill, currentColor);
    fill-opacity: var(--toolbarbutton-icon-fill-opacity);
}
#TabsToolbar #tabs-newtab-button > .toolbarbutton-icon {
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    height: auto !important;
    width: var(--v-newtab-button-width) !important;
    list-style-image: none !important;
    background-color: transparent !important;
    background-image: url("./svg/add.svg") !important;
    background-repeat: no-repeat !important;
    background-size: 16px !important;
    background-position: center !important;
}
#TabsToolbar #new-tab-button {
    list-style-image: url("./svg/add.svg") !important;
}
#TabsToolbar .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"],[multiselected="true"]),
#TabsToolbar #tabs-newtab-button:hover > .toolbarbutton-icon {
    background-color: color-mix(in srgb, currentColor 10%, transparent) !important;
}
#tabbrowser-tabs .tabbrowser-tab .tab-line {
    transform: none !important;
    transition: none !important;
}
#tabbrowser-tabs .tabbrowser-tab:hover .tab-background > .tab-line:not([selected="true"],[multiselected="true"]) {
    background-color: var(--v-tabs-border-inactive-color) !important;
    opacity: 1 !important;
}
#TabsToolbar .toolbarbutton-1 > .toolbarbutton-icon,
#TabsToolbar .toolbarbutton-1 > .toolbarbutton-text,
#TabsToolbar .toolbarbutton-1 > .toolbarbutton-badge-stack {
    background-color: transparent !important;
}
#TabsToolbar .toolbarbutton-1:not([disabled="true"],[checked],[open],:active):hover {
    background-color: var(--toolbarbutton-hover-background) !important;
}
#TabsToolbar .toolbarbutton-1:not([disabled="true"]):is([open],[checked],:hover:active) {
    background-color: var(--toolbarbutton-active-background) !important;
}
#TabsToolbar :is(.titlebar-placeholder,.titlebar-spacer)[type="pre-tabs"] {
    width: 0px !important;
    border: none !important;
}
#TabsToolbar :is(.titlebar-placeholder,.titlebar-spacer)[type="post-tabs"] {
    width: var(--v-placeholder-post-tabs) !important;
    border: none !important;
}
#TabsToolbar .toolbarbutton-1 {
    margin-block: 0px !important;
}
:root[uidensity="compact"] .tab-drop-indicator-box .tab-drop-indicator {
    height: 24px !important;
    width: auto !important;
}
toolbarbutton#scrollbutton-down, toolbarbutton#scrollbutton-up {
    border: none !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: var(--toolbarbutton-inner-padding) calc(var(--toolbarbutton-inner-padding) / 2) !important;
}
#navigator-toolbox[style*="--tabs-border-color: rgba(0, 0, 0, 0);"] {
    --tabs-border-color: inherit !important;
}
#nav-bar:not([tabs-hidden="true"]) {
    box-shadow: 0px -1px 0px 0px var(--tabs-border-color) !important;
}
#identity-icon-box,
#identity-box {
    max-width: calc(30px + 15em) !important;
}
#searchbar .searchbar-search-icon {
    margin-inline-start: 6px !important;
}
#urlbar-search-splitter {
    min-width: 6px !important;
    width: 6px !important;
    margin: 0 -3px !important;
}
:root:not([uidensity="touch"]) #urlbar-zoom-button {
    margin-block: 0 !important;
}
#urlbar-container,
#search-container {
    padding: var(--v-textbox-padding) 0 !important;
    margin: 0 var(--v-textbox-margin) !important;
}
#urlbar-background, #searchbar {
    box-shadow: none !important;
    border-width: 1px !important;
    background-clip: border-box !important;
    border-radius: var(--v-textbox-border-radius) !important;
}
#urlbar, #searchbar {
    min-height: var(--urlbar-min-height) !important;
    font-size: 1em !important;
    box-shadow: none !important;
    -moz-box-align: stretch !important;
}
#urlbar:not([breakout]),
#searchbar {
    margin: 0 !important;
}
#urlbar:not([focused]) html|input#urlbar-input,
#searchbar:not(:focus-within) html|input.searchbar-textbox {
    mask-image: linear-gradient(to left, transparent, black 3ch);
    mask-repeat: no-repeat;
}
#urlbar:not([focused]):-moz-locale-dir(rtl) html|input#urlbar-input,
#searchbar:not(:focus-within):-moz-locale-dir(rtl) html|input.searchbar-textbox {
    mask-image: linear-gradient(to right, transparent, black 3ch);
}
:root:not([uidensity="compact"]) #back-button {
    padding-block: var(--toolbarbutton-outer-padding) !important;
    padding-inline-start: var(--toolbarbutton-outer-padding) !important;
    padding-inline-end: 0 !important;
}
:root:not([uidensity="compact"]) #back-button > .toolbarbutton-icon {
    width: calc(2 * var(--toolbarbutton-inner-padding) + 16px) !important;
    height: calc(2 * var(--toolbarbutton-inner-padding) + 16px) !important;
    padding: var(--toolbarbutton-inner-padding) !important;
}
:root toolbarbutton html|*.toolbarbutton-badge {
    margin-top: calc(-1 * var(--toolbarbutton-inner-padding)) !important;
    margin-inline-end: calc(-1 * (var(--toolbarbutton-outer-padding) + var(--toolbarbutton-inner-padding))) !important;
    border-radius: calc(var(--toolbarbutton-border-radius) - 2px) !important;
}
:is(#reload-button,#stop-button) > :is(.toolbarbutton-icon,.toolbarbutton-animatable-box) {
   translate: none !important;
}
#alltabs-popup .alltabs-item {
    box-shadow: none !important;
}
toolbar[type="menubar"] {
    padding-block: 0 !important;
}
#main-menubar > menu {
    appearance: none !important;
    border: none !important;
    background: none !important;
    box-shadow: none !important;
    color: inherit !important;
    padding-block: 0 !important;
    min-height: var(--v-main-menubar-min-height, 20px) !important;
    height: 1.25em !important;
}
#main-menubar > menu:not([disabled="true"]):is(:hover,[_moz-menuactive="true"]) {
    background: var(--toolbarbutton-hover-background, color-mix(in srgb, currentColor 20%, transparent)) !important;
}
#main-menubar > menu:not([disabled="true"]):is([open="true"],[checked="true"],:hover:active) {
    background: var(--toolbarbutton-active-background, color-mix(in srgb, currentColor 10%, transparent)) !important;
}
#PersonalToolbar {
    padding: 0 !important;
}
#personal-toolbar-empty-description,
#PersonalToolbar .toolbarbutton-1,
toolbarbutton.bookmark-item:not(.subviewbutton) {
    margin: var(--toolbarbutton-outer-padding) !important;
}
toolbarbutton.close-icon,
toolbarbutton.findbar-find-previous, toolbarbutton.findbar-find-next,
html|input.findbar-textbox {
    border-radius: 0 !important;
}
findbar > .findbar-container {
    overflow: hidden;
}

Спасибо за отклик и желание помочь, а то в предыдущем посте забыл поблагодарить. Не взыщите.

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

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