API tools faq
paste
Guest User

userChrome.css

a guest
Nov 6th, 2021
574
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 39.78 KB | None | 0 0
raw download clone embed print report
  1. /* https://raw.githubusercontent.com/black7375/Firefox-UI-Fix/master/userChrome.css */
  2. @media (-moz-proton) {
  3.   /** Darkmode - Color lighter ************************************************/
  4.   :root[style*="--lwt-accent-color:rgb(12, 12, 13); --lwt-text-color:rgba(249, 249, 250);"] {
  5.     --toolbar-bgcolor: rgba(43, 42, 51, 5) !important; /* Original: rgba(43, 42, 51, 1) */
  6.   }
  7.  
  8.   /** Root - Reduce Padding ***************************************************/
  9.   :root {
  10.     /* Tab Bar */
  11.     --proton-tab-block-margin: 2px !important; /* Original: 4px */
  12.     --inline-tab-padding:      6px !important; /* Original: 8px */
  13.  
  14.     /* Panel */
  15.     --arrowpanel-menuicon-padding: 8px;
  16.     --arrowpanel-menuitem-margin: 0 var(--arrowpanel-menuicon-padding) !important; /* Original: 0 8px */
  17.     --arrowpanel-menuitem-padding: 5px !important; /* Original: 8px */
  18.     --arrowpanel-padding:        0.8em !important; /* Original: 16px or .cui-widget-panel, .cui-widget-panel::part(arrowcontent) => 4px 0 */
  19.   }
  20.  
  21.   :root[uidensity=compact] {
  22.     /* Tool Bar */
  23.     --toolbarbutton-outer-padding: 2px !important; /* Original: 3px, General is 2px */
  24.  
  25.     /* Panel */
  26.     --arrowpanel-menuitem-padding: 3px  !important; /* Original: 8px */
  27.   }
  28.  
  29.   :root[uidensity=touch] {
  30.     /* Tab Bar - Like Original */
  31.     --proton-tab-block-margin: 4px !important; /* Original: 4px */
  32.     --inline-tab-padding:      8px !important; /* Original: 8px */
  33.  
  34.     /* Panel - Like Original */
  35.     --arrowpanel-menuitem-padding: 8px  !important; /* Original: 8px */
  36.   }
  37.  
  38.   /** Tab Bar - Reduce Width, Show more tabs **********************************/
  39.   .titlebar-spacer[type="pre-tabs"] {
  40.     width: 30px !important; /* Original: 40px */
  41.   }
  42.   .titlebar-spacer[type="post-tabs"] {
  43.     width: 25px !important; /* Original: 40px */
  44.   }
  45.  
  46.   :root {
  47.     --newtab-button-minus-width-padding: 2px;
  48.     --newtab-button-width-padding: calc(var(--toolbarbutton-inner-padding) - var(--newtab-button-minus-width-padding));
  49.   }
  50.   #new-tab-button     > .toolbarbutton-icon,
  51.   #alltabs-button     > .toolbarbutton-badge-stack {
  52.     /* Original: calc(2 * var(--toolbarbutton-inner-padding) + 16px) */
  53.     width: calc(2 * var(--newtab-button-width-padding) + 16px) !important;
  54.  
  55.     /* Original: --toolbarbutton-inner-padding */
  56.     padding-left:  var(--newtab-button-width-padding) !important;
  57.     padding-right: var(--newtab-button-width-padding) !important;
  58.   }
  59.  
  60.   #tabbrowser-tabs[haspinnedtabs]:not([positionpinnedtabs]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab[first-visible-unpinned-tab] {
  61.     margin-inline-start: 1px !important;
  62.   }
  63.  
  64.   :root:not([uidensity=touch]) #tabbrowser-arrowscrollbox {
  65.     --scrollbtn-inner-padding: 1px;
  66.     --scrollbtn-outer-padding: 3px;
  67.   }
  68.   #scrollbutton-up {
  69.     padding-left:  var(--scrollbtn-inner-padding, 4px) !important; /* Original: 4px */
  70.     padding-right: var(--scrollbtn-outer-padding, 4px) !important;
  71.   }
  72.   #scrollbutton-down {
  73.     padding-left:  var(--scrollbtn-outer-padding, 4px) !important; /* Original: 4px */
  74.     padding-right: var(--scrollbtn-inner-padding, 4px) !important;
  75.   }
  76.  
  77.   :root:not([uidensity=touch]) #new-tab-button, #alltabs-button {
  78.     --toolbarbutton-outer-padding: 1px; /* Original: 2px*/
  79.   }
  80.  
  81.   /* Tab - Max Size */
  82.   .tabbrowser-tab[fadein]:not([pinned]):not([style*="max-width"]) {
  83.     max-width: 240px !important; /* Original: 225px */
  84.   }
  85.  
  86.   /* neighbouring tabs should "pinch" together */
  87.   .tabbrowser-tab {
  88.     padding-inline: 1px !important;
  89.   }
  90.  
  91.   .tabbrowser-tab:not([last-visible-tab]) {
  92.     margin-inline-end: -.5px !important;
  93.   }
  94.  
  95.   /** Tab Bar - Reduce Height, Show more contents *****************************/
  96.   :root:not([uidensity=touch]) #TabsToolbar {
  97.     --toolbarbutton-inner-padding: 9px; /* Original: calc((var(--tab-min-height) - 16px) / 2) = 10px */
  98.   }
  99.  
  100.   .toolbar-items, .tabbrowser-tab {
  101.     max-height: 38px;
  102.   }
  103.   :root[uidensity=compact] .toolbar-items, .tabbrowser-tab {
  104.     max-height: 36px;
  105.   }
  106.   :root[uidensity=touch] .toolbar-items, .tabbrowser-tab {
  107.     max-height: unset;
  108.   }
  109.  
  110.   :root:not([uidensity=touch]) #tabbrowser-arrowscrollbox {
  111.     --scrollbtn-vertical-padding: 3px;
  112.   }
  113.   #scrollbutton-up,
  114.   #scrollbutton-down {
  115.     /* Original: var(--toolbarbutton-inner-padding) calc(var(--toolbarbutton-inner-padding) - 6px) = 9px */
  116.     /* https://github.com/mozilla/gecko-dev/blob/71b1259afd1cdaf41871ae675c2dadb967ea5b34/browser/themes/shared/toolbarbuttons.inc.css#L142 */
  117.     padding-top:    var(--scrollbtn-vertical-padding, var(--toolbarbutton-inner-padding)) !important;
  118.     padding-bottom: var(--scrollbtn-vertical-padding, var(--toolbarbutton-inner-padding)) !important;
  119.   }
  120.  
  121.   :root[tabsintitlebar]:not([uidensity=compact]) #toolbar-menubar[autohide="true"] {
  122.     height: calc(var(--tab-min-height) - var(--tabs-navbar-shadow-size) - 2px); /* Compact: 28px, Normal: 33px, Touch: 38px */
  123.   }
  124.  
  125.   /* Pinned Tab - Titlechanged Indicator position fix */
  126.   :root:not([uidensity=touch]) .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected="true"]),
  127.   :root:not([uidensity=touch]) .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
  128.     /* Original: center bottom calc(6.5px + var(--tabs-navbar-shadow-size)); */
  129.     background-position-y: bottom calc(4.5px + var(--tabs-navbar-shadow-size)) !important;
  130.   }
  131.   :root[uidensity=compact] .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected="true"]),
  132.   :root[uidensity=compact] .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
  133.     /* Original: center bottom calc(6.5px + var(--tabs-navbar-shadow-size)); */
  134.     background-position-y: bottom calc(.5px + var(--tabs-navbar-shadow-size)) !important;
  135.   }
  136.  
  137.   /** Tab Bar - Connect to window *********************************************/
  138.   .tab-background {
  139.     border-radius: var(--tab-border-radius) var(--tab-border-radius) 0px 0px !important;
  140.     margin-bottom: 0px !important;
  141.   }
  142.  
  143.   .tab-content {
  144.     margin-top: var(--proton-tab-block-margin);
  145.   }
  146.  
  147.   .tab-stack {
  148.     margin-top:    0px !important;
  149.     margin-bottom: 0px !important;
  150.   }
  151.  
  152.   /** Selected Tab - Color like toolbar ***************************************/
  153.   #tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab > .tab-stack > .tab-background[multiselected="true"]:-moz-lwtheme, #tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab > .tab-stack > .tab-background[selected="true"]:-moz-lwtheme {
  154.     /* Original: linear-gradient(var(--lwt-selected-tab-background-color, transparent), var(--lwt-selected-tab-background-color, transparent)), linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-header-image, none)
  155.  */
  156.     background-image: linear-gradient(var(--toolbar-bgcolor, transparent), var(--toolbar-bgcolor, transparent)), linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-header-image, none) !important;
  157.   }
  158.  
  159.  
  160.   /* Multi Selected Color */
  161.   .tab-background[multiselected="true"]:not([selected="true"]) > .tab-loading-burst.proton:not([bursting]) {
  162.     background: color-mix(in srgb, currentColor 65%, transparent);
  163.     opacity: .3;
  164.   }
  165.   #TabsToolbar[brighttext] .tab-background[multiselected="true"]:not([selected="true"]) > .tab-loading-burst.proton:not([bursting]) {
  166.     opacity: .15;
  167.   }
  168.  
  169.   /** Selected Tab - Box Shadow ***********************************************/
  170.   #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab[visuallyselected="true"] > .tab-stack > .tab-background:-moz-lwtheme {
  171.     /* Origina: 0 0 1px var(--tab-line-color, rgba(128,128,142,0.9))
  172.        Bright: 0 0 1px var(--tab-line-color, rgba(128,128,142,0.9)), 0 0 4px rgba(128,128,142,0.5) */
  173.     box-shadow: 0 0 1px var(--toolbar-color) !important;
  174.   }
  175.   #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab[multiselected]:not([visuallyselected]) > .tab-stack > .tab-background:-moz-lwtheme {
  176.     box-shadow: 0 0 1px color-mix(in srgb, var(--toolbar-color) 80%, transparent)  !important;
  177.   }
  178.  
  179.   /* Pinned Tab - tabbrowser-arrowscrollbox overflowing */
  180.   #tabbrowser-tabs[positionpinnedtabs] > #tabbrowser-arrowscrollbox > .tabbrowser-tab[pinned] {
  181.     z-index: 0 !important;
  182.   }
  183.  
  184.   /** Selected Tab - Bottom Rounded Corner ************************************/
  185.   #tabbrowser-tabs {
  186.     --tab-corner-rounding: 5px; /* 10px looks about like chromium - 17px looks close to Australis tabs */
  187.     --tab-corner-padding:  1px;
  188.   }
  189.  
  190.   :root[lwtheme="true"] tab[visuallyselected] > stack::before,
  191.   :root[lwtheme="true"] tab[visuallyselected] > stack::after {
  192.     /* Box */
  193.     content: "" !important;
  194.     display: block !important;
  195.     position: absolute !important;
  196.     z-index: 1 !important;
  197.  
  198.     /* Shape */
  199.     width:  var(--tab-corner-rounding) !important;
  200.     height: 100% !important;
  201.  
  202.     /* Color */
  203.     fill:   var(--toolbar-bgcolor) !important;
  204.     stroke: var(--tabs-border-color, transparent) !important;
  205.     -moz-context-properties: fill, stroke !important;
  206.  
  207.     background-image: url(./icons/tab-bottom-corner.svg);
  208.     background-size:   var(--tab-corner-rounding);
  209.     background-repeat: no-repeat;
  210.     background-position-y: bottom;
  211.   }
  212.  
  213.   :root[lwtheme="true"] tab[visuallyselected] > stack::before {
  214.     left: calc(var(--tab-corner-padding) - var(--tab-corner-rounding)) !important;
  215.   }
  216.   :root[lwtheme="true"] tab[visuallyselected] > stack::after {
  217.     left:  auto;
  218.     right: calc(var(--tab-corner-padding) - var(--tab-corner-rounding));
  219.     transform: scaleX(-1) !important;
  220.   }
  221.  
  222.   /** Unselected Tab - Divide line ********************************************/
  223.   #tabbrowser-arrowscrollbox:not([overflowing]) .tabbrowser-tab[first-visible-unpinned-tab] .tab-background::before,
  224.   .tabbrowser-tab:not([visuallyselected], [multiselected], :hover, :first-child) .tab-background::before,
  225.   #tabbrowser-arrowscrollbox:not([overflowing]) .tabbrowser-tab:not([visuallyselected], [multiselected], :hover)[last-visible-tab] .tab-background::after {
  226.     /* Box Model */
  227.     content:  "";
  228.     display:  block;
  229.     position: absolute;
  230.     top:   50%;
  231.  
  232.     /* Bar shape */
  233.     width:     1px;
  234.     height:   20px;
  235.     overflow: hidden;
  236.  
  237.     /* Bar Color */
  238.     opacity: var(--tab-separator-opacity);
  239.     transition: opacity .2s var(--ease-basic) !important;
  240.     background-color: color-mix(in srgb, currentColor 20%, transparent) !important; /*  Replace var(--toolbarseparator-color) - Hard coded for compatibility */
  241.   }
  242.  
  243.   .tab-background::before {
  244.     transform: translateX(-2.5px) translateY(calc(-50% + 1px)) !important;
  245.   }
  246.   .tabbrowser-tab[last-visible-tab] .tab-background::after {
  247.     right: 0;
  248.     transform: translateX(.5px) translateY(calc(-50% + 1px)) !important;
  249.   }
  250.  
  251.   .tabbrowser-tab:is([visuallyselected], [multiselected], :hover) + .tabbrowser-tab:not([visuallyselected]) .tab-background::before,
  252.   .tabbrowser-tab[first-visible-unpinned-tab]:is([visuallyselected], [multiselected], :hover) .tab-background::before,
  253.   #tabbrowser-arrowscrollbox[overflowing] tab.tabbrowser-tab[first-visible-unpinned-tab] .tab-background::before {
  254.     opacity: 0 !important;
  255.   }
  256.  
  257.   /* Latest Tab & New tab margin */
  258.   #tabbrowser-arrowscrollbox:not([overflowing]) .tabbrowser-tab[last-visible-tab] {
  259.     margin-inline-end: 4px !important;
  260.   }
  261.  
  262.   /** Clipped tabs - Letters cleary *******************************************/
  263.   #tabbrowser-tabs[closebuttons=activetab] .tab-content:not([pinned]) {
  264.     padding-inline-start: 8px !important;
  265.   }
  266.  
  267.   #tabbrowser-tabs[closebuttons=activetab] .tabbrowser-tab:not([visuallyselected]) .tab-close-button {
  268.     visibility: collapse !important;
  269.   }
  270.  
  271.   #tabbrowser-tabs[closebuttons=activetab] .tab-label-container[textoverflow][labeldirection="ltr"]:not([pinned]),
  272.   #tabbrowser-tabs[closebuttons=activetab] .tab-label-container[textoverflow]:not([labeldirection]):-moz-locale-dir(ltr):not([pinned]) {
  273.     mask-image: linear-gradient(to right, black 70%, transparent) !important;
  274.   }
  275.  
  276.   #tabbrowser-tabs[closebuttons=activetab] .tab-label-container[textoverflow][labeldirection="rtl"]:not([pinned]),
  277.   #tabbrowser-tabs[closebuttons=activetab] .tab-label-container[textoverflow]:not([labeldirection]):-moz-locale-dir(rtl):not([pinned]) {
  278.     mask-image: linear-gradient(to left, black 70%, transparent) !important;
  279.   }
  280.  
  281.   /** Sound Tab - Hide Label **************************************************/
  282.   .tab-secondary-label:is([soundplaying], [muted], [activemedia-blocked], [pictureinpicture]){
  283.     display: none !important;
  284.   }
  285.  
  286.   /** Sound Tab - Show with Favicons ******************************************/
  287.   /* Makes the favicons always visible (also on hover) */
  288.   .tab-icon-image:not([pinned]){
  289.     opacity: 1 !important
  290.   }
  291.  
  292.   /* Makes the speaker icon to always appear if the tab is playing (not only on hover) */
  293.   .tab-icon-overlay:not([crashed]),
  294.   .tab-icon-overlay[pinned][crashed][selected] {
  295.     /* Position */
  296.     top: -3.5px !important;
  297.     inset-inline-end: -9px !important;
  298.     z-index: 1 !important;
  299.  
  300.     /* Shape */
  301.     padding: 1.5px !important;
  302.     border-radius: 10px !important;
  303.     width:  17px !important;
  304.     height: 17px !important;
  305.   }
  306.   .tab-icon-overlay:not([sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) {
  307.     /* Color */
  308.     color:  currentColor !important;
  309.     stroke: transparent !important;
  310.     background: transparent !important;
  311.     fill-opacity: 0.8 !important;
  312.     opacity: 1 !important;
  313.   }
  314.   .tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) {
  315.     margin-inline-end: 9.5px !important;
  316.   }
  317.  
  318.   /* None exist favicon */
  319.   .tabbrowser-tab:not([image]) .tab-icon-overlay:not([pinned], [sharing],[crashed]) {
  320.     top: 0 !important;
  321.     inset-inline-end: 0 !important;
  322.     margin-inline-end: 5.5px !important;
  323.     padding: 2px 0 !important;
  324.   }
  325.  
  326.   /* Busy - Show */
  327.   .tab-throbber[busy], .tab-icon-pending[busy] {
  328.     opacity: 1 !important;
  329.   }
  330.  
  331.   /* Busy - Overlay Position */
  332.   .tabbrowser-tab:not([pinned])[busy] .tab-icon-overlay:is([soundplaying], [muted], [activemedia-blocked]) {
  333.     transform: translateX(-.5px) translateY(-2.5px);
  334.   }
  335.   .tabbrowser-tab:not([image]) .tab-icon-overlay:not([pinned], [sharing],[crashed])[busy] {
  336.     top: -3.5px !important;
  337.     inset-inline-end: -9px !important;
  338.     margin-inline-end: 9.5px !important;
  339.     padding: 1.5px !important;
  340.   }
  341.  
  342.   /* Hover */
  343.   .tab-icon-overlay:not([crashed])[soundplaying]:hover,
  344.   .tab-icon-overlay:not([crashed])[muted]:hover,
  345.   .tab-icon-overlay:not([crashed])[activemedia-blocked]:hover {
  346.     color:  var(--toolbar-bgcolor, white) !important;
  347.     stroke: var(--lwt-tab-text, var(--toolbar-color)) !important;
  348.     background-color: var(--lwt-tab-text, var(--toolbar-color)) !important;
  349.     fill-opacity: 0.95 !important;
  350.   }
  351.  
  352.   #TabsToolbar[brighttext] .tab-icon-overlay:not([crashed])[soundplaying]:hover,
  353.   #TabsToolbar[brighttext] .tab-icon-overlay:not([crashed])[muted]:hover,
  354.   #TabsToolbar[brighttext] .tab-icon-overlay:not([crashed])[activemedia-blocked]:hover {
  355.     color: var(--toolbar-bgcolor, black) !important;
  356.   }
  357.  
  358.   .tabbrowser-tab:not([image]) .tab-icon-overlay:not([pinned], [sharing],[crashed]):hover {
  359.     padding: 0 !important;
  360.   }
  361.  
  362.   /** PictureInPicture Tab - Show PIP Icon ************************************/
  363.   .tab-icon-sound[pictureinpicture]:not([pinned]) {
  364.     /* Shape */
  365.     display: -moz-inline-box !important;
  366.     width:  14px;
  367.     height: 14px;
  368.     -moz-box-ordinal-group: 2 !important;
  369.  
  370.     /* Color */
  371.     fill: currentColor;
  372.     opacity: 0.8;
  373.     -moz-context-properties: fill;
  374.  
  375.     /* Icon */
  376.     list-style-image: url(chrome://global/skin/media/picture-in-picture-open.svg);
  377.   }
  378.   .tab-icon-sound[pictureinpicture]:not([pinned])[selected] {
  379.     opacity: 0.95;
  380.   }
  381.  
  382.   /* Close Button's position */
  383.   .tabbrowser-tab[pictureinpicture]:not([pinned]) .tab-close-button {
  384.     margin-left: 7px !important;
  385.     -moz-box-ordinal-group: 2 !important;
  386.   }
  387.   .tabbrowser-tab[pictureinpicture]:not([pinned]):hover .tab-close-button {
  388.     margin-left: 0px !important;
  389.   }
  390.  
  391.   /** Pinned Tab - Replace Favicon to Close Button at Selected ****************/
  392.   .tabbrowser-tab[pinned][visuallyselected]:not([busy]) .tab-close-button {
  393.     display: -moz-box !important;
  394.     -moz-box-ordinal-group: 0 !important;
  395.     transform: translateX(-1px);
  396.  
  397.     /* Looks like hover */
  398.     width: 24px !important;
  399.     height: 24px !important;
  400.     padding: 7px !important;
  401.   }
  402.   .tabbrowser-tab[pinned][visuallyselected] .tab-icon-image {
  403.     display: none !important;
  404.   }
  405.  
  406.   /* Left Padding - Assume the icon size is 17px */
  407.   .tabbrowser-tab[pinned][visuallyselected]:not([busy]) .tab-content {
  408.     padding-inline: 7.5px !important; /* Original: 10px */
  409.   }
  410.  
  411.   /* Right Padding - Assume the icon size is 17px */
  412.   .tabbrowser-tab[pinned][visuallyselected]:not([busy]) .tab-icon-stack {
  413.     width: 8.5px !important;
  414.   }
  415.   .tabbrowser-tab[pinned][visuallyselected]:not([busy]) .tab-content {
  416.     padding-inline-end: 0px !important;
  417.   }
  418.  
  419.   .tabbrowser-tab[pinned][visuallyselected][busy] .tab-content {
  420.     padding-inline-end: 9.5px !important;
  421.   }
  422.   .tabbrowser-tab[pinned][busy] .tab-content {
  423.     padding-inline: 10.5px !important;
  424.   }
  425.  
  426.   /* Sound Tab - Don't move overlay */
  427.   .tabbrowser-tab[pinned][busy] .tab-icon-overlay:is([soundplaying], [muted], [activemedia-blocked]) {
  428.     transform: translateX(.5px) translateY(-2px) !important;
  429.   }
  430.  
  431.   .tabbrowser-tab[pinned][visuallyselected]:not([busy]) .tab-icon-overlay {
  432.     transform: translateX(-9px) translateY(-2px) !important;
  433.     left: 0 !important;
  434.   }
  435.  
  436.   /** Container Tab - Color line at icon's bottom *****************************/
  437.   .tab-context-line {
  438.     display: none;
  439.   }
  440.  
  441.   .tab-icon-image {
  442.     box-sizing: content-box;
  443.     padding: 3px 0;
  444.  
  445.     border-bottom: 2px solid var(--identity-icon-color);
  446.   }
  447.  
  448.   /* None exist favicon & Pinned to select */
  449.   .tabbrowser-tab:not([image]):not([pinned], [sharing], [crashed]):not([soundplaying], [muted], [activemedia-blocked]) .tab-content::before,
  450.   .tabbrowser-tab[pinned][visuallyselected]:not([busy]):not(:hover) .tab-content::before {
  451.     /* Box Model */
  452.     content: '';
  453.     display: block;
  454.     position: absolute !important;
  455.     transition: 0.2s !important;
  456.     transform: translateY(10px) !important;
  457.  
  458.     /* Shape */
  459.     border-bottom: 2px solid var(--identity-icon-color);
  460.     width: 16px;
  461.   }
  462.   .tabbrowser-tab:not([image]):not([pinned], [sharing], [crashed]):not([soundplaying], [muted], [activemedia-blocked]) .tab-content::before {
  463.     transform: translateY(10px) !important; /* None exist favicon */
  464.   }
  465.   .tabbrowser-tab[pinned][visuallyselected]:not([busy]):not(:hover) .tab-content::before {
  466.     transform: translateX(2.5px) translateY(10px) !important; /* Pinned to select */
  467.   }
  468.  
  469.   /* None exist favicon - With Sound */
  470.   .tabbrowser-tab:not([image]) .tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) {
  471.     box-sizing: content-box;
  472.     padding: 3px 0;
  473.  
  474.     border-radius: 0 !important;
  475.     border-bottom: 2px solid var(--identity-icon-color);
  476.   }
  477.   .tabbrowser-tab:not([image]) .tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]):hover {
  478.     padding: 0;
  479.  
  480.     border-radius: 10px !important;
  481.     border-bottom: none;
  482.   }
  483.  
  484.   /* Pinned Tab - Titlechanged Indicator override */
  485.   .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected="true"]) .tab-icon-image,
  486.   .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) .tab-icon-image {
  487.     border-bottom: 2px solid transparent !important;
  488.   }
  489.  
  490.   .tabbrowser-tab:is([image], [pinned])[usercontextid] > .tab-stack > .tab-content[attention]:not([selected="true"]),
  491.   .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
  492.     /* Original: radial-gradient(circle, var(--attention-icon-color), var(--attention-icon-color) 2px, transparent 2px); */
  493.     --dotted-identity-image: radial-gradient(circle, var(--identity-icon-color), var(--identity-icon-color) 2px, transparent 2px);
  494.     background-image: var(--dotted-identity-image), var(--dotted-identity-image), var(--dotted-identity-image) !important;
  495.     background-position-x: 32%, 50%, 70% !important;
  496.   }
  497.   :root[uidensity=compact] .tabbrowser-tab:is([image], [pinned])[usercontextid] > .tab-stack > .tab-content[attention]:not([selected="true"]),
  498.   :root[uidensity=compact] .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
  499.     /* Original: radial-gradient(circle, var(--attention-icon-color), var(--attention-icon-color) 2px, transparent 2px); */
  500.     var(--dotted-identity-image) !important;
  501.     background-position-x: 30%, 50%, 70% !important;
  502.   }
  503.  
  504.   /* Pinned Tab - Titlechanged & soundplaying */
  505.   .tabbrowser-tab:is([image], [pinned])[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[attention]:not([selected="true"]),
  506.   .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
  507.     background-position-x: calc(32% - 1px), calc(50% - 1px), calc(70% - 1px) !important;
  508.   }
  509.   :root[uidensity=compact] .tabbrowser-tab:is([image], [pinned])[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[attention]:not([selected="true"]),
  510.   :root[uidensity=compact] .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
  511.     var(--dotted-identity-image) !important;
  512.     background-position-x: calc(30% - 1px), calc(50% - 1px), calc(70% - 1px) !important;
  513.   }
  514.  
  515.   /** Crashed Tab - Don't show Favicons ***************************************/
  516.   .tab-icon-image[crashed] {
  517.     display: none !important;
  518.   }
  519.  
  520.   /** URL Bar - Reduce Padding ************************************************/
  521.   :root:not([uidensity=touch]) #urlbar-container, #search-container {
  522.     padding-block: 2px; /* Original: 4px */
  523.     margin-inline: 5px; /* Original: 5px */
  524.   }
  525.  
  526.   /* spread menu */
  527.   :root[uidensity=compact] .urlbarView-row:not([type=tip], [type=dynamic]) {
  528.     padding-block: 1px; /* [Compact, General]: 2px, Touch: 11px */
  529.   }
  530.   :root[uidensity=compact] #urlbar .search-one-offs:not([hidden]) {
  531.     padding-block: 2px; /* [Compact, General]: 4px, Touch 11px */
  532.   }
  533.  
  534.   /** BookMark Bar - Reduce Height ********************************************/
  535.   :root[uidensity=compact] #PersonalToolbar toolbarbutton {
  536.       margin-top: 0px; /* Original: 2px */
  537.   }
  538.  
  539.   /** Menu - Reduce Padding ***************************************************/
  540.   :root:not([uidensity=touch]) menupopup > menuitem, menupopup > menu {
  541.     padding-block: 0.35em !important; /* Original: 0.5em */
  542.   }
  543.   :root:not([uidensity=touch]) .menu-text, .menu-iconic-text {
  544.     padding-inline-end: 0 !important; /* Original: 2px */
  545.   }
  546.   :root:not([uidensity=touch]) .menupopup-arrowscrollbox {
  547.     padding-block: 1px !important;    /* Original: 4px*/
  548.   }
  549.   :root:not([uidensity=touch]) #context-navigation:not([hidden]) {
  550.     padding: 0 !important;      /* Original: 0 0 4px*/
  551.   }
  552.   :root:not([uidensity=touch]) .menu-right {
  553.     margin-right: 6px !important;     /* Original: 12px */
  554.   }
  555.  
  556.   :root[uidensity=compact] menupopup > menuitem, menupopup > menu {
  557.     padding-block: 0.25em !important; /* Original: 0.5em */
  558.   }
  559.  
  560.   /** Panel - Icons ***********************************************************/
  561.   /* Padding */
  562.   :root {
  563.     --arrowpanel-menublank-padding: calc(var(--arrowpanel-menuicon-padding) * 2 + 8px) !important;
  564.     --arrowpanel-menuimageblank-padding: calc(var(--arrowpanel-menuitem-padding) - 2px) !important;
  565.   }
  566.  
  567.   #downloadsHistory .button-text,
  568.   .subviewbutton > .toolbarbutton-text {
  569.     padding-inline-start: var(--arrowpanel-menuicon-padding) !important;
  570.   }
  571.   #panelMenu_bookmarksMenu .subviewbutton[disabled=true] .toolbarbutton-text,
  572.   #appMenu_historyMenu     .subviewbutton[disabled=true] .toolbarbutton-text {
  573.     padding-inline-start: var(--arrowpanel-menublank-padding) !important;
  574.   }
  575.   #appMenu-proton-update-banner .toolbarbutton-text {
  576.     margin-inline-start: 0 !important;
  577.   }
  578.  
  579.   #appMenu-multiView .subviewbutton::before,
  580.   #appMenu-proton-update-banner::before {
  581.     display: -moz-inline-box;
  582.     margin-inline-end: var(--arrowpanel-menuicon-padding);
  583.     width:  16px !important;
  584.     height: 16px !important;
  585.   }
  586.   #appMenu-proton-update-banner {
  587.     margin-bottom: 2px !important;
  588.   }
  589.   #appMenu-proton-update-banner::before {
  590.     margin-inline-start: var(--arrowpanel-menuitem-padding) !important;
  591.   }
  592.   #appMenu-fxa-status2,
  593.   #appMenu-zoom-controls2 {
  594.     align-items: center;
  595.     padding-top:    var(--arrowpanel-menuimageblank-padding) !important;
  596.     padding-bottom: var(--arrowpanel-menuimageblank-padding) !important;
  597.   }
  598.   #appMenu-zoom-controls2::before {
  599.     margin-inline-end: 0 !important;
  600.   }
  601.  
  602.   /* Icons Color */
  603.   #appMenu-multiView .subviewbutton::before,
  604.   #appMenu-proton-update-banner::before,
  605.   #downloadsHistory .button-icon,
  606.   .subviewbutton > image {
  607.     fill: currentColor !important;
  608.     fill-opacity: var(--toolbarbutton-icon-fill-opacity) !important;
  609.     -moz-context-properties: fill !important;
  610.   }
  611.  
  612.   /* Panel - Main */
  613.   #appMenu-proton-addon-banners > .addon-banner-item > .toolbarbutton-icon {
  614.     display: -moz-inline-box !important;
  615.     margin-inline-start: var(--arrowpanel-menuicon-padding);
  616.     -moz-box-ordinal-group: 0 !important;
  617.   }
  618.  
  619.   #appMenu-proton-update-banner::before {
  620.     content: url(chrome://browser/skin/whatsnew.svg);
  621.   }
  622.   #appMenu-fxa-status2::before { /* Don't exist img tag */
  623.     content: url(chrome://browser/skin/fxa/avatar-empty.svg);
  624.   }
  625.   #appMenu-fxa-status2[fxastatus=signedin]::before { /* Don't exist img tag */
  626.     display: none;
  627.   }
  628.   #appMenu-fxa-status2[fxastatus=signedin] #appMenu-fxa-label2::before {
  629.     /* url("https://profile.accounts.firefox.com/v1/avatar/a") */
  630.     content: '';
  631.     border-radius: 50% !important;
  632.     background-size: 16px !important;
  633.     background-image: var(--avatar-image-url) !important;
  634.   }
  635.  
  636.   #appMenu-new-tab-button2 {
  637.     list-style-image: url(chrome://browser/skin/new-tab.svg);
  638.   }
  639.   #appMenu-new-window-button2 {
  640.     list-style-image: url(chrome://browser/skin/window.svg);
  641.   }
  642.   #appMenu-new-private-window-button2 {
  643.     list-style-image: url(chrome://browser/skin/privateBrowsing.svg);
  644.   }
  645.  
  646.   #appMenu-bookmarks-button{
  647.     list-style-image: url(chrome://browser/skin/bookmark.svg);
  648.   }
  649.   #appMenu-history-button {
  650.     list-style-image: url(chrome://browser/skin/history.svg);
  651.   }
  652.   #appMenu-downloads-button {
  653.     list-style-image: url(chrome://browser/skin/downloads/downloads.svg);
  654.   }
  655.   #appMenu-passwords-button {
  656.     list-style-image: url(chrome://browser/skin/login.svg);
  657.   }
  658.   #appMenu-extensions-themes-button {
  659.     list-style-image: url(chrome://mozapps/skin/extensions/extension.svg);
  660.   }
  661.  
  662.   #appMenu-print-button2 {
  663.     list-style-image: url(chrome://global/skin/icons/print.svg);
  664.   }
  665.   #appMenu-save-file-button2 {
  666.     list-style-image: url(chrome://browser/skin/save.svg);
  667.   }
  668.   #appMenu-find-button2 {
  669.     list-style-image: url(chrome://global/skin/icons/search-glass.svg);
  670.   }
  671.   #appMenu-zoom-controls2::before {
  672.     content: url(./icons/screenshot.svg);
  673.   }
  674.  
  675.   #appMenu-settings-button {
  676.     list-style-image: url(chrome://global/skin/icons/settings.svg);
  677.   }
  678.   #appMenu-more-button2 {
  679.     list-style-image: url(chrome://browser/skin/ion.svg);
  680.   }
  681.   #appMenu-help-button2 {
  682.     list-style-image: url(chrome://global/skin/icons/help.svg);
  683.   }
  684.  
  685.   #appMenu-quit-button2 {
  686.     list-style-image: url(chrome://browser/skin/quit.svg);
  687.   }
  688.  
  689.   /* Panel - Account */
  690.   #PanelUI-fxa-menu-connect-device-button  .toolbarbutton-icon,
  691.   #PanelUI-fxa-menu-account-signout-button .toolbarbutton-icon {
  692.     width:  16px !important;
  693.     height: 16px !important;
  694.   }
  695.  
  696.   /* Default */
  697.   #fxa-menu-avatar {
  698.     display: -moz-inline-box !important;
  699.     margin-inline-end: var(--arrowpanel-menuitem-padding);
  700.   }
  701.  
  702.   .syncNowBtn {
  703.     visibility: visible !important;
  704.     -moz-box-ordinal-group: 1 !important;
  705.     margin-inline-end: var(--arrowpanel-menuicon-padding);
  706.   }
  707.   #PanelUI-fxa-menu-setup-sync-button {
  708.     list-style-image: url(chrome://browser/skin/sync.svg);
  709.   }
  710.  
  711.   #PanelUI-fxa-menu-connect-device-button {
  712.     list-style-image: url(chrome://browser/skin/fxa/add-device.svg);
  713.   }
  714.   #PanelUI-fxa-menu-sendtab-button {
  715.     list-style-image: url(chrome://browser/skin/send-to-device.svg);
  716.   }
  717.   #PanelUI-fxa-menu-sync-prefs-button,
  718.   #PanelUI-remotetabs-view-managedevices {
  719.     list-style-image: url(chrome://global/skin/icons/settings.svg);
  720.   }
  721.   #PanelUI-fxa-menu-account-signout-button {
  722.     list-style-image: url(chrome://browser/skin/sign-out.svg);
  723.   }
  724.  
  725.   .PanelUI-remotetabs-notabsforclient-label {
  726.     margin-inline-start: calc(var(--arrowpanel-menuicon-padding) + var(--arrowpanel-menuitem-padding)) !important;
  727.     padding-inline-start: var(--arrowpanel-menublank-padding) !important;
  728.   }
  729.  
  730.   /* Change Separator */
  731.   #PanelUI-fxa-menu::before{
  732.     content: "";
  733.     display: -moz-box;
  734.     border-bottom: 1px solid var(--panel-separator-color);
  735.     margin: var(--panel-separator-margin);
  736.     padding: 0;
  737.   }
  738.   #PanelUI-fxa-menu > :first-child{
  739.     -moz-box-ordinal-group: 0;
  740.   }
  741.   #PanelUI-sign-out-separator {
  742.     display: none;
  743.   }
  744.   .pageAction-sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target[clientType=""] {
  745.     list-style-image: url(chrome://browser/skin/send-to-device.svg);
  746.   }
  747.   .pageAction-sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target:not([clientType]) {
  748.     list-style-image: url(chrome://global/skin/icons/settings.svg);
  749.   }
  750.  
  751.   /* Panel - Bookmark */
  752.   #panelMenuBookmarkThisPage {
  753.     list-style-image: url(chrome://browser/skin/bookmark-hollow.svg);
  754.   }
  755.   panelMenuBookmarkThisPage[starred] {
  756.     list-style-image: url(chrome://browser/skin/bookmark.svg);
  757.   }
  758.  
  759.   #panelMenu_searchBookmarks {
  760.     list-style-image: url(chrome://global/skin/icons/search-glass.svg);
  761.   }
  762.   #panelMenu_viewBookmarksToolbar {
  763.     list-style-image: url(chrome://browser/skin/bookmarks-toolbar.svg);
  764.   }
  765.  
  766.   #panelMenu_showAllBookmarks {
  767.     list-style-image: url(chrome://browser/skin/bookmark-star-on-tray.svg);
  768.   }
  769.  
  770.   /* Panel - History */
  771.   #appMenuRecentlyClosedTabs {
  772.     list-style-image: url(chrome://browser/skin/tab.svg);
  773.   }
  774.   #appMenuRecentlyClosedWindows {
  775.     list-style-image: url(chrome://browser/skin/window.svg);
  776.   }
  777.   #appMenuRestoreSession {
  778.     list-style-image: url(chrome://browser/skin/restore-session.svg);
  779.   }
  780.   #appMenuClearRecentHistory {
  781.     list-style-image: url(chrome://browser/skin/forget.svg);
  782.   }
  783.  
  784.   #PanelUI-historyMore {
  785.     list-style-image: url(chrome://browser/skin/history.svg);
  786.   }
  787.  
  788.   #appMenu-library-recentlyClosedTabs {
  789.     list-style-image: url(./icons/movetowindow-16.svg);
  790.   }
  791.   #appMenu-library-recentlyClosedWindows {
  792.     list-style-image: url(chrome://browser/skin/restore-session.svg);
  793.   }
  794.  
  795.   /* Panel - More tools */
  796.   #appmenu-moreTools-button {
  797.     list-style-image: url(chrome://browser/skin/customize.svg);
  798.   }
  799.  
  800.   #appmenu-developer-tools-view  .subviewbutton:nth-child(1) {  /* Web Developer Tools */
  801.     list-style-image: url(chrome://browser/skin/developer.svg);
  802.   }
  803.   #appmenu-developer-tools-view  .subviewbutton:nth-child(2) {  /* Task Manager */
  804.     list-style-image: url(./icons/performance.svg);
  805.   }
  806.   #appmenu-developer-tools-view  .subviewbutton:nth-child(3) {  /* Remote Debugging - Edge bug.svg */
  807.     list-style-image: url(./icons/bug.svg);
  808.   }
  809.   #appmenu-developer-tools-view  .subviewbutton:nth-child(4) {  /* Browser Toolbox - Edge webdeveloper.svg */
  810.     list-style-image: url(./icons/webdeveloper.svg);
  811.   }
  812.   #appmenu-developer-tools-view  .subviewbutton:nth-child(5) {  /* Browser Content Toolbaox -  */
  813.     list-style-image: url(./icons/command-frames.svg);
  814.   }
  815.   #appmenu-developer-tools-view  .subviewbutton:nth-child(6) {  /* Browser Console */
  816.     list-style-image: url(chrome://devtools/skin/images/command-console.svg);
  817.   }
  818.   #appmenu-developer-tools-view  .subviewbutton:nth-child(7) {  /* Responsive Design Mode */
  819.     list-style-image: url(./icons/command-responsivemode.svg);
  820.   }
  821.   #appmenu-developer-tools-view  .subviewbutton:nth-child(8) {  /* Eyedropper */
  822.     list-style-image: url(chrome://devtools/skin/images/command-eyedropper.svg);
  823.   }
  824.   #appmenu-developer-tools-view  .subviewbutton:nth-child(9) {  /* Page Source - Edge file-search.svg */
  825.     list-style-image: url(./icons/search-file.svg);
  826.   }
  827.   #appmenu-developer-tools-view  .subviewbutton:nth-child(10) { /* Extensions for Devel */
  828.     list-style-image: url(chrome://devtools/skin/images/debugging-addons.svg);
  829.   }
  830.   #appmenu-developer-tools-view .subviewbutton:last-child {
  831.     margin-bottom: 6px !important;
  832.   }
  833.  
  834.   /* Panel - Help */
  835.   #appMenu_menu_openHelp {
  836.     list-style-image: url(chrome://global/skin/icons/help.svg);
  837.   }
  838.   #appMenu_feedbackPage {
  839.     list-style-image: url(./icons/send.svg);
  840.   }
  841.   #appMenu_helpSafeMode {
  842.     list-style-image: url(chrome://devtools/skin/images/debugging-workers.svg);
  843.   }
  844.   #appMenu_troubleShooting {
  845.     list-style-image: url(chrome://global/skin/icons/more.svg);
  846.   }
  847.   #appMenu_help_reportSiteIssue {
  848.     list-style-image: url(chrome://global/skin/icons/lightbulb.svg);
  849.   }
  850.   #appMenu_menu_HelpPopup_reportPhishingtoolmenu {
  851.     list-style-image: url(chrome://global/skin/icons/warning.svg);
  852.   }
  853.   #appMenu_aboutName{
  854.     list-style-image: url(chrome://global/skin/icons/info.svg);
  855.   }
  856.  
  857.   /* Panel - Library */
  858.   #appMenu-library-bookmarks-button {
  859.     list-style-image: url(chrome://browser/skin/bookmark.svg);
  860.   }
  861.   #appMenu-library-history-button {
  862.     list-style-image: url(chrome://browser/skin/history.svg);
  863.   }
  864.   #appMenu-library-downloads-button{
  865.     list-style-image: url(chrome://browser/skin/downloads/downloads.svg);
  866.   }
  867.  
  868.   /* Panel - Downloads */
  869.   #downloadsHistory {
  870.     list-style-image: url(chrome://browser/skin/downloads/downloads.svg);
  871.   }
  872.  
  873.   /* Toolbar - Overflow Menu */
  874.   #overflowMenu-customize-button {
  875.     list-style-image: url(chrome://browser/skin/customize.svg);
  876.   }
  877.  
  878.   /* All Tab Menu */
  879.   #allTabsMenu-undoCloseTab {
  880.     list-style-image: url(chrome://global/skin/icons/undo.svg);
  881.   }
  882.   #allTabsMenu-searchTabs {
  883.     list-style-image: url(chrome://global/skin/icons/search-glass.svg);
  884.   }
  885.   #allTabsMenu-containerTabsButton {
  886.     list-style-image: url(./icons/container-openin-16.svg);
  887.   }
  888.  
  889.   #allTabsMenu-hiddenTabsButton {
  890.     list-style-image: url(./icons/password-hide.svg);
  891.   }
  892.  
  893.   #allTabsMenu-containerTabsView .subviewbutton:last-child {
  894.     list-style-image: url(chrome://global/skin/icons/settings.svg);
  895.   }
  896. }
  897.  
  898. /* custom crul */
  899. :root {
  900.     --chrome-content-separator-color: black !important;
  901. }
  902. :root:-moz-window-inactive {
  903.     --chrome-content-separator-color: #999 !important;
  904. }
  905.  
  906. #TabsToolbar {
  907.   border-bottom: solid 1px #555;
  908.   background: black;
  909. }
  910. #TabsToolbar:-moz-window-inactive {
  911.   background: #999;
  912. }
  913.  
  914. @media (-moz-proton) {
  915.  
  916.   /* Tabs: inactive */
  917.   .titlebar-buttonbox toolbarbutton {
  918.     color: #ccc;
  919.   }
  920.   .titlebar-buttonbox toolbarbutton:hover {
  921.     color: #fff;
  922.   }
  923.   .tab-background {
  924.     border-top: solid 1px #555 !important;
  925.     background-color: #000 !important;
  926.     /*background: linear-gradient(180deg, #222 50%, #444 100%);*/
  927.     margin: 0px 3px 0px 0px !important;
  928.     border-radius: 0 !important;
  929.   }
  930.   .tab-content .tab-throbber,
  931.   .tab-content .tab-label-container .tab-label {
  932.     color: #999;
  933.   }
  934.   .tab-icon-image,
  935.   .tab-icon-image:not([pinned]),
  936.   .tab-icon-overlay {
  937.     opacity: 0.66 !important;
  938.     fill: white !important;
  939.   }
  940.   .tabbrowser-tab:hover .tab-background {
  941.     border-top: solid 1px #999 !important;
  942.   }
  943.   .tabbrowser-tab:hover .tab-label-container .tab-label,
  944.   .box-inherittabbrowser-tab:hover .tab-label-container .tab-label {
  945.     color: #ddd;
  946.     opacity: 1;
  947.   }
  948.   .tabbrowser-tab:hover .tab-icon-image {
  949.     opacity: 0.9 !important;
  950.   }
  951.  
  952.   /* Tabs: active / selected */
  953.   .tab-background[multiselected="true"],
  954.   .tab-background[selected="true"],
  955.   .tabbrowser-tab:hover .tab-background[multiselected="true"],
  956.   .tabbrowser-tab:hover .tab-background[selected="true"] {
  957.     background-color: #000 !important;
  958.     border-top: solid 2px #0060DF !important;
  959.   }
  960.   .tab-content[multiselected="true"] .tab-throbber,
  961.   .tab-content[selected="true"] .tab-throbber,
  962.   .tab-content[multiselected="true"] .tab-label-container .tab-label,
  963.   .tab-content[selected="true"] .tab-label-container .tab-label {
  964.     color: #fff;
  965.     opacity: 1;
  966.   }
  967.   .tab-content[multiselected="true"] image,
  968.   .tab-content[selected="true"] image {
  969.     fill: white !important;
  970.   }
  971.   .tab-content[multiselected="true"] .tab-icon-image,
  972.   .tab-content[selected="true"] .tab-icon-image {
  973.     opacity: 1 !important;
  974.   }
  975.  
  976.   /* Pinned tabs */
  977.   .tabbrowser-tab[pinned] .tab-background{
  978.     padding-left: 6px !important;
  979.     margin: 0px !important;
  980.   }
  981.   .tabbrowser-tab[pinned][visuallyselected]:not([busy]) .tab-content{
  982.     padding-left: 6px !important;
  983.   }
  984.   .tabbrowser-tab[pinned][visuallyselected]:not([busy]) .tab-close-button {
  985.     display: none !important;
  986.   }
  987.   .tabbrowser-tab[pinned][visuallyselected]:not([busy]) .tab-icon-stack {
  988.     width: 22px !important;
  989.   }
  990.   .tabbrowser-tab[pinned][visuallyselected] .tab-icon-image {
  991.     display: block !important;
  992.   }
  993.  
  994.   /* Tabs: non focused window */
  995.   #TabsToolbar:-moz-window-inactive .tab-background {
  996.     background: #999 !important;
  997.   }
  998.   .tab-content:-moz-window-inactive image,
  999.   .tab-content:-moz-window-inactive image {
  1000.     fill: #666 !important;
  1001.   }
  1002.   .tab-content:-moz-window-inactive .tab-label-container .tab-label,
  1003.   .tab-content:-moz-window-inactive .tab-label-container .tab-label {
  1004.     color: #333;
  1005.   }
  1006.   #TabsToolbar:-moz-window-inactive .tab-background[multiselected="true"],
  1007.   #TabsToolbar:-moz-window-inactive .tab-background[selected="true"] {
  1008.     background-color: #ccc !important;
  1009.   }
  1010.   .tab-content[multiselected="true"] .tab-label-container .tab-label:-moz-window-inactive ,
  1011.   .tab-content[selected="true"] .tab-label-container .tab-label:-moz-window-inactive  {
  1012.     color: #000;
  1013.   }
  1014.   .tab-content[multiselected="true"]:-moz-window-inactive image,
  1015.   .tab-content[selected="true"]:-moz-window-inactive image {
  1016.     fill: black !important;
  1017.   }
  1018.  
  1019.   /* Hide navbar when not hover */
  1020.   #nav-bar:not([customizing]){
  1021.     z-index: 1;
  1022.     margin-top: -66px;
  1023.     margin-bottom: 30px;
  1024.     transition-delay: 0.2s;
  1025.     border-bottom: solid 1px #999;
  1026.     opacity: 0;
  1027.   }
  1028.   :root:not([customizing]) :hover > #nav-bar,
  1029.   #nav-bar:hover,
  1030.   #nav-bar:focus-within,
  1031.   #identity-box[open="true"],
  1032.   #navigator-toolbox:hover > #nav-bar:not([customizing]),
  1033.   #toolbar-menubar:not([inactive="true"]) ~ #nav-bar:not([customizing]) {
  1034.     margin-top: 0px;
  1035.     margin-bottom: -36px;
  1036.     transition-delay: 0s;
  1037.     opacity: 1;
  1038.   }
  1039.   #nav-bar .toolbarbutton-1[open="true"]{
  1040.     visibility: visible;
  1041.     opacity: 100;
  1042.   }
  1043.  
  1044.   /* close button on inactive tabs */
  1045.   .tabbrowser-tab > .tab-stack > .tab-content > .tab-close-button:hover {
  1046.     fill: white !important;
  1047.   }
  1048.  
  1049.   /* RSSHub radar badge */
  1050.   #i_diygod_me-browser-action .toolbarbutton-badge {
  1051.     min-height: 13px;
  1052.   }
  1053.    
  1054.   /* Context menu (right click) padding */
  1055.   :root[uidensity=compact] menupopup > menuitem, menupopup > menu {
  1056.     padding-block: 0.1em !important; /* Original: 0.5em */
  1057.   }
  1058. }
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!