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

Пользователи не любят читать документацию. Станьте оригинальным, будьте не как все. Ознакомьтесь с нашей базой знаний.

№1415125-06-2024 22:12:15

grom17
Участник
 
Группа: Members
Зарегистрирован: 13-06-2019
Сообщений: 34
UA: Firefox 127.0

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

_zt

_zt пишет

Проверьте.

    #urlbar > .urlbarView,
    #urlbar[breakout] > .urlbarView,
    #urlbar-results,
    .search-panel-one-offs-container {
        background-color: rgba(43,42,51,0.7) !important;
    }

И, возможно, найдите и закомментируйте, в своем стиле, в идентичных селекторах background и background-color.

Там таких селекторов "миллион" отключал полностью файлами, на чистый профиль ставил не хочет работать. 

_zt пишет

:root {
    --arrowpanel-background: rgba(43,42,51,0.9) !important;
    --v-arrowpanel-background: rgba(43,42,51,0.9) !important;
}

а это работает, за исключением того что я написал выше.

Отредактировано grom17 (25-06-2024 22:55:25)

Отсутствует

 

№1415226-06-2024 12:28:11

_zt
Участник
 
Группа: Members
Зарегистрирован: 10-11-2014
Сообщений: 1573
UA: Firefox 128.0

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

grom17
На самом деле прозрачность есть, но только для самого меню, а не для его строк, которые имеют собственный фон.
Я могу дать полный стиль для строки адреса ( * ) и его меню, он включает антимегабар с закомментированным background в подсекции &[breakout] > .urlbarView + измененный стиль из конфигуратора + правка, что я выше давал.
   
Но

grom17 пишет

Там таких селекторов "миллион"

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

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

Выделить код

Код:

/* антимегабар --> */
:root {
    --urlbar-margin-inline: 1px !important;
    --v-urlbar-searchbar-border-radius: 2px;
}
:root[uidensity=touch] {
    --urlbar-margin-inline: 5px !important;
}

#urlbar-container {
    padding: 1px 0 !important;
    margin: 0 var(--urlbar-margin-inline) !important;
    &[breakout] {
        position: relative !important;
    }
    #urlbar {
        #identity-icon-box,
        #identity-box {
            max-width: calc(30px + 15em) !important;
        }
        &[breakout] {
            display: block !important;
            position: absolute !important;
            width: 100% !important;
            height: var(--urlbar-height) !important;
            top: calc((var(--urlbar-container-height) - var(--urlbar-height)) / 2) !important;
            inset-inline: 0 !important;
        }
        &[breakout] > :is(#urlbar-input-container,.urlbar-input-container) {
            width: 100% !important;
            height: var(--urlbar-height) !important;
            padding: 0 !important;
        }
        &[breakout][breakout-extend],
        &[breakout][breakout-extend-disabled][open] {
            height: auto !important;
        }
        &[breakout] > #urlbar-background {
            display: block !important;
            position: absolute !important;
            animation: none !important;
            inset-inline: 0 !important;
            box-shadow: none !important;
            height: var(--urlbar-height) !important;
            top: 0 !important;
            bottom: auto !important;
        }
        &[breakout][open] > #urlbar-background {
            border-color: var(--toolbar-field-border-color, transparent) !important;
        }
        &[breakout][focused] > #urlbar-background {
            border-color: var(--toolbar-field-focus-border-color, Highlight) !important;
        }
        &[breakout] > .urlbarView {
            margin: 0 !important;
            width: 100% !important;
            border-radius: var(--v-urlbar-searchbar-border-radius) !important;
/*            background: var(--toolbar-field-focus-background-color, Field) !important;
            color: var(--toolbar-field-focus-color, FieldText) !important; /* !!! */
            border: 1px solid var(--arrowpanel-border-color, ThreeDShadow) !important;
            border-top: none !important;
            box-shadow: 0 2px 14px rgba(0, 0, 0, 0.13);
            .searchbar-engine-one-off-item {
                margin: 0 !important;
                min-width: 28px !important;
                height: 28px !important;
                &:not(.search-setting-button)::after {
                    content: "";
                    border-inline-end: 1px solid;
                    border-image: linear-gradient(transparent 15%, var(--urlbarView-separator-color) 15%, var(--urlbarView-separator-color) 85%, transparent 85%) 1 1;
                }
            }
            .search-panel-one-offs-container {
                min-width: calc(5 * 28px) !important;
            }
            .urlbarView-quickaction-button {
                border-radius: var(--toolbarbutton-border-radius) !important;
                box-shadow: none !important;
            }
        }
        &[breakout] > .urlbarView .urlbarView-body-inner {
            border: none !important;
        }
        &[breakout] > .urlbarView .search-one-offs,
        &[breakout] > .urlbarView .urlbarView-results {
            padding-block: 0 !important;
        }
        &:not([focused]) input {
            mask-image: linear-gradient(to left, transparent, black 3ch);
            mask-repeat: no-repeat;
        }
        &:not([focused]):-moz-locale-dir(rtl) input {
            mask-image: linear-gradient(to right, transparent, black 3ch);
        }
    }
}
#search-container {
    padding: 1px 0 !important;
    margin: 0 var(--urlbar-margin-inline) !important;
    #searchbar {
        .searchbar-search-icon {
            margin-inline-start: 6px !important;
        }
        &:not(:focus-within) input {
            mask-image: linear-gradient(to left, transparent, black 3ch);
            mask-repeat: no-repeat;
        }
        &:not(:focus-within):-moz-locale-dir(rtl) input {
            mask-image: linear-gradient(to right, transparent, black 3ch);
        }
    }
}
#urlbar :is(#urlbar-input-container,.urlbar-input-container,#urlbar-background), #searchbar {
    box-shadow: none !important;
    background-clip: border-box !important;
    border-radius: var(--v-urlbar-searchbar-border-radius) !important;
    overflow: clip;
}
#urlbar, #searchbar {
    min-height: var(--urlbar-min-height) !important;
    font-size: 1em !important;
    box-shadow: none !important;
    align-items: stretch !important;
}
#PopupSearchAutoComplete {
    --panel-subview-body-padding: 0 !important;
    --panel-padding: 0 !important;
    --panel-border-radius: var(--v-urlbar-searchbar-border-radius) !important;
    --panel-shadow: 0 2px var(--panel-shadow-margin) rgba(0, 0, 0, 0.13) !important;
    --panel-shadow-margin: 14px !important;
    & > .search-panel-current-engine {
        margin-top: 0px !important;
        padding-inline: 6px !important;
    }
    & > menuseparator.searchbar-separator {
        display: none !important;
    }
    & > .search-one-offs:not([hidden]) {
        border-top: 1px solid var(--urlbarView-separator-color);
        display: flex !important;
        align-items: start !important;
        flex-wrap: wrap !important;
    }
    .search-panel-one-offs-container {
        min-width: calc(5 * 28px) !important;
    }
    .searchbar-engine-one-off-item {
        margin: 0 !important;
        min-width: 28px !important;
        height: 28px !important;
        &:not(.search-setting-button)::after {
            content: "";
            border-inline-end: 1px solid;
            border-image: linear-gradient(transparent 15%, var(--urlbarView-separator-color) 15%, var(--urlbarView-separator-color) 85%, transparent 85%) 1 1;
        }
    }
}
#urlbar-search-splitter {
    min-width: 6px !important;
    width: 6px !important;
    margin: 0 -3px !important;
}
/* <-- антимегабар */


