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

_zt · №13176

Код:

@-moz-document url("about:addons") {
:root{--in-content-page-background:red!important;}
#full{background-color:green!important;}
#sidebar{background-color:orange!important;}
#page-header{background-color:blue!important;}
#content{background-color:#FF0!important;}
}

doud · №13177

Код сработал после помещения в начало userChrome.css! Но при этом отключились стили от ARIS

_zt · №13178

doud
@import самым первым должен быть, я уже десять раз это вам написал. Давайте сюда ваш текущий userChrome, файлом, а не текстом.

Отредактировано _zt (17-06-2023 16:43:26)

doud · №13179

_zt добавил сразу после Кодов ARIS и все получилось!!! Всем спасибо! :beer:

_zt · №13180

doud
За что спасибо то? У вас в файле где то незакрытая скобка.

Алексей У. · №13181

_zt пишет

Выделить код

Код:

@-moz-document url("about:addons") {
:root{--in-content-page-background:red!important;}
#full{background-color:green!important;}
#sidebar{background-color:orange!important;}
#page-header{background-color:blue!important;}
#content{background-color:#FF0!important;}
}

Все равно не получается: заливка меняется в боковой колонке и "шапке", а содержимое страницы по-прежнему остается на белом фоне. Полностью удалил все, что у меня было в userContent.css и вставил только ваш код - результат тот же самый. Похоже, неразрешимая задача. :angry:

_zt · №13182

Алексей У.
Что-то закэшировалось, перепроверьте.
Вот скрин с чистого профиля:

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

Но я проверил и на двух других настроенных по полной программе профилях, один с ucf, а другой без.

Добавлено 17-06-2023 17:23:17
Алексей У.
А у вас [firefox] 69 ?
Если да, то не факт, что там будет работать. И вообще версия странная, есть же ESR 68 который ~ на год новее 69.

Отредактировано _zt (17-06-2023 17:23:17)

6e73epo · №13183

doud, и все таки ты не поставил закрывающуюся скобку, как я приводил в примере, поэтому код помещенный в конец - не срабатывал. И другие коды, которые ты добавишь позже, тоже могут не сработать. Но т.к. у тебя несколько раз встречается "@-moz-document url("chrome://browser/content/browser.xhtml") {", то можно удалить эту строку, которая встречается последней, но не удалять "}" перед #appMenu_menu_HelpPopup_reportPhishingtoolmenu

doud · №13184

6e73epo
Понятно, исправил. Теперь код работает и в конце! Большое спасибо!

Отредактировано doud (17-06-2023 18:48:06)

kokoss · №13185

Алексей У.
Здесь поищите нужный вам код!

_zt · №13186

kokoss
Вы вообще читаете, или только пишите? Ну поискал, и чего? Все тоже самое, что я дал, и даже меньше.
Или с github кошернее?

#full > #sidebar

без обертки и совсем не про то. Ему фон нужен, выше выяснили.

Добавлено 18-06-2023 08:02:49
Ладно, пробуйте.

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

Выделить код

Код:

/* https://forum.mozilla-russia.org/viewtopic.php?pid=805601#p805601          */
/* Вариант для использования без скрипта **************************************/
@-moz-document url("about:addons"),
               url("chrome://mozapps/content/extensions/aboutaddons.html") {

/* Цвет части страниц настроек расширений, не занятых настройками, только для *
 * тех расширений настройки которых открываются по адресу about:addons ********
 * Цвет попытаться синхронизировать с общим правилом в dark_addons.css ********/
@media (prefers-color-scheme: dark) {
  #details-deck .inline-options-stack {
      background-color: rgba(43,42,51,.8) !important;
      padding-left: 10px !important;
    }
  }

/* Убрать рамку вокруг категорий сайдбара */
#categories button.category {
    border: none !important;
  }
/* Недавние обновления всегда видны https://github.com/aris-t2/customcssforfx */
#categories .category[name="recent-updates"][disabled],
#category-recentUpdates[disabled] {
    overflow: visible !important;
    height: 48px !important;
    min-height: 48px !important;
    opacity: 1 !important;
    transition-property: unset !important;
    transition-duration: unset !important;
    -moz-user-input: unset !important;
  }
#categories .category[name="recent-updates"][hidden],
#category-recentUpdates[hidden] {
    opacity: 1 !important;
    min-height: 48px !important;
    height: 48px !important;
    display: inherit !important;
    transition: unset !important;
  }

/* Заголовки страниц */
#page-header div.sticky-container {
    max-width: 1032px !important;
    width: 100% !important;
  }
#page-header div.sticky-container div.main-search,
#page-header div.sticky-container div.main-heading {
    max-width: 100% !important;
  }
.header-name {
    margin-top: -20px !important;
  }

