diff options
Diffstat (limited to 'firefox-userchrome')
| -rw-r--r-- | firefox-userchrome/userChrome.css | 648 |
1 files changed, 0 insertions, 648 deletions
diff --git a/firefox-userchrome/userChrome.css b/firefox-userchrome/userChrome.css deleted file mode 100644 index 97615d8..0000000 --- a/firefox-userchrome/userChrome.css +++ /dev/null @@ -1,648 +0,0 @@ -/* - * GaugeK's userChrome.css - * github.com/GaugeK/dots - */ - -:root { - /* ---- */ - --bg0: #1c1b1d; - --bg1: #1c1b1d; - --bg2: #9e736a; - --bg3: #1c1b1d; - --bg4: #f0d3c9; - --button: #bbbbbf1a; - /* ---- */ - --fg2: #f0d3c9; - --fg1: #f0d3c9; - --disabled: #696969; - /* ---- */ - --accent: #43eeff; - --accent2: #d286ff; - --contrast: #000000; - --red: #ff5061; - /* ---- */ -} - -:root { - --font : Iosevka Fixed Curly Slab Light; - --font-size : 11px; - --font-weight : regular; - --icon-size : 13px !important; - --button-size : 12px !important; - --tab-min-height : 34px !important; - --toolbar-bgimage : none !important; - --arrowpanel-dimmed : transparent !important; -} - -/* Floating Tabs/Navbar */ -#navigator-toolbox { - padding: 0px; - margin-bottom: 0px; - padding-bottom: 0px; -} - -/*** Hide some stuff ***/ -/* Hide tab line */ -.tab-line { display: none !important; } - -/* Remove gap left by tab-line if hidden */ -.tabbrowser-tab { margin-top: -1px !important; } - -/* Hide tab seperator line */ -.tabbrowser-tab::after, .tabbrowser-tab::before { border-left: none !important; } - -/* Hide tab title update indicator (Glowing blue circle under tab icon) */ -.tab-content { background-image: none !important; } - -.urlbar-go-button, -/*#back-button, -#forward-button,*/ -#stop-button, -#reload-button, -#tracking-protection-icon-container, -.urlbar-history-dropmarker, -#pageActionButton, -#pocket-button-box, -#permissions-granted-icon, -#identity-box > *:not(#identity-icon), -#pageActionSeparator, #pocket-button { - display: none !important; -} - -#navigator-toolbox #nav-bar * #star-button, -#identity-icon { - display: block !important; - width: 10px !important; - list-style-image: none !important; -} - -#identity-icon, -#identity-box { - padding: 0px !important; -} - -/* Remove 2px border from the bottom of the titlebar */ -#navigator-toolbox { border: none !important; } - -/* Remove small border from above the navbar*/ -#nav-bar { box-shadow: none !important; } - -#urlbar { border: none !important; } - -#urlbar:not(:focus-within) { box-shadow: none !important; } - - - - -/* Make tab close buttons appear on tab hover, replacing the tab icon */ -.tabbrowser-tab .tab-close-button { - -moz-box-ordinal-group: 0 !important; - margin: 2px 6px 0px 0px !important; -} - -.tabbrowser-tab:not([pinned="true"]):hover .tab-icon-image, -.tabbrowser-tab:not([pinned="true"]):hover .tab-throbber { - display: none; -} - -.tabbrowser-tab .tab-close-button { display: none !important; } -.tabbrowser-tab:not([pinned="true"]):hover .tab-close-button { - display: -moz-box !important; -} -.tabbrowser-tab:not([pinned="true"]):hover .tab-text { - padding-right: calc( var(--icon-size) + 6px) !important; -} - - -/* small shadow on tabs */ -.tabbrowser-tab[selected="true"] { - box-shadow: 0px 8px 9px -1px rgba(0,0,0,0.45); -} - -#titlebar { - box-shadow: inset 0 -8px 13px -8px rgba(0,0,0,0.25); -} - -/* rounded tabs */ -#navigator-toolbox .tab-background { - border-radius: 0px 0px 0 0 !important; -} - -/* https://github.com/muckSponge/MaterialFox */ -.tab-background::before, -.tab-background::after { - content: "" !important; - display: block !important; - position: absolute !important; - width: 8px !important; - height: 8px !important; - bottom: 0 !important; - pointer-events: none !important; - transition: box-shadow 0s var(--tab-transition-duration) var(--ease-basic) !important; -} - -.tab-background[selected]::before { - border-bottom-right-radius: 0px !important; - left: 0 !important; - transform: translateX(-8px) !important; - box-shadow: 2px 2px 0 2px var(--bg1) !important; -} - -.tab-background[selected]::after { - border-bottom-left-radius: 0px !important; - right: 0 !important; - transform: translateX(8px) !important; - box-shadow: -2px 2px 0 2px var(--bg1) !important; -} - - -/*** Tabs-only OneLiner ***/ -/** Navbar is above tabs, hidden until focus **/ -/*#nav-bar:not([customizing]) { - -moz-box-ordinal-group: 0 !important; - margin-bottom: 10px; - margin-top: calc(var(--tab-min-height) * -1 - 10px) !important; - transition: all 200ms !important; -} - -#navigator-toolbox:not([customizing]):focus-within #nav-bar { - margin-top: 0 !important; -} - -/** Navbar is on the same line as tabs **/ -#nav-bar:not([customizing]) { - margin-top: calc(var(--tab-min-height) * -1 - 16px) !important; - z-index: 2 !important; - pointer-events: none; - transition: all 200ms, z-index 0ms !important; - padding-top:0 !important; - margin-bottom:16px !important; - opacity: 0; -} - -#navigator-toolbox:not([customizing]):focus-within #nav-bar { - pointer-events: auto; - margin-top: calc(var(--tab-min-height) * -1) !important; - margin-bottom: 0px !important; - opacity: 1 !important; - max-height: 32px; -} - -/* Navbar is above tabs */ -/*#nav-bar:not([customizing]) { - -moz-box-ordinal-group: 0 !important; - margin-bottom: 4px !important; -}*/ - -#urlbar[breakout] { - position: unset !important; -} -#urlbar[breakout][breakout-extend] { - top: 0; - left: 0; - width: 100%; -} - - - -/* Fix some moving tab problems with the tabs-only oneliner */ - -#TabsToolbar[movingtab] > .tabbrowser-tabs { - padding-bottom: 0px !important; - margin-bottom: 0px !important; -} - -#navigator-toolbox[movingtab], -#tabbrowser-tabs[movingtab] { - margin: 0 !important; -} - -#TabsToolbar[movingtab] { padding-bottom: 0px !important; } -#tabbrowser-tabs[movingtab] { margin-bottom: -2px !important; } - - -.tabbrowser-tab { margin-right: 0 !important; } - - - -/* Hide newtab button in right padding */ -#tabs-newtab-button > image { display: none !important; } -#tabbrowser-tabs { margin-right: -15px !important; } - -#tabs-newtab-button { - display: block !important; - position: absolute !important; - margin-right: 0px !important; - right: 0px !important; - width: 10px !important; - max-width: 15px !important; -} - - - - - - - - -/* Tabs are de-saturated and transparent when inactive */ -/*.tabbrowser-tab:not([selected=true]):not(:hover) * .tab-icon-image { - filter: grayscale(50%) !important; -}*/ -.tabbrowser-tab:not([selected])[pinned] { opacity: 0.60 !important; } -/*.tabbrowser-tab:hover { opacity: 1 !important; } -.tabbrowser-tab[selected] { opacity: 1 !important; }*/ - - -/* Hide tab icon from non-pinned tabs */ -.tab-icon-image:not([pinned]) { display: none; } - -/* Desaturate tab icon on non-selected tabs */ -.tab-icon-image:not([selected]) { - filter: grayscale(100%) brightness(80%) !important; -} - -/* Round Tabs */ -.tabbrowser-tab .tab-background { - border-radius: 0px !important; -} - - - - -/* Desaturate and italic pending tabs */ -.tabbrowser-tab[pending] { - font-style: italic; - filter: grayscale(100%) !important; -} - - - - - - - -/* Run javascript files */ -toolbarbutton#alltabs-button { - -moz-binding: url("userChrome.xml#js"); -} - - - - - -/*** - * Custom icons - * Enable `svg.context-properties.content.enabled` in about:config - ***/ -.toolbarbutton-animatable-image { - animation-duration: 0ms !important; -} - -#home-button .toolbarbutton-icon, -#back-button .toolbarbutton-icon, -#reload-button .toolbarbutton-icon, -#forward-button .toolbarbutton-icon { - -moz-context-properties: fill, stroke; - fill: currentColor !important; - stroke: currentColor !important; -} - - -#reload-button .toolbarbutton-icon { - list-style-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 8.467 8.467'%3E%3Cpath fill='none' stroke='context-fill' stroke-dashoffset='100' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.058' d='M6.269 6.12a2.852 2.852 0 0 1-3.28.677A2.852 2.852 0 0 1 1.326 3.89a2.852 2.852 0 0 1 2.247-2.483 2.852 2.852 0 0 1 3.059 1.365'/%3E%3Ccircle cx='6.543' cy='2.385' r='1.323' fill='context-fill' fill-rule='evenodd'/%3E%3C/svg%3E");; -} - -#home-button .toolbarbutton-icon { - list-style-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 8.467 8.467'%3E%3Cg fill='none' stroke='context-fill' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.058'%3E%3Cpath d='M1.884 3.73v2.557c0 .595.336.888.882.888l3.013-.02c.578 0 .792-.394.792-.871l.012-2.553'/%3E%3Cpath d='M1.227 4.298l3.006-3.006L7.24 4.298'/%3E%3C/g%3E%3C/svg%3E"); -} - -#back-button .toolbarbutton-icon { - list-style-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 8.467 8.467'%3E%3Cpath fill='none' stroke='context-fill' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.058' d='M5.774.973L2.57 4.175l3.32 3.319'/%3E%3C/svg%3E"); -} - -#forward-button .toolbarbutton-icon { - list-style-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 8.467 8.467'%3E%3Cpath fill='none' stroke='context-fill' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.058' d='M2.693.973l3.203 3.202-3.32 3.319'/%3E%3C/svg%3E"); -} - - - - - - - -/* Font stuff */ -* { - font-family: var(--font) !important; - font-weight: var(--font-weight) !important; - font-size: var(--font-size) !important; -} - -#urlbar-input { - text-align: center !important; -} - - -/* Make sure selected stuff in the autocomplete popup is bold and everything else is normal */ -#urlbar-results * { - font-weight: normal !important; -} - -#navigator-toolbox * .urlbarView-title, -#navigator-toolbox * #urlbarView-row-0 * strong { - font-weight: bold !important; -} - -.urlbarView-title, -.urlbarView-secondary, -.urlbarView-title-separator { - line-height: 16px !important; -} - -.tab-text { margin-top: 2px !important; } - - - - - -/* Center tab text */ -.tab-label { - -moz-box-flex: 1 !important; - text-align: center !important; -} - - - - -/* Make urlbar megabar appear more compact */ -/* Set the pref browser.urlbar.megabar to true */ -#urlbar.megabar[breakout]{ - margin-inline-start: 0px !important; - width: 100% !important; - left: 0 !important; - top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !important; -} - -#urlbar.megabar[breakout]:not([open]) { - bottom: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !important; -} - -.urlbarView.megabar { margin-inline: 0 !important; width: auto !important; } -.urlbarView-row { padding-inline: 4px !important; } -#urlbar-background { animation: none !important; } -#urlbar-input-container { padding: 0 !important; height: 100% !important; } - - -/* Align megabar a bit better */ -#navigator-toolbox * #urlbar.megabar { top: 0 !important; } - -#urlbar:not([open]) #urlbar-input-container { margin-top: 1px !important; } -#urlbar[open] #urlbar-input-container { margin-top: 3px !important; } - - - - - - - - - -/*** Change colours of a few items ***/ -:root { - /* Toolbar */ - --toolbar-color: var(--fg1) !important; - --lwt-text-color: var(--fg1) !important; - --toolbar-bgcolor: var(--bg3) !important; - --lwt-accent-color: var(--bg1) !important; - --lwt-toolbarbutton-icon-fill: var(--fg1) !important; - --lwt-toolbar-field-focus-color: var(--fg1) !important; - - /* Autocomplete Popup */ - --panel-disabled-color: var(--fg2) !important; - --autocomplete-popup-color: var(--fg1) !important; - --urlbar-popup-url-color: var(--accent) !important; - --urlbar-popup-action-color: var(--accent) !important; - --autocomplete-popup-background: var(--bg2) !important; - --autocomplete-popup-highlight-color: var(--fg1) !important; - --autocomplete-popup-highlight-background: var(--button) !important; - --lwt-toolbar-field-background-color: var(--bg3) !important; - --panel-separator-color: transparent !important; - --lwt-toolbar-field-focus: var(--bg2) !important; - - /* Sidebar */ - --lwt-sidebar-text-color: var(--fg1) !important; - --lwt-sidebar-background-color: var(--bg1) !important; - - /* Popups */ - --arrowpanel-background: var(--bg1) !important; - --arrowpanel-color: var(--fg1) !important; -} - -:root:-moz-window-inactive #navigator-toolbox { - background-color: var(--fg2) !important; -} -#navigator-toolbox { - background-color: var(--fg1) !important; -} -:root:not(:-moz-window-inactive) .tab-content:not([selected="true"]) .tab-label { - color: var(--bg1) !important; -} - -/* When the only tab is the pinned tab, make the rest of the tab bar the same colour */ -/*.tabbrowser-tab[pinned="true"]:only-of-type::after { - content: ''; - display: block !important; - width: 100vw !important; - height: var(--tab-min-height) !important; - margin: 0 !important; - background-color: var(--bg1) !important; - position: absolute; - top: 1px; - left: 0; - bottom: 0; - padding-right: 1px; - z-index: -2; - pointer-events: none !important; -}*/ - -menu[disabled="true"], -menuitem[disabled="true"] { - color: var(--disabled) !important; -} - -#sidebar-box { - --sidebar-background-color: var(--bg1) !important; - --sidebar-text-color: var(--fg1) !important; - --arrowpanel-color: var(--fg1) !important; -} - -.toolbarbutton-icon, .toolbarbutton-badge-stack { - --toolbarbutton-hover-background: var(--button) !important; - --toolbarbutton-active-background: var(--button) !important; -} - -.findbar-textbox, -#findbar-textbox-wrapper { - background-color: var(--bg2) !important; -} - -#urlbar, -.tabbrowser-tab .tab-content .tab-text, -.findbar-textbox, -.close-icon { - color: var(--fg1) !important; -} - -.tab-content:not([selected="true"]) .tab-text, -.tab-content:not([selected="true"]), -#titlebar .close-icon:not([selected="true"]) { - color: var(--bg1) !important; -} - -#urlbar:not(:focus-within) #urlbar-background { - background-color: transparent !important; -} - -#urlbar, -findbar { - background-image: none !important; - background-color: transparent !important; -} - -.findbar-button[checked] { background-color: var(--button) !important; } - -/* Change colour of fill animation when tab has finished loading */ -.tabbrowser-tab { --tab-loading-fill: var(--accent) !important; } -.tab-throbber::before { fill: var(--accent) !important; } - - -/* Prevents White pre-load flash */ -#browser vbox#appcontent tabbrowser, -#content, -#tabbrowser-tabpanels, -browser[type=content-primary], -browser[type=content] > html { - background: var(--bg1) !important -} -#tabbrowser-tabpanels { - background: var(--bg1) !important; -} - -/* -.tabbrowser-tab[selected] .tab-background { - background: linear-gradient(to right, var(--accent) 60%, var(--false) 100%) !important; - opacity: 20% !important; - border-radius: 6px !important; -}*/ - -.tabbrowser-tab[selected] .tab-background { - background: var(--bg1) !important; -} - -.tab-background { - border-top-color: transparent !important; -} - -#urlbar-background { - box-shadow: none !important; -} - - - -/* Change size of a few items */ -#navigator-toolbox * #urlbar-zoom-button { - width: auto !important; - max-width: 100px !important; -} - -#navigator-toolbox * toolbarbutton:not(#urlbar-zoom-button):not(.webextension-browser-action):not(#PanelUI-menu-button), -#navigator-toolbox * toolbarbutton:not(#tabs-newtab-button) image, -#navigator-toolbox * toolbarbutton:not(#downloads-button):not(#tabs-newtab-button) stack { - width: calc(var(--button-size) + 10px) !important; - max-height: var(--tab-min-height) !important; - height: auto !important; - padding: 5px 5px 5px 5px !important; - margin: 0px 0px 0px 0px !important; -} -#urlbar-zoom-button { - max-height: var(--tab-min-height) !important; - height: auto !important; - padding: 5px 10px 5px 10px !important; - margin: 0px 0px 0px 0px !important; -} - -.webextension-browser-action { - margin: 0 5px !important; -} - -.toolbarbutton-badge { - margin-top: 0px !important; - margin-right: 0px !important; -} - -#PanelUI-menu-button { - margin: 0px 5px !important; -} - -#navigator-toolbox * toolbarbutton:not(.webextension-browser-action):not(#PanelUI-menu-button) #downloads-indicator-anchor { - padding-top: 0px !important; -} - - -#navigator-toolbox #downloads-indicator-anchor #downloads-indicator-progress-outer #downloads-indicator-progress-inner, -#navigator-toolbox #downloads-indicator-anchor #downloads-indicator-progress-outer { - margin-left: 0px !important; -} - -#identity-icon, -.tab-icon-image, -.tab-close-button { - height: var(--icon-size) !important; - width: var(--icon-size) !important; -} - -#identity-icon { padding: 2px; } - -#TabsToolbar, -#nav-bar, -#titlebar, -.tabbrowser-tab, -#tabbrowser-tabs { - height: var(--tab-min-height) !important; - min-height: var(--tab-min-height) !important; -} - -#main-window #urlbar { - min-height: 90% !important; - max-height: 90% !important; - height: 90% !important; -} - -#main-window #urlbar #urlbar-input-container { - padding-block: 0 !important; - padding-inline: 0 !important; -} - -#tabbrowser-tabs > .tabbrowser-arrowscrollbox { - height: var(--tab-min-height); - min-height: var(--tab-min-height); -} - -#urlbar-input { padding-left: 5px !important; } -#urlbar-background { border: none !important; } - -/* Tab width */ -.tabbrowser-tab[fadein]:not([pinned]) { max-width: 90% !important; } - -/* add padding to urlbar results */ -.urlbarView-row { height: 35px !important; } -.urlbarView-body-inner { border: none !important; } -.urlbarView-row-inner { margin-top: 3px !important; } - - - -/* fix context menu automatically selecting the first item when window isn't maximized */ -/* @TODO fix hard-coded width */ -/*#main-window:not([width="1920"]) * #contentAreaContextMenu { - margin: 15px 0 0 15px !important; -}*/ |