luca
/
dotfiles
1
0
Fork 0
Code

rework userchrome

This commit is contained in:
Luca Bilke 2023-03-29 00:08:28 +02:00
parent ce62f247ff
commit f7b4f9fa5c
14 changed files with 234 additions and 656 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

107
.local/share/librewolf/chrome/includes/cascade-colours.css
View File

@ -1,107 +0,0 @@
/*---+---+---+---+---+---+---+
| C | O | L | O | U | R | S |
+---+---+---+---+---+---+---*/
@media (prefers-color-scheme: dark) { :root {
/* These colours are (mainly) used by the
Container Tabs Plugin */
--uc-identity-colour-blue: #7ED6DF;
--uc-identity-colour-turquoise: #55E6C1;
--uc-identity-colour-green: #B8E994;
--uc-identity-colour-yellow: #F7D794;
--uc-identity-colour-orange: #F19066;
--uc-identity-colour-red: #FC5C65;
--uc-identity-colour-pink: #F78FB3;
--uc-identity-colour-purple: #786FA6;
/* Cascades main Colour Scheme */
--uc-base-colour: #1E2021;
--uc-highlight-colour: #191B1C;
--uc-inverted-colour: #FAFAFC;
--uc-muted-colour: #AAAAAC;
--uc-accent-colour: var(--uc-identity-colour-purple);
}}
@media (prefers-color-scheme: light) { :root {
/* These colours are (mainly) used by the
Container Tabs Plugin */
--uc-identity-colour-blue: #1D65F5;
--uc-identity-colour-turquoise: #209FB5;
--uc-identity-colour-green: #40A02B;
--uc-identity-colour-yellow: #E49320;
--uc-identity-colour-orange: #FE640B;
--uc-identity-colour-red: #FC5C65;
--uc-identity-colour-pink: #EC83D0;
--uc-identity-colour-purple: #822FEE;
/* Cascades main Colour Scheme */
--uc-base-colour: #FAFAFC;
--uc-highlight-colour: #DADADC;
--uc-inverted-colour: #1E2021;
--uc-muted-colour: #191B1C;
--uc-accent-colour: var(--uc-identity-colour-purple);
}}
/* Down here I'm just reassigning variables based on the colours set above.
Feel free to play around with these but there is no editing necessary below this line. c:
*/
:root {
--lwt-frame: var(--uc-base-colour) !important;
--lwt-accent-color: var(--lwt-frame) !important;
--lwt-text-color: var(--uc-inverted-colour) !important;
--toolbar-field-color: var(--uc-inverted-colour) !important;
--toolbar-field-focus-color: var(--uc-inverted-colour) !important;
--toolbar-field-focus-background-color: var(--uc-highlight-colour) !important;
--toolbar-field-focus-border-color: transparent !important;
--toolbar-field-background-color: var(--lwt-frame) !important;
--lwt-toolbar-field-highlight: var(--uc-inverted-colour) !important;
--lwt-toolbar-field-highlight-text: var(--uc-highlight-colour) !important;
--urlbar-popup-url-color: var(--uc-accent-colour) !important;
--lwt-tab-text: var(--lwt-text-colour) !important;
--lwt-selected-tab-background-color: var(--uc-highlight-colour) !important;
--toolbar-bgcolor: var(--lwt-frame) !important;
--toolbar-color: var(--lwt-text-color) !important;
--toolbarseparator-color: var(--uc-accent-colour) !important;
--toolbarbutton-hover-background: var(--uc-highlight-colour) !important;
--toolbarbutton-active-background: var(--toolbarbutton-hover-background) !important;
--lwt-sidebar-background-color: var(--lwt-frame) !important;
--sidebar-background-color: var(--lwt-sidebar-background-color) !important;
--urlbar-box-bgcolor: var(--uc-highlight-colour) !important;
--urlbar-box-text-color: var(--uc-muted-colour) !important;
--urlbar-box-hover-bgcolor: var(--uc-highlight-colour) !important;
--urlbar-box-hover-text-color: var(--uc-inverted-colour) !important;
--urlbar-box-focus-bgcolor: var(--uc-highlight-colour) !important;
}
.identity-color-blue { --identity-tab-color: var(--uc-identity-colour-blue) !important; --identity-icon-color: var(--uc-identity-colour-blue) !important; }
.identity-color-turquoise { --identity-tab-color: var(--uc-identity-colour-turquoise) !important; --identity-icon-color: var(--uc-identity-colour-turquoise) !important; }
.identity-color-green { --identity-tab-color: var(--uc-identity-colour-green) !important; --identity-icon-color: var(--uc-identity-colour-green) !important; }
.identity-color-yellow { --identity-tab-color: var(--uc-identity-colour-yellow) !important; --identity-icon-color: var(--uc-identity-colour-yellow) !important; }
.identity-color-orange { --identity-tab-color: var(--uc-identity-colour-orange) !important; --identity-icon-color: var(--uc-identity-colour-orange) !important; }
.identity-color-red { --identity-tab-color: var(--uc-identity-colour-red) !important; --identity-icon-color: var(--uc-identity-colour-red) !important; }
.identity-color-pink { --identity-tab-color: var(--uc-identity-colour-pink) !important; --identity-icon-color: var(--uc-identity-colour-pink) !important; }
.identity-color-purple { --identity-tab-color: var(--uc-identity-colour-purple) !important; --identity-icon-color: var(--uc-identity-colour-purple) !important; }