/* Счетчик включенных / отключенных дополнений */
@media all and (min-width: 600px) {
    addon-list {
      counter-reset: enabled disabled;
    }
    addon-list > section[section="0"] > addon-card {
      counter-increment: enabled;
    }
    addon-list > section[section="1"] > addon-card {
      counter-increment: disabled;
    }
    addon-list::after {
      position: fixed;
      top: 80px;
      margin-left: 20px !important;
      white-space: pre;
      content: "Включено: "counter(enabled)"   Отключено: "counter(disabled);
      z-index: 6;
    }
  }

/********* Версии дополнений **************************************************/
/* префикс - *|*[current-view="list"] нужен для страницы доступных обновлений */
*|*[current-view="list"] .addon-name-link[title] {
    font-size: 0 !important;
    display: flex !important;
    flex-direction: row !important;
  }
*|*[current-view="list"] .addon-name-link[title]::after {
    display: block !important;
    content: attr(title) !important;
    font-size: 1rem !important;
    line-height: 1em !important;
  }
/* hide version number on updates category */
div[current-view="updates"] .addon-name-link[title]::after {
    display: none !important;
    visibility: collapse !important;
    opacity: 0 !important;
  }

/********* ID дополнений ******************************************************/
/* https://forum.mozilla-russia.org/viewtopic.php?pid=789469#p789469          */
addon-card[addon-id]:not([expanded="true"])::after {
    content: "ID : " attr(addon-id) !important;
    display: block !important;
    position: relative !important;
    padding-inline-start: calc(var(--card-padding) + var(--addon-icon-size) + 16px) !important;
    margin-top: calc(-1 * (1.1em + var(--card-padding) - 1px)) !important;
    margin-bottom: calc(1.1em + var(--card-padding) - 1px) !important;
    color: color-mix(in srgb, currentColor 50%, transparent) !important;
    pointer-events: none !important;
    font-size: 0.8rem !important;
    line-height: 0.8em !important;
}
addon-card[addon-id]:not([expanded="true"]) .addon.card {
    padding-bottom: calc(1.1em + var(--card-padding) - 1px) !important;
    margin-bottom: 0px !important;
}
addon-card[addon-id]:not([expanded="true"]) .addon.card message-bar {
    margin-block: 2px !important;
    border-radius: 0 !important;
}
addon-list[type="theme"] addon-card[addon-id]:not([expanded="true"])::after {
    padding-inline-start: calc(var(--card-padding) - 1px) !important;
  }

/* Обводка карточки при наведении *//*
addon-card:not([expanded]) > .addon.card:hover {
    box-shadow: none !important;
    border: 1px solid rgba(40,140,230,.5) !important;
  }
/* Страница управления расширением (после щелчка по карточке) */
addon-card[expanded] .addon.card {
    margin-top: 10px !important;
  }

/* Добавляет кнопки вместо меню: включить, отключить, удалить, настройки... ***
 * https://forum.mozilla-russia.org/viewtopic.php?pid=793823#p793823 **********
 * Вернуть текст кнопкам - в #main: --v-buttons-font-size: rem; ***************
 * Убрать текст для кнопок опр. типа, см. пример по - [action="report"] *******
 * Убрать иконки: --v-buttons-icon-size: 0px;                                 */
