Untitled
raw download clone
CSS
views 13
,
size 9147 b
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/toolbarbuttons_icon+label.css made available under Mozilla Public License v. 2.0See the above repository for updates as well as full license text. */ /* Shows both icon and label for toolbarbuttons */
toolbar .toolbarbutton-1[label] {
    -moz-box-orient: vertical;
}
toolbar .toolbarbutton-1[label]:not([disabled]):hover {
    background-color: var(--toolbarbutton-hover-background) !important;
}
toolbar .toolbarbutton-1[label] > .toolbarbutton-icon,
toolbar .toolbarbutton-1[label] > .toolbarbutton-badge-stack {
    padding: var(--toolbarbutton-inner-padding) !important;
    padding-bottom: 0px !important;
    height: calc(var(--toolbarbutton-inner-padding) + 16px) !important;
    border: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
}
toolbar .toolbarbutton-1[label] > .toolbarbutton-text {
    display: -moz-box !important;
    min-height: 16px !important;
    padding-top: 0px !important;
    background-color: transparent !important; /*max-width: 70px;*/ /* Set maximium button width here if wanted */
}
:root:not([uidensity="compact"]) toolbar .toolbarbutton-1[label] > .toolbarbutton-text {
    padding: 2px !important;
}
#back-button {
    padding: 0px var(--toolbarbutton-outer-padding) !important;
    border-radius: 0px !important;
}
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0See the above repository for updates as well as full license text. */ /* Modify to change window drag space width */ /*Use tabs_on_bottom_menubar_on_top_patch.css if youhave menubar permanently enabled and want it on top*/ /* IMPORTANT */ /*Get window_control_placeholder_support.cssWindow controls will be all wrong without it.Additionally on Linux, you may need to get:linux_gtk_window_control_patch.css*/
:root {
    --uc-titlebar-padding: 0px;
}
@media (-moz-os-version: windows-win10) {
    :root[sizemode="maximized"][tabsintitlebar] {
        --uc-titlebar-padding: 8px;
    }
}
#toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container,
#TabsToolbar > .titlebar-buttonbox-container {
    position: fixed;
    display: block;
    top: var(--uc-titlebar-padding, 0px);
    right: 0;
    height: 40px;
}
/* Mac specific. You should set that font-smoothing pref to true if you are on any platform where window controls are on left */
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
    :root {
        --uc-titlebar-padding: 0px !important;
    }
    .titlebar-buttonbox-container {
        left: 0;
        right: unset !important;
    }
}
:root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container {
    height: 32px;
}
#toolbar-menubar[inactive] > .titlebar-buttonbox-container {
    opacity: 0;
}
#navigator-toolbox {
    padding-top: var(--uc-titlebar-padding, 0px) !important;
}
.titlebar-buttonbox-container > .titlebar-buttonbox {
    height: 100%;
}
#titlebar {
    -moz-box-ordinal-group: 2;
    -moz-appearance: none !important;
    --tabs-navbar-shadow-size: 0px;
}
.titlebar-placeholder,
#TabsToolbar .titlebar-spacer {
    display: none;
}
/* Also hide the toolbox bottom border which isn't at bottom with this setup */
#navigator-toolbox::after {
    display: none !important;
}
@media (-moz-gtk-csd-close-button) {
    .titlebar-button {
        -moz-box-orient: vertical;
    }
}
/* These exist only for compatibility with autohide-tabstoolbar.css */
toolbox#navigator-toolbox > toolbar#nav-bar.browser-toolbar {
    animation: none;
}
#navigator-toolbox:hover #TabsToolbar {
    animation: slidein ease-out 48ms 1;
}
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom_menubar_on_top_patch.css made available under Mozilla Public License v. 2.0See the above repository for updates as well as full license text. */ /* Menubar on top patch - use with tabs_on_bottom.css */ /* Only really useful if menubar is ALWAYS visible */
:root {
    --uc-window-control-width: 0px !important;
}
#navigator-toolbox {
    padding-top: calc(29px + var(--uc-titlebar-padding, 0px)) !important;
}
#toolbar-menubar {
    position: fixed;
    display: flex;
    top: var(--uc-titlebar-padding, 0px);
    height: 29px;
    width: 100%;
    overflow: hidden;
}
#toolbar-menubar > .titlebar-buttonbox-container {
    height: 29px;
    order: 100;
}
#toolbar-menubar > [flex] {
    flex-grow: 100;
}
#toolbar-menubar > spacer[flex] {
    order: 99;
    flex-grow: 1;
    min-width: var(--uc-window-drag-space-width, 20px);
}
#toolbar-menubar .titlebar-button {
    padding: 2px 17px !important;
}
#toolbar-menubar .toolbarbutton-1 {
    --toolbarbutton-inner-padding: 3px;
}
/* TABS: height */
*|*:root {
    --tab-toolbar-navbar-overlap: 0px !important;
    --tab-min-height: 25px !important;
    --tab-min-width: 80px !important;
}
#tabbrowser-tabs {
    width: 100vw !important;
}
#main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {
    padding-bottom: var(--tab-min-height) !important;
}
.tab-background {
    border-radius: 8px 8px 0px 0px !important;
    border-image: none !important;
}
.tab-line {
    display: none;
}
.tab-close-button {
    color: red !important;
}
/* tab throbber */
/* variables (used by the rest of the rules) */
:root {
    /* colors */
    --loading-throbber-fill: hsl(22, 100%, 71%);
    --busy-throbber-fill: hsl(22, 90%, 85%);

    /* icon. the dur="0.75s" part can be increased or decreased to change the animation speed.
    for example changing it to dur="1s" would make it slower: 1 second per cycle rather than 3/4 of a second.
    conversely, changing it to dur="0.5s" would speed it up. */
    --tab-throbber-icon: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="context-fill" fill-opacity="context-fill-opacity" viewBox="0 0 16 16"><path d="M7 3V1s0-1 1-1 1 1 1 1v2s0 1-1 1-1-1-1-1z"/><path d="M4.63 4.1l-1-1.73S3.13 1.5 4 1c.87-.5 1.37.37 1.37.37l1 1.73s.5.87-.37 1.37c-.87.57-1.37-.37-1.37-.37z" opacity=".93"/><path d="M3.1 6.37l-1.73-1S.5 4.87 1 4c.5-.87 1.37-.37 1.37-.37l1.73 1s.87.5.37 1.37c-.5.87-1.37.37-1.37.37z" opacity=".86"/><path d="M3 9H1S0 9 0 8s1-1 1-1h2s1 0 1 1-1 1-1 1z" opacity=".79"/><path d="M4.1 11.37l-1.73 1S1.5 12.87 1 12c-.5-.87.37-1.37.37-1.37l1.73-1s.87-.5 1.37.37c.5.87-.37 1.37-.37 1.37z" opacity=".72"/><path d="M3.63 13.56l1-1.73s.5-.87 1.37-.37c.87.5.37 1.37.37 1.37l-1 1.73s-.5.87-1.37.37c-.87-.5-.37-1.37-.37-1.37z" opacity=".65"/><path d="M7 15v-2s0-1 1-1 1 1 1 1v2s0 1-1 1-1-1-1-1z" opacity=".58"/><path d="M10.63 14.56l-1-1.73s-.5-.87.37-1.37c.87-.5 1.37.37 1.37.37l1 1.73s.5.87-.37 1.37c-.87.5-1.37-.37-1.37-.37z" opacity=".51"/><path d="M13.56 12.37l-1.73-1s-.87-.5-.37-1.37c.5-.87 1.37-.37 1.37-.37l1.73 1s.87.5.37 1.37c-.5.87-1.37.37-1.37.37z" opacity=".44"/><path d="M15 9h-2s-1 0-1-1 1-1 1-1h2s1 0 1 1-1 1-1 1z" opacity=".37"/><path d="M14.56 5.37l-1.73 1s-.87.5-1.37-.37c-.5-.87.37-1.37.37-1.37l1.73-1s.87-.5 1.37.37c.5.87-.37 1.37-.37 1.37z" opacity=".3"/><path d="M9.64 3.1l.98-1.66s.5-.874 1.37-.37c.87.5.37 1.37.37 1.37l-1 1.73s-.5.87-1.37.37c-.87-.5-.37-1.37-.37-1.37z" opacity=".23"/><animateTransform attributeName="transform" attributeType="xml" calcMode="discrete" dur="0.75s" repeatCount="indefinite" type="rotate" values="0 0 0; 30 0 0; 60 0 0; 90 0 0; 120 0 0; 150 0 0; 180 0 0; 210 0 0; 240 0 0; 270 0 0; 300 0 0; 330 0 0"/></svg>');
}
/* throbber in the regular horizontal tab bar */
.tab-throbber[busy]::before {
    opacity: 0.8 !important;
    /* this fill value is from the --busy-throbber-fill line in the :root rule above^ */
    fill: var(--busy-throbber-fill) !important;
}
.tab-throbber[progress]::before {
    opacity: 1 !important;
    /* likewise, for --loading-throbber-fill */
    fill: var(--loading-throbber-fill) !important;
}
.tab-throbber::before {
    content: "" !important;
    /* this background-image value is from the --tab-throbber-icon variable in the :root rule above.
    the entire icon is encoded in that variable's value. so using this variable loads the icon from there. */
    background-image: var(--tab-throbber-icon) !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    -moz-context-properties: fill, fill-opacity !important;
    width: 16px !important;
    height: 16px !important;
    animation: none !important;
    display: -moz-box !important;
}
/* throbber in the "all tabs" menu (the V-shaped button next to the new tab button) */
.tab-throbber-tabslist[busy] {
    list-style-image: var(--tab-throbber-icon) !important;
    opacity: 0.8 !important;
    fill: var(--busy-throbber-fill) !important;
}
.tab-throbber-tabslist[progress] {
    list-style-image: var(--tab-throbber-icon) !important;
    opacity: 1 !important;
    fill: var(--loading-throbber-fill) !important;
}
close fullscreen
Login or Register to edit or fork this paste. It's free.