139
.local/share/librewolf/chrome/includes/cascade-config-mouse.css
View File

@ -1,139 +0,0 @@
/*---+---+---+---+---+---+
| G | L | O | B | A | L |
+---+---+---+---+---+---*/
:root {
/* Global Border Radius
* applied to ALL UI elements
*/ --uc-border-radius: 0px;
/* The distance the Statuspanel floats
* away from the window border
* 0 places directly in the corner
*/ --uc-status-panel-spacing: 12px;
}
/* remove window control buttons */
.titlebar-buttonbox-container { display: none !important; }
#pageActionButton { display: none !important; }
/*---+---+---+---+---+---+---+
| T | O | O | L | B | A | R |
+---+---+---+---+---+---+---*/
:root {
/* Position of the Personal Toolbar
* possible values:
* 0 – toolbar on top
* 4 – toolbar on bottom
*/ --uc-toolbar-position: 0;
/* Darken the Personal Toolbar by X amount
* where X = 1 means pure black
* and X = 0 means no darkening at all
*/ --uc-darken-toolbar: .2;
}
/*---+---+---+---+---+---+---+
| U | R | L | — | B | A | R |
+---+---+---+---+---+---+---*/
:root {
/* Width of the URL Bar for the Oneline layout
* If enabled the max-width is applied on focus
* otherwise the URL Bar will always be it's min-width
*/ --uc-urlbar-min-width: 40vw;
--uc-urlbar-max-width: 40vw;
/* Position of the URL Bar
* possible values:
* 1 – tabs on the right
* 3 – tabs on the left
*/ --uc-urlbar-position: 1;
}
/* Disable the Navigation Buttons */
/* Disables the Tracking Protection Shield */
/* #tracking-protection-icon-container { display: none !important; } */
/* Encryption and Permissions icons */
/* Only hides permission items */
#identity-permission-box { display: none !important; }
/* Hides encryption AND permission items */
/* #identity-box { display: none !important } */
/* Hide everything BUT the zoom indicator within the URL Bar */
#page-action-buttons > :not(#urlbar-zoom-button):not(#star-button-box) { display: none !important; }
/* Hide the »Go«-arrow in the URL Bar */
#urlbar-go-button { display: none !important; }
/*---+---+---+---+---+---+---+
| T | A | B | — | B | A | R |
+---+---+---+---+---+---+---*/
:root {
/* Allow tabs to have dynamic widths based on
* the Tab Bars maximum width
*/ --uc-active-tab-width: clamp(100px, 30vw, 300px);
--uc-inactive-tab-width: clamp(100px, 20vw, 200px);
/* Enable this to always show the Tab Close button
* possible values:
* show: -moz-inline-block
* hide: none
*/ --show-tab-close-button: none;
/* Enable this to only show the Tab Close button on tab hover
* possible values:
* show: -moz-inline-block
* hide: none
*/ --show-tab-close-button-hover: -moz-inline-block;
/* Left and Right "dip" of the container indicator
* 0px equals tab width
* higer values make the indicator smaller
*/ --container-tabs-indicator-margin: 10px;
/* Amount of Glow to add to the container indicator
* Setting it to 0 disables the Glow
*/ --uc-identity-glow: 0 1px 10px 1px;
}
/* Hide the secondary Tab Label
* e.g. playing indicator (the text, not the icon) */
.tab-secondary-label { display: none !important; }