:root {
    --v-content-button-border-color: var(--in-content-box-border-color, rgba(12, 12, 13, 0.3));
    --v-content-button-border-color-hover: var(--in-content-border-hover, rgba(12, 12, 13, 0.5));
    --v-content-button-background: var(--in-content-button-background, rgba(12, 12, 13, 0.1));
    --v-content-button-background-hover: var(--in-content-button-background-hover, rgba(12, 12, 13, 0.15));
    --v-content-button-background-active: var(--in-content-button-background-active, rgba(12, 12, 13, 0.2));
    --v-content-button-color: var(--in-content-button-text-color, #0c0c0d);
    --v-content-button-color-hover: var(--in-content-button-text-color-hover, #0c0c0d);
    --v-content-button-color-active: var(--in-content-button-text-color-hover, #0c0c0d);
    --v-buttons-tooltip-color: var(--in-content-page-color, #0c0c0d);
    --v-buttons-tooltip-background: var(--in-content-box-background, #ffffff);
    --v-buttons-tooltip-border-color: var(--in-content-box-border-color, rgba(12, 12, 13, 0.3));
    --v-main-max-width: 1000px;
    --card-padding: 8px !important;
    --section-width: 664px !important;
    --addon-icon-size: 32px !important;
  }
#main {
    --v-buttons-font-size: 0.8rem; /* 0; */
    --v-buttons-font-weight: bold;
    --v-buttons-border-radius: 4px;
    --v-buttons-border-width: 1px;
    --v-buttons-min-height: 26px;
    --v-buttons-tooltip-font-size: 0.8rem;
    --v-buttons-tooltip-border-radius: 2px;
    --v-buttons-tooltip-delay: .5s;
    --v-buttons-tooltip-translate-x: -132px;
    --v-buttons-tooltip-translate-y: 15px;
    --v-buttons-width: auto;
    --v-list-display-flex: flex;
  }
@media (prefers-color-scheme: dark) {
  :root {
      --v-content-button-border-color: var(--in-content-box-border-color, rgba(200, 200, 210, 0.2));
      --v-content-button-border-color-hover: var(--in-content-border-hover, rgba(249, 249, 250, 0.3));
      --v-content-button-background: var(--in-content-button-background, rgba(249, 249, 250, 0.1));
      --v-content-button-background-hover: var(--in-content-button-background-hover, rgba(249, 249, 250, 0.15));
      --v-content-button-background-active: var(--in-content-button-background-active, rgba(249, 249, 250, 0.2));
      --v-content-button-color: var(--in-content-button-text-color, #f9f9fa);
      --v-content-button-color-hover: var(--in-content-button-text-color-hover, #f9f9fa);
      --v-content-button-color-active: var(--in-content-button-text-color-hover, #f9f9fa);
      --v-buttons-tooltip-color: var(--in-content-page-color, rgba(200, 200, 210, 0.5));
      --v-buttons-tooltip-background: rgba(40, 40, 50, 0.85);
      --v-buttons-tooltip-border-color: rgba(120, 120, 120, 0.3);
    }
  }
#moz-toggle-button.toggle-button,
addon-card .theme-enable-button {
    --v-buttons-font-size: 0;
    --v-buttons-toggle-button-content: "Включить";
    --v-buttons-tooltip-content: "Включить дополнение";
    --v-buttons-tooltip-display: block;
    --icon: url("chrome://global/skin/icons/check-partial.svg");
  }
#moz-toggle-button.toggle-button[aria-pressed="true"],
addon-card .card[active="true"] .theme-enable-button {
    --v-buttons-toggle-button-content: "Отключить";
    --v-buttons-tooltip-content: "Отключить дополнение";
    --v-buttons-tooltip-display: block;
    --icon: url("chrome://global/skin/icons/check.svg");
    --v-content-button-background: rgba(85,255,85, 0.2);
  }
addon-card panel-item[action="remove"] {
    --v-buttons-font-size: 0;
    --v-buttons-tooltip-content: "Удалить дополнение";
    --v-buttons-tooltip-display: block;
    --icon: url("chrome://global/skin/icons/delete.svg");
    --v-content-button-background: rgba(255,85,85, 0.3);
    --v-content-button-background-hover: rgba(255,85,85, 0.8);
  }
addon-card panel-item[action="install-update"] {
    --v-buttons-font-size: 0;
    --v-buttons-tooltip-content: "Обновить дополнение";
    --v-buttons-tooltip-display: block;
    --icon: url("chrome://global/skin/icons/update-icon.svg");
    --v-content-button-background: rgba(49,140,231, 0.3);
    --v-content-button-background-hover: rgba(49,140,231, 0.8);
  }
addon-card panel-item[action="preferences"] {
    --v-buttons-font-size: 0;
    --v-buttons-tooltip-content: "Настройки дополнения";
    --v-buttons-tooltip-display: block;
    --icon: url("chrome://global/skin/icons/settings.svg");
    --v-content-button-background: rgba(85,85,255, 0.3);
    --v-content-button-background-hover: rgba(85,85,255, 0.8);
  }
/* Скрыть "Пожаловаться на дополнение" */
addon-card panel-item[action="report"] {
    display: none !important;
  }
addon-list[type="plugin"] addon-card panel-item:not([checked]) {
    --icon: url("chrome://global/skin/icons/check-partial.svg");
}
/* ************************************************************************* */

body {
    margin: 0 !important;
  }
#main {
    max-width: var(--v-main-max-width) !important;
    margin-inline-start: 16px !important;
    margin-inline-end: 16px !important;
  }
addon-card message-bar {
    --card-padding: inherit !important;
  }
addon-card .card-contents {
    width: auto !important;
    overflow-x: hidden !important;
    flex-grow: 1 !important;
  }
addon-card .card {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
  }
addon-card .card > * {
    grid-column-start: 1 !important;
    grid-column-end: 3 !important;
  }
addon-card .card > .addon-card-collapsed {
    grid-column-start: 1 !important;
    grid-column-end: 2 !important;
    grid-row-start: 1 !important;
    overflow-x: hidden !important;
  }
addon-card .card > addon-options {
    grid-column-start: 2 !important;
    grid-column-end: 3 !important;
    grid-row-start: 1 !important;
    align-self: start !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
  }
img.card-heading-image {
    margin: calc(var(--card-padding) * -1) calc(var(--card-padding) * -1) var(--card-padding) !important;
    width: calc(var(--card-padding) * 2 + 100%) !important;
    height: auto !important;
    object-fit: cover !important;
  }
addon-card .card > img.card-heading-image:not([hidden]) {
    display: inline !important;
  }
addon-card .card > img.card-heading-image:not([hidden]) + .addon-card-collapsed,
addon-card .card > img.card-heading-image:not([hidden]) + .addon-card-collapsed ~ addon-options {
    grid-row-start: 2 !important;
  }
addon-card .addon-name-container {
    margin-top: 0 !important;
  }
div.arrow.top ~ div.list {
    display: var(--v-list-display-flex, block) !important;
    justify-content: flex-end !important;
  }
addon-card panel-list {
    position: static !important;
    display: block !important;
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
    min-width: 0 !important;
}
addon-card panel-item:where(:not([hidden])) {
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
  }
style + div.container {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
button.more-options-button[action="more-options"],
addon-card panel-item[action="expand"],
div.arrow.top, div.arrow.bottom,
addon-card panel-item-separator {
    display: none !important;
  }
#moz-toggle-button.toggle-button,
addon-card button.theme-enable-button,
link[href$="panel-item.css"] ~ button {
    display: flex !important;
    align-items: center !important;
    width: var(--v-buttons-width, 100%) !important;
    min-height: var(--v-buttons-min-height, 26px) !important;
    height: auto !important;
    line-height: 1.25em !important;
    padding: 0px calc(4px + .25em) !important;
    margin: 0 2px !important;
    background-image: var(--icon, none) !important;
    background-repeat: no-repeat !important;
    background-size: var(--v-buttons-icon-size, 16px) !important;
    background-position-y: center !important;
    background-position-x: left 4px !important;
    padding-inline-start: calc(4px + .25em + var(--v-buttons-icon-size, 16px)) !important;
    background-color: var(--v-content-button-background) !important;
    border-color: var(--v-content-button-border-color) !important;
    border-style: solid !important;
    border-width: var(--v-buttons-border-width, 0px) !important;
    color: var(--v-content-button-color) !important;
    border-radius: var(--v-buttons-border-radius, 0) !important;
    font-weight: var(--v-buttons-font-weight, inherit) !important;
    font-size: var(--v-buttons-font-size, inherit) !important;
    appearance: none !important;
    box-shadow: none !important;
    outline: none !important;
    -moz-context-properties: fill;
    fill: currentColor;
  }
#moz-toggle-button.toggle-button,
addon-card button.theme-enable-button {
    padding-inline-start: 0 !important;
  }
#moz-toggle-button.toggle-button {
    border-color: var(--v-content-button-border-color) !important;
  }
#moz-toggle-button.toggle-button:enabled:hover,
addon-card button.theme-enable-button:enabled:hover,
addon-card button.more-options-button:enabled:hover,
link[href$="panel-item.css"] ~ button:enabled:hover {
    background-color: var(--v-content-button-background-hover) !important;
    color: var(--v-content-button-color-hover) !important;
    border-color: var(--v-content-button-border-color-hover) !important;
  }
addon-card .card.addon .card-contents #moz-toggle-button.toggle-button:enabled:hover {
    border-color: var(--v-content-button-border-color-hover) !important;
  }
#moz-toggle-button.toggle-button:enabled:hover:active,
addon-card button.theme-enable-button:enabled:hover:active,
link[href$="panel-item.css"] ~ button:enabled:hover:active {
    background-color: var(--v-content-button-background-active) !important;
    color: var(--v-content-button-color-active) !important;
  }
#moz-toggle-button.toggle-button::-moz-focus-inner,
addon-card button.theme-enable-button::-moz-focus-inner,
link[href$="panel-item.css"] ~ button::-moz-focus-inner {
    border: none !important;
  }
link[href$="panel-item.css"] ~ button::after {
    inset: 0px !important;
    bottom: auto !important;
    height: 3px !important;
    width: auto !important;
    border-radius: 0 !important;
  }
#moz-toggle-button.toggle-button::before {
    all: unset !important;
    display: inline-block !important;
    content: var(--v-buttons-toggle-button-content, none) !important;
    white-space: nowrap !important;
    margin-inline-start: calc(4px + .25em + var(--v-buttons-icon-size, 16px)) !important;
  }
#moz-toggle-button.toggle-button:dir(rtl),
addon-card button.theme-enable-button:dir(rtl),
link[href$="panel-item.css"] ~ button:dir(rtl) {
    background-position-x: right 4px !important;
  }
link[href$="panel-item.css"] ~ button > label {
    padding: 0 !important;
    margin: 0 !important;
  }
addon-card .more-options-menu {
    flex-grow: 0 !important;
    position: static !important;
    margin: 0 !important;
    align-self: start !important;
  }
addon-card .addon-name,
addon-card .addon-description {
    white-space: nowrap !important;
    overflow-x: hidden !important;
    text-overflow: ellipsis !important;
  }
#moz-toggle-button.toggle-button::after,
addon-card button.theme-enable-button::after,
addon-card panel-item::after {
    display: var(--v-buttons-tooltip-display, none) !important;
    content: "";
    max-width: 0;
    pointer-events: none !important;
  }
#moz-toggle-button.toggle-button:hover::after,
addon-card button.theme-enable-button:hover::after,
addon-card panel-item:hover::after {
    animation-name: tooltip_delay !important;
    animation-timing-function: step-end !important;
    animation-duration: 0s !important;
    animation-iteration-count: 1 !important;
    animation-fill-mode: forwards !important;
    animation-delay: var(--v-buttons-tooltip-delay, .5s) !important;
    --v-buttons-tooltip-transform:
       translate(calc(1px + var(--v-buttons-tooltip-translate-x)),
       calc(100% + var(--v-buttons-tooltip-translate-y)));
  }
@keyframes tooltip_delay {
    from {
      max-width: 0;
    }
    to {
      content: var(--v-buttons-tooltip-content, "");
      align-self: flex-end;
      position: absolute;
      color: var(--v-buttons-tooltip-color);
      background: var(--v-buttons-tooltip-background);
      border: 1px solid var(--v-buttons-tooltip-border-color);
      border-radius: var(--v-buttons-tooltip-border-radius, 0);
      padding: 2px 0px 4px 0px;
      min-width: 15em;
      max-width: 50em;
      line-height: 1.25em;
      font-size: 0.7rem;
      font-weight: normal;
      text-align: center;
      z-index: var(--z-index-popup, 10);
      white-space: pre-wrap;
      overflow: hidden;
      text-overflow: ellipsis;
      transform: var(--v-buttons-tooltip-transform, none);
    }
  }
addon-card .toggle-button:hover::after,
addon-card button.theme-enable-button:hover::after {
    --v-buttons-tooltip-transform: translate(calc(var(--v-buttons-tooltip-translate-x) - 1px), calc(100% + 1px + var(--v-buttons-tooltip-translate-y)));
  }
addon-card button.theme-enable-button::before {
    content: "";
    display: inline-block;
    width: calc(4px + .25em + var(--v-buttons-icon-size, 16px));
  }

/***/
}

Отредактировано _zt (18-06-2023 08:20:07)

doud · №13187

Подскажите, пожалуйста, как изменить цвет фокусирующей рамки в окне "изменить закладку" (правый клик мышкой по закладке в боковой панели закладок)?

_zt · №13188

doud
Вас точно только это интересует? Меня например,очень много фокусирущих цветов раздражает. При чем, я вижу, что на win НЕ 7 цвета другие. Т.е. у этих педиков явный сговор с MS.

doud · №13189

_zt
Да, мне очень не нравятся эти синие рамки. Убрал везде, где смог, осталась только эта...

6e73epo · №13190

doud, при добавлении или изменении закладки вроде вызывается диалог свойств. Для меня и текст слишком яркий, поэтому рулит opacity, а если тебе не подходит, то можешь чисто для фокуса поменять цвет outline-color

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

Выделить код

Код:

@-moz-document url-prefix("chrome://browser/content/places/bookmarkProperties.x") {
  input[type], input[type]:focus {
    opacity: 0.8;
  }
}

Dumby · №13191

6e73epo пишет

input

А как же фокусная рамка button и richlistbox?
В смысле когда клавишей Tab фокусируешь.

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

Выделить код

Код:

@-moz-document url(chrome://browser/content/places/bookmarkProperties.xhtml) {
	#editBookmarkPanelContent, button {
		--in-content-focus-outline-color: red !important;
	}
}

doud · №13192

Сработал такой код: @-moz-document url-prefix("chrome://browser/content/places/bookmarkProperties.x") {
input[type], input[type]:focus {
outline-color: threedshadow !important;
}
}

Отредактировано doud (19-06-2023 23:29:59)

kokoss · №13193

doud

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

Выделить код

Код:

@-moz-document url(chrome://browser/content/places/bookmarkProperties.xhtml) {
#editBookmarkPanelContent, button {
  --in-content-focus-outline: 2px solid threedshadow !important;
  --in-content-focus-outline-color: threedshadow !important;
}
}

Отредактировано kokoss (20-06-2023 08:42:34)

doud · №13194

6e73epo
Dumby
kokoss
Благодарю,все получилось, как надо :beer:

Neytrino · №13195

Всем доброго времени суток. Есть желание скрыть GMail Notifier в меню расширений (в режиме приватного просмотра):

Выделить код

Код:

#main-window[privatebrowsingmode="temporary"] #jid0-gjwrpchs3ugt7xydvqvk4dqk8ls_jetpack-BAP
    	{
	display:none !important;
    	}

при использовании такого кода - остаётся пустое место. Можно ли как-то от него избавиться?

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

kokoss · №13196

Neytrino пишет

Есть желание скрыть GMail Notifier в меню расширений (в режиме приватного просмотра):

А такой вариант не устроит -> меню расширений -> ПКМ на иконке расширения -> управление расширением -> запуск в приватных окнах -> не разрешать.

Отредактировано kokoss (20-06-2023 15:37:38)

Neytrino · №13197

kokoss, тоже вариант, спасибо. Но если кто-то может решить проблему через userchrom.css - тоже интересно (вдруг понадобится убить кнопку какого-нить расширения - оставив его при этом работать)...

kokoss · №13198

Neytrino пишет

Но если кто-то может решить проблему через userchrom.css - тоже интересно

Замените -> #jid0-gjwrpchs3ugt7xydvqvk4dqk8ls_jetpack-BAP на -> #jid0-gjwrpchs3ugt7xydvqvk4dqk8ls_jetpack-browser-action

Neytrino · №13199

kokoss, ещё раз спасибо!

Xenosag · №13200

Прошу помощи, долго использую версию 107.0.1 из-за того что ломаются настройки userChrome. Попробовал несколько разных вариантов с данного форума и понимаю что каждый раз чего-то не хватает или выглядит не так. Можно ли как-то адаптировать мой конфиг под новую версию? Основные изменения были в перемещении вкладок под закладки, использование строки поиска, описание вкладки на верхней кромке и регулировка различных высот и ширины. По мелочи были значки активного звука рядом со значком вкладки и наверное что-то ещё было, что уже не помню.
Вот мой конфиг под версию 107.0.1:

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

@-moz-document url("chrome://browser/content/browser.xhtml") {
*|*:root {
--v-toolbar-menubar-height: 26px; /* высота панели меню, только чётные числа не меньше 20px,
если изменяете эту переменную то и в --v-toolbar-menubar-height-content - атрибут height= нужно установить ровно в два раза больше*/
--v-toolbar-menubar-height-content: url("data:image/svg+xml,<svg width='28' height='52' xmlns='http://www.w3.org/2000/svg'><rect x='0' y='0' width='100%' height='100%' style='fill:transparent;'/></svg>"); /* height='2 * --v-toolbar-menubar-height' */
--tab-border-radius: 4px !important;

/* **************************************** */
--proton-tab-block-margin: 0px !important;
--tab-block-margin: 0px !important;
}
#navigator-toolbox {
border-block: none !important;
box-shadow: none !important;
padding-top: 0 !important;
-moz-appearance: none !important;
appearance: none !important;
}
*|*:root:not([inFullscreen])[tabsintitlebar] #navigator-toolbox {
position: relative !important;
}
#navigator-toolbox > toolbar {
-moz-box-ordinal-group: 10 !important;
}
#navigator-toolbox > #nav-bar {
margin-block: 0 !important;
box-shadow: none !important;
-moz-box-ordinal-group: 0 !important;
padding-inline: 0 !important;
}
*|*:root:not([inFullscreen]) #navigator-toolbox > #nav-bar {
margin-top: var(--v-toolbar-menubar-height) !important;
}
#navigator-toolbox > #PersonalToolbar {
-moz-box-ordinal-group: 1 !important;
}
*|*:root:not([inFullscreen])[tabsintitlebar] > *|body::before {
content: var(--v-toolbar-menubar-height-content) !important;
display: -moz-box !important;
-moz-box-flex: 0 !important;
-moz-box-orient: vertical !important;
-moz-box-pack: start !important;
-moz-box-align: stretch !important;
-moz-box-ordinal-group: 0 !important;
margin-bottom: calc(-2 * var(--v-toolbar-menubar-height)) !important;
box-sizing: content-box !important;
}
*|*:root:not([inFullscreen])[tabsintitlebar][sizemode="normal"] > *|body::before {
-moz-appearance: -moz-window-titlebar !important;
appearance: -moz-window-titlebar !important;
}
*|*:root:not([inFullscreen])[tabsintitlebar][sizemode="maximized"] > *|body::before {
-moz-appearance: -moz-window-titlebar-maximized !important;
appearance: -moz-window-titlebar-maximized !important;
}
*|*:root:not([inFullscreen])[tabsintitlebar]:-moz-lwtheme > *|body::before {
visibility: hidden !important;
}
#navigator-toolbox > #titlebar {
-moz-appearance: none !important;
appearance: none !important;
-moz-box-ordinal-group: 100 !important;
position: static !important;
}
#toolbar-menubar {
padding-block: 0 !important;
margin-block: 0 !important;
border: none !important;
background: none !important;
--toolbarbutton-outer-padding: 0px !important;
--toolbarbutton-inner-padding: calc((var(--v-toolbar-menubar-height) - 16px) / 2) !important;
-moz-appearance: none !important;
appearance: none !important;
}
*|*:root:not(:is([inFullscreen],[chromehidden~="menubar"])) #toolbar-menubar {
position: absolute !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
display: flex !important;
flex-wrap: nowrap !important;
flex-direction: row !important;
align-items: stretch !important;
justify-content: flex-start !important;
min-height: 0 !important;
height: var(--v-toolbar-menubar-height) !important;
overflow: hidden !important;
}
#toolbar-menubar *|*.toolbarbutton-badge {
margin-inline-end: calc(-1 * (var(--toolbarbutton-outer-padding) + var(--toolbarbutton-inner-padding))) !important;
}
*|*:root:not([inFullscreen]) #toolbar-menubar > :is(toolbaritem,toolbarbutton) {
align-self: center !important;
}
*|*:root:not([inFullscreen]) #toolbar-menubar > :is(#menubar-items,#wrapper-menubar-items,.titlebar-buttonbox-container) {
align-self: flex-start !important;
}
*|*:root:not([inFullscreen]) #toolbar-menubar > * {
padding-block: 0 !important;
margin-block: 0 !important;
}
*|*:root:not([inFullscreen]) #toolbar-menubar[autohide="true"][inactive="true"]:not([customizing="true"]) > *:not(.titlebar-buttonbox-container) {
opacity: 0 !important;
pointer-events: none !important;
}
*|*:root[inFullscreen] #toolbar-menubar {
visibility: collapse !important;
}
*|*:root:not([inFullscreen]) #toolbar-menubar > :is(*[style*="-moz-box-ordinal-group: 1000;"],.titlebar-buttonbox-container) {
order: 1000 !important;
}
*|*:root:not([inFullscreen]) #toolbar-menubar > :is(toolbarspring,spacer,[id^="wrapper-customizableui-special-spring"]) {
flex-grow: 1 !important;
}
*|*:root:not([inFullscreen]) #toolbar-menubar > :is(#search-container,#wrapper-search-container) {
flex-grow: 100 !important;
}
#toolbar-menubar #search-container {
padding-block: 0 !important;
}
#toolbar-menubar #searchbar {
min-height: calc(var(--v-toolbar-menubar-height) - 2px) !important;
}
#TabsToolbar {
-moz-appearance: none !important;
appearance: none !important;
padding-block: 0 !important;
margin-block: 0 !important;
box-shadow: 0 -1px 0 var(--tabs-border-color, rgba(0,0,0,.3)) inset !important;
position: static !important;
background-color: var(--toolbar-bgcolor, -moz-dialog) !important;
background-image: var(--toolbar-bgimage, none) !important;
color: var(--toolbar-color, -moz-dialogtext) !important;
--lwt-toolbarbutton-icon-fill: inherit !important;
}
#TabsToolbar #tabbrowser-tabs {
padding-bottom: 0 !important;
margin-bottom: 0 !important;
}
#TabsToolbar .tabbrowser-tab {
background-color: transparent !important;
border-top: none !important;
}
#TabsToolbar .tab-background {
border-end-end-radius: 0 !important;
border-end-start-radius: 0 !important;
}
#TabsToolbar > .toolbar-items {
padding-top: 0 !important;
margin-top: 0 !important;
}