/*********** PARTIAL - Megabar Styler General - version 2023-03-23 ************/
/***** https://www.userchrome.org/megabar-styling-firefox-address-bar.html ****/

  /*** General Preferences ***/
  :root {
    /* Number of pixels of enlargement when URL bar is focused */
    --mbarstyler-popout-pixels: 0px; /* [0px - 7px] */

    /* Top Bar Display or Not */
    --mbarstyler-top-bar-display: none; /* [block,none] */

    /* Font sizes (default: 13.8px for title, 10.2px for URL) */
    --mbarstyler-title-font-size: 14px; /* [13px - 18px] */
    --mbarstyler-url-font-size: 12px; /* [12px - 16px] */

    /* Rows to show without scrolling */
    --mbarstyler-max-rows-without-scrolling: 20;

    /* Bottom border for each result row */
    --mbarstyler-bottom-border-width: 0px; /* [0px or 1px] */

    /* Height adjustment for labels (Proton) */
    --mbarstyler-label-height-adjustment: 0px; /* [0px or 35px] */
   
    /* Match display style */
    --mbarstyler-match-weight: 400; /* [400,700] */
    --mbarstyler-match-background-opacity: 0.1; /* [0.0,0.05,0.1] */
  }
  /*** Top "Blue Bar" Display ***/

  .urlbarView-row:first-of-type {
    display: var(--mbarstyler-top-bar-display) !important;
  }

  /*** Font Sizes and Scrolling ***/

  /* Title font-size */
  .urlbarView-row .urlbarView-title {
    font-size: var(--mbarstyler-title-font-size) !important;
  }

  /* URL / action font-size */
  .urlbarView-row .urlbarView-secondary,
  .urlbarView-row .urlbarView-url,
  .urlbarView-row .urlbarView-action {
    font-size: var(--mbarstyler-url-font-size) !important;
  }

  /* Set max-height for items visible without scrolling */
  #urlbarView-results, #urlbar-results {
    height: unset !important;
    max-height: calc(2.5 * (var(--mbarstyler-title-font-size) + var(--mbarstyler-bottom-border-width)) * var(--mbarstyler-max-rows-without-scrolling) + var(--mbarstyler-label-height-adjustment)) !important;
  }
  #urlbar-results {
    overflow-y: auto !important; 
  }

  /* Clean up extra spacing at the top and bottom */  
  #urlbar-results {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  /* Clean up extra vertical spacing on "tip" suggestions, shrink icon */  
  .urlbarView-row[type="tip"]{
    padding-block: 0px !important;
  }
  .urlbarView-row[type="tip"] > .urlbarView-row-inner {
    min-height: 0px !important;
  }
  .urlbarView-row[type="tip"] > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-favicon {
    height: 16px !important;
    width: 16px !important;
    flex-basis: 16px !important;
  }

  /* Subtle border between results */
  .urlbarView-row:not(:last-of-type) {
    border-bottom: var(--mbarstyler-bottom-border-width) solid rgba(0, 0, 0, 0.1) !important;
  }

  /* Match Styling Like Fx43-47 */
  [lwt-popup-darktext] .urlbarView-row:not([selected]) .urlbarView-title strong,
  [lwt-popup-darktext] .urlbarView-row:not([selected]) .urlbarView-url strong {
    font-weight: var(--mbarstyler-match-weight) !important;
    box-shadow: inset 0 0 1px 1px rgba(0, 0, 0, calc(var(--mbarstyler-match-background-opacity) * 2));
    background-color: rgba(0, 0, 0, var(--mbarstyler-match-background-opacity));
    border-radius: 2px;
  }
  [lwt-popup-brighttext] .urlbarView-row:not([selected]) .urlbarView-title strong,
  [lwt-popup-brighttext] .urlbarView-row:not([selected]) .urlbarView-url strong {
    font-weight: var(--mbarstyler-match-weight) !important;
    box-shadow: inset 0 0 1px 1px rgba(255, 255, 255, calc(var(--mbarstyler-match-background-opacity) * 2));
    background-color: rgba(255, 255, 255, var(--mbarstyler-match-background-opacity));
    border-radius: 2px;
  }

  /* Hide "Firefox Suggest", "Google Suggestions" and other labels */
  .urlbarView-row[label]::before {
    /* Suppress the text */
    display: none !important;
  }
  .urlbarView-row[label] {
    /* Remove the empty space */
    margin-block-start: 0 !important;
  }