155
.local/share/librewolf/chrome/includes/cascade-config.css
View File

@ -1,155 +0,0 @@
/*---+---+---+---+---+---+
| G | L | O | B | A | L |
+---+---+---+---+---+---*/
:root {
/* Global Border Radius
* applied to ALL UI elements
*/ --uc-border-radius: 0px;
/* The distance the Statuspanel floats
* away from the window border
* 0 places directly in the corner
*/ --uc-status-panel-spacing: 12px;
}
/* remove window control buttons */
.titlebar-buttonbox-container { display: none !important; }
#pageActionButton { display: none !important; }
#PanelUI-menu-button { padding: 0px !important; }
#PanelUI-menu-button .toolbarbutton-icon { width: 1px !important; }
#PanelUI-menu-button .toolbarbutton-badge-stack { padding: 0px !important; }
/*---+---+---+---+---+---+---+
| T | O | O | L | B | A | R |
+---+---+---+---+---+---+---*/
:root {
/* Position of the Personal Toolbar
* possible values:
* 0 – toolbar on top
* 4 – toolbar on bottom
*/ --uc-toolbar-position: 0;
/* Darken the Personal Toolbar by X amount
* where X = 1 means pure black
* and X = 0 means no darkening at all
*/ --uc-darken-toolbar: .2;
}
/*---+---+---+---+---+---+---+
| U | R | L | — | B | A | R |
+---+---+---+---+---+---+---*/
:root {
/* Width of the URL Bar for the Oneline layout
* If enabled the max-width is applied on focus
* otherwise the URL Bar will always be it's min-width
*/ --uc-urlbar-min-width: 35vw;
--uc-urlbar-max-width: 35vw;
/* Position of the URL Bar
* possible values:
* 1 – tabs on the right
* 3 – tabs on the left
*/ --uc-urlbar-position: 1;
/* Firefox can be a little wonky with the vertical
* URL Bar placement. Change this variable to adapt
* to this when necessary.
*/ --uc-urlbar-top-spacing: 1px;
}
/* Disable the Navigation Buttons */
#back-button,
#forward-button { display: none !important; }
/* Disables the Tracking Protection Shield */
/* #tracking-protection-icon-container { display: none !important; } */
/* Encryption and Permissions icons */
/* Only hides permission items */
#identity-permission-box { display: none !important; }
/* Hides encryption AND permission items */
/* #identity-box { display: none !important } */
/* Hide everything BUT the zoom indicator within the URL Bar */
#page-action-buttons > :not(#urlbar-zoom-button) { display: none !important; }
/* Hide the »Go«-arrow in the URL Bar */
#urlbar-go-button { display: none !important; }
/*---+---+---+---+---+---+---+
| T | A | B | — | B | A | R |
+---+---+---+---+---+---+---*/
:root {
/* Allow tabs to have dynamic widths based on
* the Tab Bars maximum width
*/ --uc-active-tab-width: clamp(100px, 20vw, 200px);
--uc-inactive-tab-width: clamp(100px, 20vw, 200px);
/* Enable this to always show the Tab Close button
* possible values:
* show: -moz-inline-block
* hide: none
*/ --show-tab-close-button: none;
/* Enable this to only show the Tab Close button on tab hover
* possible values:
* show: -moz-inline-block
* hide: none
*/ --show-tab-close-button-hover: none;
/* Hide the all Tabs button from the Tab Bar
* possible values:
* show: -moz-box
* hide: none
*/ --uc-show-all-tabs-button: none;
/* Left and Right "dip" of the container indicator
* 0px equals tab width
* higer values make the indicator smaller
*/ --container-tabs-indicator-margin: 10px;
/* Amount of Glow to add to the container indicator
* Setting it to 0 disables the Glow
*/ --uc-identity-glow: 0 1px 10px 1px;
}
/* Hide the secondary Tab Label
* e.g. playing indicator (the text, not the icon) */
.tab-secondary-label { display: none !important; }