#TabsToolbar .titlebar-buttonbox-container,
#navigator-toolbox::after,
#TabsToolbar::after,
#TabsToolbar .titlebar-spacer:is([type="pre-tabs"],[type="post-tabs"]) {
display: none !important;
}
#scrollbutton-up, #scrollbutton-down {
border-block: none !important;
border-end-end-radius: 0 !important;
border-end-start-radius: 0 !important;
}
*|*:root[inFullscreen] #window-controls {
position: absolute !important;
display: flex !important;
align-items: start !important;
top: 0 !important;
left: auto !important;
right: 0 !important;
margin: 0 !important;
}
*|*:root[inFullscreen] #window-controls:-moz-locale-dir(rtl) {
left: 0 !important;
right: auto !important;
}
*|*:root[inFullscreen] #navigator-toolbox > #nav-bar {
padding-inline-end: var(--v-titlebar-buttonbox-container-width, 108px) !important;
}
*|*:root:not([inFullscreen])[v_menubar_autohide="true"] #navigator-toolbox > #nav-bar {
margin-top: 0 !important;
padding-inline-end: var(--v-titlebar-buttonbox-container-width, 108px) !important;
}
*|*:root:not([inFullscreen])[v_menubar_autohide="true"] #toolbar-menubar {
pointer-events: none !important;
}
*|*:root:not([inFullscreen])[v_menubar_autohide="true"] #toolbar-menubar .titlebar-buttonbox-container {
pointer-events: auto !important;
}
@media (-moz-os-version: windows-win7), (-moz-os-version: windows-win8) {
*|*:root[sizemode="normal"] #TabsToolbar {
border-inline: 1px solid hsla(240,5%,5%,0.3) !important;
background-clip: padding-box !important;
}
@media (-moz-windows-classic: 0) {
*|*:root:not([inFullscreen])[v_menubar_autohide="true"][tabsintitlebar][sizemode="normal"] #navigator-toolbox > #nav-bar {
margin-top: 1px !important;
}
*|*:root:not([inFullscreen])[sizemode="normal"] #toolbar-menubar:not([autohide="true"]) > #menubar-items {
margin-top: 1px !important;
}
}
}
@media (-moz-windows-classic) {
*|*:root:not([inFullscreen])[tabsintitlebar][sizemode="normal"] #navigator-toolbox::before {
content: "" !important;
display: -moz-box !important;
height: 4px !important;
-moz-box-ordinal-group: 0 !important;
visibility: visible !important;
}
*|*:root:not([inFullscreen])[tabsintitlebar][sizemode="normal"]:-moz-lwtheme #navigator-toolbox::before {
background-image: linear-gradient(to bottom, ThreeDLightShadow 0, ThreeDLightShadow 1px, ThreeDHighlight 1px, ThreeDHighlight 2px, ActiveBorder 2px, ActiveBorder 4px, transparent 4px) !important;
}
*|*:root:not([inFullscreen])[tabsintitlebar][sizemode="normal"] #toolbar-menubar {
margin-top: 4px !important;
}
}
*|*:root[data-l10n-id="browser-main-window-mac"] {
--v-toolbar-menubar-height: 0px !important;
--v-toolbar-menubar-height-content: none !important;
}
*|*:root:not([inFullscreen])[tabsintitlebar][data-l10n-id="browser-main-window-mac"] #nav-bar {
margin-inline-start: calc(var(--toolbarbutton-outer-padding, 2px) + var(--v-titlebar-button-horizont-padding, 6px) * 6 + var(--v-titlebar-button-image-width, 12px) * 3) !important;
}
*|*:root:not([inFullscreen])[tabsintitlebar][data-l10n-id="browser-main-window-mac"] #TabsToolbar .titlebar-buttonbox-container {
visibility: visible !important;
display: -moz-box !important;
position: absolute !important;
display: flex !important;
top: 0 !important;
}
}