/*** End of: Megabar Styler General ***/


/*** Megabar Styler Two-Row Flex Layout - version 2021-09-09 ***/

  /* Adjust heights for scrolling */
  #urlbarView-results, #urlbar-results {
    max-height: calc(1.625 * (var(--mbarstyler-title-font-size) + var(--mbarstyler-url-font-size) + var(--mbarstyler-bottom-border-width)) * var(--mbarstyler-max-rows-without-scrolling)) !important;
  }
    /* Wrap the url (adapted from Fx75 narrow bar design) */
  .urlbarView-row-inner {
    flex-wrap: wrap !important;
    padding-block: 1px !important;
  }
  .urlbarView-no-wrap {
    max-width: 100% !important;
    flex-basis: 100% !important;
    position: relative;
    background-color: rgba(0,0,0,0.05) !important;
  }
    /* Remove Proton excess height from search suggestions */
  :root:not([uidensity="compact"]) .urlbarView-row[type="search"]{
    min-height: unset !important;
  }

  /* Adjust horizontal and vertical URL position */
  .urlbarView-row[has-url] > .urlbarView-row-inner > .urlbarView-url {
    padding-inline-start: calc(6px + 4px + /* favicon */ 16px) !important;
    margin-top: calc(2px + (var(--mbarstyler-url-font-size) - var(--mbarstyler-title-font-size)));
  }

  /* Hide the separator if there's a URL */
  .urlbarView[actionoverride] .urlbarView-row[has-url] .urlbarView-title-separator,
  .urlbarView .urlbarView-row[has-url]:not([type$=tab]) .urlbarView-title-separator,
  .urlbarView .urlbarView-row[type=remotetab]:-moz-any(:hover, [selected]) .urlbarView-title-separator {
    display: none !important;
  }

  /* Move Switch Tab info to URL line :: added 2020-04-12 */

    /* Make sure URL is always visible */
    .urlbarView-row[type="switchtab"][has-url="true"] .urlbarView-url {
      visibility: visible !important;
    }
    /* Show Switch to Tab or Open depending on [actionoverride] */
    .urlbarView:not([actionoverride]) .urlbarView-row[type="switchtab"][has-url="true"] .urlbarView-url::before {
      content: "На вкладку: ";
      font-style: italic;
      color: var(--urlbar-popup-action-color);
    }
    .urlbarView:not([actionoverride]) .urlbarView-row[type="switchtab"][has-url="true"][selected] .urlbarView-url::before {
      color: HighlightText; /* 2020-05-31 improve visibility when selected */
    }
    .urlbarView[actionoverride] .urlbarView-row[type="switchtab"][has-url="true"] .urlbarView-url::before {
      content: "Открыть: ";
      font-style: italic;
      color: var(--urlbar-popup-action-color);
    }
    .urlbarView[actionoverride] .urlbarView-row[type="switchtab"][has-url="true"][selected] .urlbarView-url::before {
      color: HighlightText; /* 2020-05-31 improve visibility when selected */
    }
    /* Hide the existing Action phrase and separator */
    .urlbarView-row[type="switchtab"][has-url="true"] .urlbarView-action,
    .urlbarView-row[type="switchtab"][has-url="true"] .urlbarView-title-separator {
      display: none !important;
    }

  /* A little more room for the address bar when drop-down is open :: added 2020-06-02 */

  .urlbarView {
    margin-block-start: 0 !important;
  }