1
.local/share/librewolf/chrome/includes/cascade-floating-panel.css
View File

@ -1 +0,0 @@
#statuspanel #statuspanel-label { margin: 0 0 var(--uc-status-panel-spacing) var(--uc-status-panel-spacing) !important; }

39
.local/share/librewolf/chrome/includes/cascade-nav-bar.css
View File

@ -1,39 +0,0 @@
#nav-bar {
padding-block-start: 0px !important;
border: none !important;
box-shadow: none !important;
background: transparent !important;
}
#urlbar,
#urlbar * {
padding-block-start: var(--uc-urlbar-top-spacing) !important;
outline: none !important;
box-shadow: none !important;
}
#urlbar-background { border: transparent !important; }
#urlbar[focused='true']
> #urlbar-background,
#urlbar:not([open])
> #urlbar-background { background: var(--toolbar-field-background-color) !important; }
#urlbar[open]
> #urlbar-background { background: var(--toolbar-field-background-color) !important; }
.urlbarView-row:hover
> .urlbarView-row-inner,
.urlbarView-row[selected]
> .urlbarView-row-inner { background: var(--toolbar-field-focus-background-color) !important; }

9
.local/share/librewolf/chrome/includes/cascade-responsive-windows-fix.css
View File

@ -1,9 +0,0 @@
@media (min-width: 1000px) {
#nav-bar { margin: calc((var(--urlbar-min-height) * -1) - 12px) calc(100vw - var(--uc-urlbar-min-width)) 0 0 !important; }
#titlebar { margin-inline-start: var(--uc-urlbar-min-width) !important; }
#navigator-toolbox:focus-within #nav-bar { margin: calc((var(--urlbar-min-height) * -1) - 12px) calc(100vw - var(--uc-urlbar-max-width)) 0 0 !important; }
#navigator-toolbox:focus-within #titlebar { margin-inline-start: var(--uc-urlbar-max-width) !important; }
}

35
.local/share/librewolf/chrome/includes/cascade-responsive.css
View File

@ -1,35 +0,0 @@
@media (min-width: 1000px) {
#navigator-toolbox { display: flex; flex-wrap: wrap; }
#nav-bar {
order: var(--uc-urlbar-position);
width: var(--uc-urlbar-min-width);
}
#titlebar {
order: 2;
width: calc(100vw - var(--uc-urlbar-min-width) - 1px);
}
#PersonalToolbar {
order: var(--uc-toolbar-position);
width: 100%;
}
#navigator-toolbox:focus-within #nav-bar { width: var(--uc-urlbar-max-width); }
#navigator-toolbox:focus-within #titlebar { width: calc(100vw - var(--uc-urlbar-max-width) - 1px); }
}

52
.local/share/librewolf/chrome/includes/colours.css Normal file
View File