@-moz-document url("chrome://browser/content/browser.xhtml") {
:root[tabsintitlebar]:not([customizing],[inFullscreen],[chromehidden~="toolbar"]) #tabbrowser-tabs:not([movingtab]) .tabbrowser-tab[selected="true"]::before {
--v-titlebar-top: 4px; /* отступ сверху */
inset-inline-start: 12px !important; /* отступ в начале */
inset-inline-end: 110px !important; /* отступ в конце */
text-align: start !important; /* выравнивание текста */
font-family: inherit !important; /* имя шрифта */
font-size: inherit !important; /* размер шрифта */
font-weight: inherit !important; /* начертание шрифта */
font-style: inherit !important; /* стиль шрифта */

position: fixed !important;
content: attr(label) !important;
display: block !important;
top: var(--v-titlebar-top) !important;
white-space: nowrap !important;
line-height: 1.3em !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
pointer-events: none !important;
color: -moz-DialogText !important;
text-shadow: none !important;
opacity: 1 !important;
z-index: 3;
}

:root[tabsintitlebar]:-moz-lwtheme:not([customizing],[inFullscreen],[chromehidden~="toolbar"]) #tabbrowser-tabs:not([movingtab]) .tabbrowser-tab[selected="true"]::before {
color: var(--lwt-text-color, inherit) !important;
text-shadow: inherit !important;
}
@media (-moz-windows-compositor), (-moz-os-version: windows-win7) and (-moz-windows-default-theme) {
:root[tabsintitlebar][sizemode="maximized"]:not([customizing],[inFullscreen],[chromehidden~="toolbar"]) #tabbrowser-tabs:not([movingtab]) .tabbrowser-tab[selected="true"]::before {
top: calc(var(--v-titlebar-top) + 8px) !important;
}
}
@media (-moz-windows-classic) {
:root[tabsintitlebar]:not([customizing],[inFullscreen],[chromehidden~="toolbar"]) #tabbrowser-tabs:not([movingtab]) .tabbrowser-tab[selected="true"]::before {
top: calc(var(--v-titlebar-top) + 4px) !important;
}
}
}