/*** End of: Megabar Styler Two-Row Flex Layout ***/


/*** Megabar Styler One-Offs - version 2020-05-31 ***/

  /*** One-Off Search Button Preferences ***/
  :root {
    /* One-Offs Display or Not */
    --mbarstyler-oneoffs-display: flex; /* [flex,none] */
  }

  /* Show or Hide the One-Offs Search Icon Bar */
  #urlbar .search-one-offs:not([hidden]) {
    display: var(--mbarstyler-oneoffs-display) !important;
  }
  /* Shorten the One-Offs Search Icon Bar Vertically */
  #urlbar .search-one-offs:not([hidden]) {
    padding-block: unset !important;
  }
  /* We don't need the text */
  #urlbar .search-one-offs .search-panel-header {
    display: none !important;
  }

/*** End of: Megabar Styler One-Offs ***/

@media (prefers-color-scheme: dark) {
#urlbar > .urlbarView, #urlbar[breakout] > .urlbarView, #urlbar-results, .search-panel-one-offs-container {
    background-color: rgba(43,42,51,0.5) !important;
}
}

Отсутствует

 

№14153Вчера 13:00:11

grom17
Участник
 
Группа: Members
Зарегистрирован: 13-06-2019
Сообщений: 34
UA: Firefox 127.0

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

В общем после долгих мытарств остановился на таком варианте:

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

Выделить код

Код:

/*  П Р О З Р А Ч Н О С Т Ь  */

:root, body, * {
--uc-context-menu: rgba(43,42,51,0.85); /* rgba(28, 27, 34, 0.85) */
}

menupopup, panel {
  color-scheme: light dark;
  --panel-background: var(--uc-context-menu) !important; /* Прозрачность меню кнопок Расширений, Загрузок и т. д. Defaukt: var(--uc-context-menu) */
  --panel-color: rgba(43,42,51,0.8); /* Default: var(--uc-light-dark) */
  /* --panel-border-radius: var(--uc-all-border-radius) !important; */
  --panel-border-color: #006bbb !important; /* Цвет бордюра SEARCH панели. Default: var(--uc-panel-border-ii) */
  /* --panel-shadow: 0 0 var(--panel-shadow-margin) hsla(0,0%,0%cc,.2); */
}
menupopup, panel {
  &::part(content) {
    background: var(--uc-active) !important;
    color: var(--uc-light-dark) !important;
    /* border-radius: var(--uc-all-border-radius) !important; */
    border: 0.5px solid var(--uc-panel-border) !important;
    font-family: Segoe UI;
  }
}

menuitem:hover{
background-color: rgba(0,0,0,0.1) !important; /* Подсветка при наведении. Default: var(--uc-active) */ 
color: var(--uc-light-dark); /* Цвет текста при наведении. Default: var(--uc-light-dark) */
 }

menu:where([_moz-menuactive="true"]:not([disabled="true"])), menuitem:where([_moz-menuactive="true"]:not([disabled="true"])) {
background-color: var(--uc-active) !important; /* Default: var(--uc-active) */ 
color: var(--uc-light-dark) !important; /* Default: var(--uc-light-dark) */
}

/* Прозрачность выпадающего меню Urlbar *//* var(--urlbar-color) */
#urlbar-background {
    background-color: rgba(41,48,54,0.8) !important;
}


по крайней мере у меня прекрасно работает.
Спасибо всем кто откликнулся и помог в этом не лёгком деле. :beer:

Отредактировано grom17 (Вчера 13:03:38)

Отсутствует

 

Board footer

Powered by PunBB
Modified by Mozilla Russia
Copyright © 2004–2020 Mozilla Russia GitHub mark
Язык отображения форума: [Русский] [English]