@ -0,0 +1,52 @@
/* NOTE: Main Config */
@media (prefers-color-scheme: dark) { :root {
--uc-identity-colour-blue: #7AA2F7;
--uc-identity-colour-turquoise: #1ABC9C;
--uc-identity-colour-green: #9ECE6A;
--uc-identity-colour-yellow: #E0AF68;
--uc-identity-colour-orange: #FF9E64;
--uc-identity-colour-red: #DB4B4B;
--uc-identity-colour-pink: #F7768E;
--uc-identity-colour-purple: #9D7CD8;
--uc-base-colour: #1A1B26;
--uc-highlight-colour: #292E42;
--uc-inverted-colour: #C0CAF5;
--uc-muted-colour: #3B4261;
--uc-accent-colour: var(--uc-identity-colour-purple);
}}
/* NOTE: Automatic Config */
:root {
--lwt-frame: var(--uc-base-colour) !important;
--lwt-accent-color: var(--lwt-frame) !important;
--lwt-text-color: var(--uc-inverted-colour) !important;
--toolbar-field-color: var(--uc-inverted-colour) !important;
--toolbar-field-focus-color: var(--uc-inverted-colour) !important;
--toolbar-field-focus-background-color: var(--uc-highlight-colour) !important;
--toolbar-field-focus-border-color: transparent !important;
--toolbar-field-background-color: var(--lwt-frame) !important;
--lwt-toolbar-field-highlight: var(--uc-inverted-colour) !important;
--lwt-toolbar-field-highlight-text: var(--uc-highlight-colour) !important;
--urlbar-popup-url-color: var(--uc-accent-colour) !important;
--lwt-tab-text: var(--lwt-text-colour) !important;
--lwt-selected-tab-background-color: var(--uc-highlight-colour) !important;
--toolbar-bgcolor: var(--lwt-frame) !important;
--toolbar-color: var(--lwt-text-color) !important;
--toolbarseparator-color: var(--uc-accent-colour) !important;
--toolbarbutton-hover-background: var(--uc-highlight-colour) !important;
--toolbarbutton-active-background: var(--toolbarbutton-hover-background) !important;
--lwt-sidebar-background-color: var(--lwt-frame) !important;
--sidebar-background-color: var(--lwt-sidebar-background-color) !important;
--urlbar-box-bgcolor: var(--uc-highlight-colour) !important;
--urlbar-box-text-color: var(--uc-muted-colour) !important;
--urlbar-box-hover-bgcolor: var(--uc-highlight-colour) !important;
--urlbar-box-hover-text-color: var(--uc-inverted-colour) !important;
--urlbar-box-focus-bgcolor: var(--uc-highlight-colour) !important;
}
.identity-color-blue { --identity-tab-color: var(--uc-identity-colour-blue) !important; --identity-icon-color: var(--uc-identity-colour-blue) !important; }
.identity-color-turquoise { --identity-tab-color: var(--uc-identity-colour-turquoise) !important; --identity-icon-color: var(--uc-identity-colour-turquoise) !important; }
.identity-color-green { --identity-tab-color: var(--uc-identity-colour-green) !important; --identity-icon-color: var(--uc-identity-colour-green) !important; }
.identity-color-yellow { --identity-tab-color: var(--uc-identity-colour-yellow) !important; --identity-icon-color: var(--uc-identity-colour-yellow) !important; }
.identity-color-orange { --identity-tab-color: var(--uc-identity-colour-orange) !important; --identity-icon-color: var(--uc-identity-colour-orange) !important; }
.identity-color-red { --identity-tab-color: var(--uc-identity-colour-red) !important; --identity-icon-color: var(--uc-identity-colour-red) !important; }
.identity-color-pink { --identity-tab-color: var(--uc-identity-colour-pink) !important; --identity-icon-color: var(--uc-identity-colour-pink) !important; }
.identity-color-purple { --identity-tab-color: var(--uc-identity-colour-purple) !important; --identity-icon-color: var(--uc-identity-colour-purple) !important; }

91
.local/share/librewolf/chrome/includes/config.css Normal file
View File