:root:not([uidensity="touch"]) {
--tab-min-height: 24px !important;
}

/* non_active_tab_shape */

.tabbrowser-tab:not(:hover) > .tab-stack > .tab-background:not([selected=true], [multiselected]) {
background-color: color-mix(in srgb, currentColor 11%, transparent);
}

.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true], [multiselected]) {
background-color: color-mix(in srgb, currentColor 17%, transparent) !important;
}

.tab-icon-overlay[muted]:not([crashed]),
.tab-icon-overlay[soundplaying]:not([crashed]) {
margin-inline-start: 20px !important; /* отступ от левого края вкладки */
margin-inline-end: 2px !important; /* отступ от заголовка вкладки */
padding: 1px !important; /* размер динамика */
}
:root[uidensity="compact"] .tab-icon-stack:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) > :not(.tab-icon-overlay), #tabbrowser-tabs[secondarytext-unsupported] .tab-icon-stack:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) > :not(.tab-icon-overlay), :root:not([uidensity="compact"]) #tabbrowser-tabs:not([secondarytext-unsupported]) .tabbrowser-tab:not(:hover) .tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]), :root:not([uidensity="compact"]) #tabbrowser-tabs:not([secondarytext-unsupported]) .tabbrowser-tab:hover .tab-icon-stack:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) > :not(.tab-icon-overlay) {
opacity: 1 !important;
}

#tabbrowser-tabs:not([secondarytext-unsupported]) .tab-label-container {
height: auto !important;
}

Возможно там что-то лишнее, очень надеюсь что кто-нибудь поможет. Ну и фото, для понимания как это выглядяло:

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

Отредактировано Xenosag (21-06-2023 17:59:35)

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

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