@ -0,0 +1,91 @@
/* NOTE: Global */
:root {
/* Global Border Radius
* applied to ALL UI elements
*/ --uc-border-radius: 2px;
/* The distance the Statuspanel floats
* away from the window border
* 0 places directly in the corner
*/ --uc-status-panel-spacing: 12px;
}
/* remove window control buttons */
.titlebar-buttonbox-container { display: none !important; }
#pageActionButton { display: none !important; }
#PanelUI-menu-button { padding: 0px !important; }
#PanelUI-menu-button .toolbarbutton-icon { width: 1px !important; }
#PanelUI-menu-button .toolbarbutton-badge-stack { padding: 0px !important; }
/* NOTE: Toolbar */
:root {
/* Position of the Personal Toolbar
* possible values:
* 0 – toolbar on top
* 4 – toolbar on bottom
*/ --uc-toolbar-position: 0;
/* Darken the Personal Toolbar by X amount
* where X = 1 means pure black
* and X = 0 means no darkening at all
*/ --uc-darken-toolbar: .2;
}
/* NOTE: URLbar */
:root {
/* Width of the URL Bar for the Oneline layout
* If enabled the max-width is applied on focus
* otherwise the URL Bar will always be it's min-width
*/ --uc-urlbar-min-width: 35vw;
--uc-urlbar-max-width: 35vw;
/* Position of the URL Bar
* possible values:
* 1 – tabs on the right
* 3 – tabs on the left
*/ --uc-urlbar-position: 1;
/* Firefox can be a little wonky with the vertical
* URL Bar placement. Change this variable to adapt
* to this when necessary.
*/ --uc-urlbar-top-spacing: 1px;
}
/* Disable the Navigation Buttons */
#back-button,
#forward-button { display: none !important; }
/* Disables the Tracking Protection Shield */
#tracking-protection-icon-container { display: none !important; }
/* Encryption and Permissions icons */
/* Only hides permission items */
#identity-permission-box { display: none !important; }
/* Hides encryption AND permission items */
#identity-box { display: none !important }
/* Hide everything BUT the zoom indicator within the URL Bar */
#page-action-buttons > :not(#urlbar-zoom-button) { display: none !important; }
/* Hide the »Go«-arrow in the URL Bar */
#urlbar-go-button { display: none !important; }
/* NOTE: Tabbar */
:root {
/* Allow tabs to have dynamic widths based on
* the Tab Bars maximum width
*/ --uc-active-tab-width: clamp(100px, 20vw, 200px);
--uc-inactive-tab-width: clamp(100px, 20vw, 200px);
/* Enable this to always show the Tab Close button
* possible values:
* show: -moz-inline-block
* hide: none
*/ --show-tab-close-button: none;
/* Enable this to only show the Tab Close button on tab hover
* possible values:
* show: -moz-inline-block
* hide: none
*/ --show-tab-close-button-hover: none;
/* Hide the all Tabs button from the Tab Bar
* possible values:
* show: -moz-box
* hide: none
*/ --uc-show-all-tabs-button: none;
/* Left and Right "dip" of the container indicator
* 0px equals tab width
* higer values make the indicator smaller
*/ --container-tabs-indicator-margin: 10px;
/* Amount of Glow to add to the container indicator
* Setting it to 0 disables the Glow
*/ --uc-identity-glow: 0 1px 10px 1px;
}
/* Hide the secondary Tab Label
* e.g. playing indicator (the text, not the icon) */
.tab-secondary-label { display: none !important; }

25
.local/share/librewolf/chrome/includes/cascade-layout.css → .local/share/librewolf/chrome/includes/layout.css
View File

@ -1,23 +1,14 @@
:root {
--toolbarbutton-border-radius: var(--uc-border-radius) !important;
--tab-border-radius: var(--uc-border-radius) !important;
--arrowpanel-border-radius: var(--uc-border-radius) !important;
}
#main-window,
#toolbar-menubar,
#TabsToolbar,
#navigator-toolbox,
#sidebar-box,
#nav-bar { box-shadow: none !important; }
#main-window,
#toolbar-menubar,
#TabsToolbar,
@ -25,29 +16,13 @@
#navigator-toolbox,
#sidebar-box,
#nav-bar { border: none !important; }
/* remove "padding" left and right from tabs */
.titlebar-spacer { display: none !important; }
#PersonalToolbar {
padding: 6px !important;
box-shadow: inset 0 0 50vh rgba(0, 0, 0, var(--uc-darken-toolbar)) !important;;
}
#statuspanel #statuspanel-label {
border: none !important;
border-radius: var(--uc-border-radius) !important;
}

23
.local/share/librewolf/chrome/includes/nav-bar.css Normal file
View File

@ -0,0 +1,23 @@
#nav-bar {
padding-block-start: 0px !important;
border: none !important;
box-shadow: none !important;
background: transparent !important;
}
#urlbar,
#urlbar * {
padding-block-start: var(--uc-urlbar-top-spacing) !important;
outline: none !important;
box-shadow: none !important;
}
#urlbar-background { border: transparent !important; }
#urlbar[focused='true']
> #urlbar-background,
#urlbar:not([open])
> #urlbar-background { background: var(--toolbar-field-background-color) !important; }
#urlbar[open]
> #urlbar-background { background: var(--toolbar-field-background-color) !important; }
.urlbarView-row:hover
> .urlbarView-row-inner,
.urlbarView-row[selected]
> .urlbarView-row-inner { background: var(--toolbar-field-focus-background-color) !important; }

17
.local/share/librewolf/chrome/includes/responsive.css Normal file
View File

@ -0,0 +1,17 @@
@media (min-width: 1000px) {
#navigator-toolbox { display: flex; flex-wrap: wrap; }
#nav-bar {
order: var(--uc-urlbar-position);
width: var(--uc-urlbar-min-width);
}
#titlebar {
order: 2;
width: calc(100vw - var(--uc-urlbar-min-width) - 1px);
}
#PersonalToolbar {
order: var(--uc-toolbar-position);
width: 100%;
}
#navigator-toolbox:focus-within #nav-bar { width: var(--uc-urlbar-max-width); }
#navigator-toolbox:focus-within #titlebar { width: calc(100vw - var(--uc-urlbar-max-width) - 1px); }
}

64
.local/share/librewolf/chrome/includes/cascade-tabs.css → .local/share/librewolf/chrome/includes/tabs.css
View File

@ -2,148 +2,84 @@
#tabbrowser-tabs[haspinnedtabs]:not([positionpinnedtabs])
> #tabbrowser-arrowscrollbox
> .tabbrowser-tab[first-visible-unpinned-tab] { margin-inline-start: 0 !important; }
/* Hides the list-all-tabs button*/
#alltabs-button { display: var(--uc-show-all-tabs-button) !important; }
/* remove tab shadow */
.tabbrowser-tab
>.tab-stack
> .tab-background { box-shadow: none !important; }
/* multi tab selection */
#tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab:is([multiselected])
> .tab-stack
> .tab-background:-moz-lwtheme { outline-color: var(--toolbarseparator-color) !important; }
/* tab close button options */
.tabbrowser-tab:not([pinned]) .tab-close-button { display: var(--show-tab-close-button) !important; }
.tabbrowser-tab:not([pinned]):hover .tab-close-button { display: var(--show-tab-close-button-hover) !important }
/* adaptive tab width */
.tabbrowser-tab[selected][fadein]:not([pinned]) { max-width: var(--uc-active-tab-width) !important; }
.tabbrowser-tab[fadein]:not([selected]):not([pinned]) { max-width: var(--uc-inactive-tab-width) !important; }
/* container tabs indicator */
.tabbrowser-tab[usercontextid]
> .tab-stack
> .tab-background
> .tab-context-line {
margin: -1px var(--container-tabs-indicator-margin) 0 var(--container-tabs-indicator-margin) !important;
height: 1px !important;
box-shadow: var(--uc-identity-glow) var(--identity-tab-color) !important;
}
/* show favicon when media is playing but tab is hovered */
.tab-icon-image:not([pinned]) { opacity: 1 !important; }
/* Makes the speaker icon to always appear if the tab is playing (not only on hover) */
.tab-icon-overlay:not([crashed]),
.tab-icon-overlay[pinned][crashed][selected] {
top: 5px !important;
z-index: 1 !important;
padding: 1.5px !important;
inset-inline-end: -8px !important;
width: 16px !important; height: 16px !important;
border-radius: 10px !important;
}
/* style and position speaker icon */
.tab-icon-overlay:not([sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) {
stroke: transparent !important;
background: transparent !important;
opacity: 1 !important; fill-opacity: 0.8 !important;
color: currentColor !important;
stroke: var(--toolbar-bgcolor) !important;
background-color: var(--toolbar-bgcolor) !important;
}
/* change the colours of the speaker icon on active tab to match tab colours */
.tabbrowser-tab[selected] .tab-icon-overlay:not([sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) {
stroke: var(--toolbar-bgcolor) !important;
background-color: var(--toolbar-bgcolor) !important;
}
.tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) { margin-inline-end: 9.5px !important; }
.tabbrowser-tab:not([image]) .tab-icon-overlay:not([pinned], [sharing], [crashed]) {
top: 0 !important;
padding: 0 !important;
margin-inline-end: 5.5px !important;
inset-inline-end: 0 !important;
}
.tab-icon-overlay:not([crashed])[soundplaying]:hover,
.tab-icon-overlay:not([crashed])[muted]:hover,
.tab-icon-overlay:not([crashed])[activemedia-blocked]:hover {
color: currentColor !important;
stroke: var(--toolbar-color) !important;
background-color: var(--toolbar-color) !important;
fill-opacity: 0.95 !important;
}
.tabbrowser-tab[selected] .tab-icon-overlay:not([crashed])[soundplaying]:hover,
.tabbrowser-tab[selected] .tab-icon-overlay:not([crashed])[muted]:hover,
.tabbrowser-tab[selected] .tab-icon-overlay:not([crashed])[activemedia-blocked]:hover {
color: currentColor !important;
stroke: var(--toolbar-color) !important;
background-color: var(--toolbar-color) !important;
fill-opacity: 0.95 !important;
}
/* speaker icon colour fix */
#TabsToolbar .tab-icon-overlay:not([crashed])[soundplaying],
#TabsToolbar .tab-icon-overlay:not([crashed])[muted],
#TabsToolbar .tab-icon-overlay:not([crashed])[activemedia-blocked] { color: var(--toolbar-color) !important; }
/* speaker icon colour fix on hover */
#TabsToolbar .tab-icon-overlay:not([crashed])[soundplaying]:hover,
#TabsToolbar .tab-icon-overlay:not([crashed])[muted]:hover,

43
.local/share/librewolf/chrome/userChrome.css
View File

@ -1,39 +1,8 @@
/*==============================================================================================*
@import 'includes/config.css';
@import 'includes/colours.css';
+-----+-----+-----+-----+-----+-----+-----+
| █▀▀ | ▄▀█ | █▀▀ | █▀▀ | ▄▀█ | █▀▄ | █▀▀ |
| █▄▄ | █▀█ | ▄▄█ | █▄▄ | █▀█ | █▄▀ | ██▄ |
+-----+-----+-----+-----+-----+-----+-----+
@import 'includes/layout.css';
@import 'includes/responsive.css';
Description: Cascade is a minimalstic and keyboard centered custom theme removing a lot of the
subjective clutter default Firefox comes with. This theme is highly inspired by the
stylistic choices of SimpleFox by Miguel Ávila. 🦊
https://github.com/migueravila/SimpleFox
Author: Andreas Grafen
(https://andreas.grafen.info)
Repository: https://github.com/andreasgrafen/cascade
Thank you Nick, Abdallah, Benyamin and Wael for all the great suggestions for improvements! ♡
Nick: https://github.com/nicksundermeyer
Abdallah: https://github.com/HeiWiper
Benyamin: https://github.com/benyaminl
Wael: https://github.com/wael444
If you're looking for a **mouse-friendly** clone please check out Waterfall.
https://github.com/crambaud/waterfall
*==============================================================================================*/
@import 'includes/cascade-config.css';
@import 'includes/cascade-colours.css';
@import 'includes/cascade-layout.css';
@import 'includes/cascade-responsive.css';
@import 'includes/cascade-floating-panel.css';
@import 'includes/cascade-nav-bar.css';
@import 'includes/cascade-tabs.css';
@import 'includes/nav-bar.css';
@import 'includes/tabs.css';