Modularized CSS and add Solid Color Scheme as alternative to transparent (#26)
* init * readme * README * readme and scrot * readme and scrot
This commit is contained in:
Gerome Matilla
parent
2bb5f6df5a
commit
513e44559a
52
README.md
52
README.md
@ -2,13 +2,19 @@
|
|||||||
|
|
||||||
### A modern Firefox CSS Theme
|
### A modern Firefox CSS Theme
|
||||||
|
|
||||||
<p align="center"><img alt="Firefox with blurredfox" src="scrot.webp"/><br/><i>Firefox with blurredfox CSS theme</i></p>
|
<p align="center"><img alt="Firefox with blurredfox" src="scrots/blurred.webp"/><br/><i>Firefox with blurredfox CSS theme</i></p>
|
||||||
|
<p align="center"><img alt="Firefox with blurredfox" src="scrots/solid.webp"/><br/><i>blurredfox's layout with solid colors</i></p>
|
||||||
|
|
||||||
## Requirements
|
## Requirements
|
||||||
|
|
||||||
+ The latest Firefox
|
+ The latest Firefox
|
||||||
+ Compositor with blur shader (optional)
|
+ Compositor with blur support (optional)
|
||||||
+ Linux machine - untested on macOS and Windows 10 - might work though (optional)
|
|
||||||
|
## Notes
|
||||||
|
|
||||||
|
+ 100% working on linux.
|
||||||
|
+ Untested on macOS.
|
||||||
|
+ Transparency is broken on Windows 10 (has graphical glitches like flickering). The [solid color scheme](https://github.com/manilarome/blurredfox/blob/master/colors/solid.css) *may* work.
|
||||||
|
|
||||||
## How to
|
## How to
|
||||||
|
|
||||||
@ -60,39 +66,35 @@
|
|||||||
+ **`layout.css.backdrop-filter.enabled`**
|
+ **`layout.css.backdrop-filter.enabled`**
|
||||||
+ **`svg.context-properties.content.enabled`**
|
+ **`svg.context-properties.content.enabled`**
|
||||||
|
|
||||||
Then make sure to **enable them all!**
|
Then make sure to **enable them all!**. Or you can just copy the `user.js` file to your profile.
|
||||||
|
|
||||||
4. Go to your Firefox profile.
|
4. Go to your Firefox profile.
|
||||||
|
|
||||||
+ Linux - `$HOME/.mozilla/firefox/XXXXXXX.default-XXXXXX/`.
|
+ Linux - `$HOME/.mozilla/firefox/XXXXXXX.default-XXXXXX/`.
|
||||||
+ Windows 10 - `C:\Users\<USERNAME>\AppData\Roaming\Mozilla\Firefox\Profiles\XXXXXXX.default-XXXXXX`.
|
+ Windows 10 - `C:\Users\<USERNAME>\AppData\Roaming\Mozilla\Firefox\Profiles\XXXXXXX.default-XXXXXX`.
|
||||||
+ macOS - `Users/<USERNAME>/Library/Application Support/Firefox/Profiles/XXXXXXX.default-XXXXXXX`.
|
+ macOS - `Users/<USERNAME>/Library/Application Support/Firefox/Profiles/XXXXXXX.default-XXXXXXX`.
|
||||||
|
|
||||||
5. Create a folder and name it **`chrome`**, then assuming that you already have cloned this repo, just copy the theme to `chrome` folder.
|
5. Create a folder and name it **`chrome`**, then assuming that you already have cloned this repo, just copy the theme to `chrome` folder.
|
||||||
6. Restart Firefox.
|
6. Restart Firefox.
|
||||||
7. Finally, you can now change whatever colorscheme you want in the Cusomization Window.
|
7. Finally, you can now change whatever color mode you want in the Cusomization Window.
|
||||||
|
|
||||||
+ Default - Uses system colors, but uses the theme's layout.
|
+ Default - Uses system colors, but uses the theme's layout.
|
||||||
+ Dark - Dark colorscheme. Good for the night.
|
+ Dark - Dark colorscheme. Good for the night.
|
||||||
+ Light - Bright colorscheme. Good for killing the eyes.
|
+ Light - Bright colorscheme. Good for killing the eyes.
|
||||||
|
|
||||||
### Uninstall
|
## User Support
|
||||||
|
|
||||||
1. Go to your profile directory.
|
### Some UIs are broken!
|
||||||
2. Delete the `chrome` folder.
|
|
||||||
3. If you used the installation script, you can also delete the `user.js` inside your profile directory.
|
|
||||||
|
|
||||||
## Note
|
|
||||||
|
|
||||||
### Some UI are broken!
|
|
||||||
|
|
||||||
1. Check if you're using the latest version of Firefox.
|
1. Check if you're using the latest version of Firefox.
|
||||||
2. If you're not using Linux check the next note below.
|
2. It's broken because you're using Windows 10 and macOS or you're using an ancient version of Firefox.
|
||||||
|
|
||||||
### If you're using Windows or macOS and something's wrong
|
### If you're using Windows or macOS and something's wrong
|
||||||
|
|
||||||
1. I only have Archlinux, so I cannot guarantee that it will work on Windows 10 and macOS without a problem. A feedback and a PR is absolutely welcome! All you can do or try is to install the theme, then change the value of `--bf-moz-appearance` variable to either `-moz-win-glass` if Windows 10 and `-moz-mac-vibrancy-dark` if macOS. Still, do not expect that it will work without a problem. The theme's untested on these platforms!
|
1. I only have Archlinux, macOS' untested while the theme is broken on Windows 10.
|
||||||
|
2. If the transparency is broken, use the [solid color scheme](https://github.com/manilarome/blurredfox/blob/master/colors/solid.css). Edit the `userChrome.css` to switch.
|
||||||
|
|
||||||
### Liar! Your theme's name is `blurredfox`, ***where is the blur***?!
|
### Liar! The theme's name is `blurredfox`, ***where is the blur***?!
|
||||||
|
|
||||||
1. Yeah, the name `blurredfox` is a lie, just like the cake. I named it blurredfox because it's designed to look gorgeous with a blur effect. You can, however, have the blur effect by:
|
1. Yeah, the name `blurredfox` is a lie, just like the cake. I named it blurredfox because it's designed to look gorgeous with a blur effect. You can, however, have the blur effect by:
|
||||||
|
|
||||||
@ -113,14 +115,24 @@
|
|||||||
1. You can adjust the value of `scrollbar-width` in `userContent.css`.
|
1. You can adjust the value of `scrollbar-width` in `userContent.css`.
|
||||||
2. Restart Firefox.
|
2. Restart Firefox.
|
||||||
|
|
||||||
|
### How can I set or change the colors for the Default color mode?
|
||||||
|
|
||||||
|
1. The default mode are from Firefox and it uses the system colors. Although I only tried and tested it with `GTK3`, it should work with any platforms or environment as long as Firefox can detect your system colors.
|
||||||
|
|
||||||
|
|
||||||
### I hate the colors! Why is everything transparent?!
|
### I hate the colors! Why is everything transparent?!
|
||||||
|
|
||||||
1. You can change the colors in `userChrome.css`.
|
1. Use the [solid color scheme](https://github.com/manilarome/blurredfox/blob/master/colors/solid.css) by editing the `userChrome.css`.
|
||||||
2. The transparency is only applied to `Dark` and `Light` colorschemes. `No transparency == No blur`.
|
2. You can change the colors yourself.
|
||||||
|
3. The transparency is only applied to `Dark` and `Light` mode under the blurred color scheme. `No transparency == No blur`.
|
||||||
|
4. You can read the next point.
|
||||||
|
|
||||||
### How can I set or change the colors for the Default colorscheme?
|
### Uninstall this now!
|
||||||
|
|
||||||
1. The default colorscheme are from Firefox and it uses the system colors. Although I only tried and tested it with `GTK3`, it should work with any platforms or environment as long as Firefox can detect your system colors. So all you can do is to switch theme to change its colorscheme.
|
1. Go to your profile directory.
|
||||||
|
2. Delete the `chrome` folder.
|
||||||
|
3. If you used the installation script or copied the `user.js` to your profile, delete it.
|
||||||
|
4. Sayonara.
|
||||||
|
|
||||||
## Got a problem?
|
## Got a problem?
|
||||||
|
|
||||||
|
|||||||
83
colors/blurred.css
Normal file
83
colors/blurred.css
Normal file
@ -0,0 +1,83 @@
|
|||||||
|
:root {
|
||||||
|
/* All the CSS variables here are global */
|
||||||
|
/* These applies to all colorschemes */
|
||||||
|
|
||||||
|
/* If windows - `-moz-win-glass`, if macOS - `-moz-mac-vibrancy-dark` */
|
||||||
|
--bf-moz-appearance: -moz-win-glass !important;
|
||||||
|
|
||||||
|
--bf-backdrop-blur: 6px;
|
||||||
|
|
||||||
|
--bf-sidebar-searchbar-radius: 6px;
|
||||||
|
|
||||||
|
--bf-accent-bg: #4C5FF9CC;
|
||||||
|
--bf-blank-page-bg: #252525;
|
||||||
|
|
||||||
|
--bf-urlbar-hightlight-bg: var(--bf-accent-bg);
|
||||||
|
--bf-urlbar-radius: 9px;
|
||||||
|
--bf-urlbar-results-font-size: 12pt;
|
||||||
|
--bf-urlbar-results-font-weight: 550;
|
||||||
|
--bf-urlbar-font-size: 12pt;
|
||||||
|
--bf-urlbar-font-weight: 500;
|
||||||
|
--bf-urlbar-switch-tab-color: #6498EF;
|
||||||
|
--bf-urlbar-bookmark-color: #53E2AE;
|
||||||
|
|
||||||
|
--bf-navbar-padding: 6px;
|
||||||
|
|
||||||
|
--bf-tab-selected-bg: #77777788;
|
||||||
|
--bf-tab-font-size: 11pt;
|
||||||
|
--bf-tab-font-weight: 400;
|
||||||
|
--bf-tab-height: 36px;
|
||||||
|
--bf-tab-border-radius: 6px;
|
||||||
|
--bf-tab-soundplaying-bg: #985EFFCC;
|
||||||
|
|
||||||
|
--toolbar-bgcolor: transparent !important;
|
||||||
|
--urlbar-separator-color: transparent !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Light Mode */
|
||||||
|
:root:-moz-lwtheme-darktext {
|
||||||
|
--bf-main-window: transparent;
|
||||||
|
--bf-bg: #F2F2F266;
|
||||||
|
--bf-color: #0A0A0A;
|
||||||
|
|
||||||
|
--bf-hover-bg: #1A1A1A33;
|
||||||
|
--bf-active-bg: #1A1A1A66;
|
||||||
|
|
||||||
|
--bf-icon-color: #0A0A0A;
|
||||||
|
--bf-tab-toolbar-bg: #F2F2F2AA;
|
||||||
|
--bf-tab-selected-bg: #00000022;
|
||||||
|
--bf-navbar-bg: var(--bf-bg);
|
||||||
|
--bf-urlbar-bg: var(--bf-bg);
|
||||||
|
--bf-urlbar-active-bg: var(--bf-bg);
|
||||||
|
--bf-urlbar-focused-color: var(--bf-color);
|
||||||
|
|
||||||
|
--bf-sidebar-bg: var(--bf-bg);
|
||||||
|
--bf-sidebar-color: var(--bf-color);
|
||||||
|
|
||||||
|
--bf-menupopup-bg: #F2F2F2AA;
|
||||||
|
--bf-menupopup-color: var(--bf-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Dark Mode */
|
||||||
|
:root:-moz-lwtheme-brighttext {
|
||||||
|
--bf-main-window: transparent;
|
||||||
|
--bf-bg: #00000066;
|
||||||
|
--bf-color: #F2F2F2;
|
||||||
|
|
||||||
|
--bf-hover-bg: #F2F2F233;
|
||||||
|
--bf-active-bg: #F2F2F266;
|
||||||
|
|
||||||
|
--bf-icon-color: #F2F2F2;
|
||||||
|
--bf-tab-toolbar-bg: #000000AA;
|
||||||
|
--bf-tab-selected-bg: #F2F2F210;
|
||||||
|
--bf-navbar-bg: var(--bf-bg);
|
||||||
|
--bf-urlbar-bg: var(--bf-bg);
|
||||||
|
--bf-urlbar-active-bg: var(--bf-bg);
|
||||||
|
--bf-urlbar-focused-color: var(--bf-color);
|
||||||
|
|
||||||
|
--bf-sidebar-bg: var(--bf-bg);
|
||||||
|
--bf-sidebar-color: var(--bf-color);
|
||||||
|
|
||||||
|
--bf-menupopup-bg: #000000AA;
|
||||||
|
--bf-menupopup-color: var(--bf-color);
|
||||||
|
}
|
||||||
83
colors/solid.css
Normal file
83
colors/solid.css
Normal file
@ -0,0 +1,83 @@
|
|||||||
|
:root {
|
||||||
|
/* All the CSS variables here are global */
|
||||||
|
/* These applies to all colorschemes */
|
||||||
|
|
||||||
|
/* If windows - `-moz-win-glass`, if macOS - `-moz-mac-vibrancy-dark` */
|
||||||
|
--bf-moz-appearance: -moz-win-glass !important;
|
||||||
|
|
||||||
|
--bf-backdrop-blur: 6px;
|
||||||
|
|
||||||
|
--bf-sidebar-searchbar-radius: 6px;
|
||||||
|
|
||||||
|
--bf-accent-bg: #4C5FF9CC;
|
||||||
|
--bf-blank-page-bg: #252525;
|
||||||
|
|
||||||
|
--bf-urlbar-hightlight-bg: var(--bf-accent-bg);
|
||||||
|
--bf-urlbar-radius: 9px;
|
||||||
|
--bf-urlbar-results-font-size: 12pt;
|
||||||
|
--bf-urlbar-results-font-weight: 550;
|
||||||
|
--bf-urlbar-font-size: 12pt;
|
||||||
|
--bf-urlbar-font-weight: 500;
|
||||||
|
--bf-urlbar-switch-tab-color: #6498EF;
|
||||||
|
--bf-urlbar-bookmark-color: #53E2AE;
|
||||||
|
|
||||||
|
--bf-navbar-padding: 6px;
|
||||||
|
|
||||||
|
--bf-tab-selected-bg: #77777788;
|
||||||
|
--bf-tab-font-size: 11pt;
|
||||||
|
--bf-tab-font-weight: 400;
|
||||||
|
--bf-tab-height: 36px;
|
||||||
|
--bf-tab-border-radius: 6px;
|
||||||
|
--bf-tab-soundplaying-bg: #985EFFCC;
|
||||||
|
|
||||||
|
--toolbar-bgcolor: transparent !important;
|
||||||
|
--urlbar-separator-color: transparent !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Light Mode */
|
||||||
|
:root:-moz-lwtheme-darktext {
|
||||||
|
--bf-main-window: #F2F2F2;
|
||||||
|
--bf-bg: var(--bf-main-window);
|
||||||
|
--bf-color: #0A0A0A;
|
||||||
|
|
||||||
|
--bf-hover-bg: #1A1A1A33;
|
||||||
|
--bf-active-bg: #1A1A1A66;
|
||||||
|
|
||||||
|
--bf-icon-color: #0A0A0A;
|
||||||
|
--bf-tab-toolbar-bg: #F2F2F2;
|
||||||
|
--bf-tab-selected-bg: #CFCFCF;
|
||||||
|
--bf-navbar-bg: #E6E6E6;
|
||||||
|
--bf-urlbar-bg: var(--bf-bg);
|
||||||
|
--bf-urlbar-active-bg: var(--bf-bg);
|
||||||
|
--bf-urlbar-focused-color: var(--bf-color);
|
||||||
|
|
||||||
|
--bf-sidebar-bg: var(--bf-bg);
|
||||||
|
--bf-sidebar-color: var(--bf-color);
|
||||||
|
|
||||||
|
--bf-menupopup-bg: #F2F2F2EE;
|
||||||
|
--bf-menupopup-color: var(--bf-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Dark Mode */
|
||||||
|
:root:-moz-lwtheme-brighttext {
|
||||||
|
--bf-main-window: #0A0A0A;
|
||||||
|
--bf-bg: var(--bf-main-window);
|
||||||
|
--bf-color: #F2F2F2;
|
||||||
|
|
||||||
|
--bf-hover-bg: #F2F2F233;
|
||||||
|
--bf-active-bg: #F2F2F266;
|
||||||
|
|
||||||
|
--bf-icon-color: #F2F2F2;
|
||||||
|
--bf-tab-toolbar-bg: var(--base-bg);
|
||||||
|
--bf-tab-selected-bg: #252525;
|
||||||
|
--bf-navbar-bg: #252525;
|
||||||
|
--bf-urlbar-bg: #353535;
|
||||||
|
--bf-urlbar-active-bg: #353535;
|
||||||
|
--bf-urlbar-focused-color: var(--bf-color);
|
||||||
|
|
||||||
|
--bf-sidebar-bg: var(--bf-bg);
|
||||||
|
--bf-sidebar-color: var(--bf-color);
|
||||||
|
|
||||||
|
--bf-menupopup-bg: #0A0A0AEE;
|
||||||
|
--bf-menupopup-color: var(--bf-color);
|
||||||
|
}
|
||||||
25
parts/arrow-panel.css
Normal file
25
parts/arrow-panel.css
Normal file
@ -0,0 +1,25 @@
|
|||||||
|
/*
|
||||||
|
░█▀█░█▀▄░█▀▄░█▀█░█░█░█▀█░█▀█░█▀█░█▀▀░█░░
|
||||||
|
░█▀█░█▀▄░█▀▄░█░█░█▄█░█▀▀░█▀█░█░█░█▀▀░█░░
|
||||||
|
░▀░▀░▀░▀░▀░▀░▀▀▀░▀░▀░▀░░░▀░▀░▀░▀░▀▀▀░▀▀▀
|
||||||
|
|
||||||
|
The dropdown menus
|
||||||
|
*/
|
||||||
|
|
||||||
|
.panel-arrowcontent {
|
||||||
|
padding: 0 !important;
|
||||||
|
margin: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
toolbarseparator {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
box.panel-arrowbox {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
box.panel-arrowcontent {
|
||||||
|
border-radius: 8px !important;
|
||||||
|
border: none !important;
|
||||||
|
}
|
||||||
44
parts/context-menu.css
Normal file
44
parts/context-menu.css
Normal file
@ -0,0 +1,44 @@
|
|||||||
|
|
||||||
|
/*
|
||||||
|
░█▀▀░█▀█░█▀█░▀█▀░█▀▀░█░█░▀█▀░█▄█░█▀▀░█▀█░█░█
|
||||||
|
░█░░░█░█░█░█░░█░░█▀▀░▄▀▄░░█░░█░█░█▀▀░█░█░█░█
|
||||||
|
░▀▀▀░▀▀▀░▀░▀░░▀░░▀▀▀░▀░▀░░▀░░▀░▀░▀▀▀░▀░▀░▀▀▀
|
||||||
|
|
||||||
|
Right-click menu
|
||||||
|
*/
|
||||||
|
|
||||||
|
menupopup,
|
||||||
|
popup,
|
||||||
|
popup > menu > menupopup,
|
||||||
|
menupopup > menu > menupopup {
|
||||||
|
border: 0 !important;
|
||||||
|
border-radius: 4px !important;
|
||||||
|
padding: 2px 0 2px 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
menupopup:-moz-lwtheme-darktext,
|
||||||
|
menupopup:-moz-lwtheme-brighttext,
|
||||||
|
popup:-moz-lwtheme-darktext,
|
||||||
|
popup:-moz-lwtheme-brighttext,
|
||||||
|
popup > menu > menupopup:-moz-lwtheme-darktext,
|
||||||
|
popup > menu > menupopup:-moz-lwtheme-brighttext,
|
||||||
|
menupopup > menu > menupopup:-moz-lwtheme-darktext,
|
||||||
|
menupopup > menu > menupopup:-moz-lwtheme-brighttext {
|
||||||
|
-moz-appearance: none !important;
|
||||||
|
background: var(--bf-menupopup-bg) !important;
|
||||||
|
color: var(--bf-menupopup-color) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
menupopup menuseparator {
|
||||||
|
/* -moz-appearance: none !important; */
|
||||||
|
margin: 2px 0 2px 0 !important;
|
||||||
|
padding: 0 !important;
|
||||||
|
border-top: none !important;
|
||||||
|
border-color: transparent !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
menupopup menuseparator:-moz-lwtheme-darktext,
|
||||||
|
menupopup menuseparator:-moz-lwtheme-brighttext {
|
||||||
|
-moz-appearance: none !important;
|
||||||
|
background: #525A6D !important;
|
||||||
|
}
|
||||||
34
parts/customization-window.css
Normal file
34
parts/customization-window.css
Normal file
@ -0,0 +1,34 @@
|
|||||||
|
|
||||||
|
/*
|
||||||
|
░█▀▀░█░█░█▀▀░▀█▀░█▀█░█▄█░▀█▀░▀▀█░█▀█░▀█▀░▀█▀░█▀█░█▀█░█░█░▀█▀░█▀█░█▀▄░█▀█░█░█
|
||||||
|
░█░░░█░█░▀▀█░░█░░█░█░█░█░░█░░▄▀░░█▀█░░█░░░█░░█░█░█░█░█▄█░░█░░█░█░█░█░█░█░█▄█
|
||||||
|
░▀▀▀░▀▀▀░▀▀▀░░▀░░▀▀▀░▀░▀░▀▀▀░▀▀▀░▀░▀░░▀░░▀▀▀░▀▀▀░▀░▀░▀░▀░▀▀▀░▀░▀░▀▀░░▀▀▀░▀░▀
|
||||||
|
|
||||||
|
The customization window
|
||||||
|
*/
|
||||||
|
|
||||||
|
#customization-container {
|
||||||
|
}
|
||||||
|
|
||||||
|
#customization-container:-moz-lwtheme-darktext,
|
||||||
|
#customization-container:-moz-lwtheme-brighttext {
|
||||||
|
background: var(--bf-bg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.customizationmode-button {
|
||||||
|
padding: 5px !important;
|
||||||
|
border-radius: 6px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.customizationmode-button:-moz-lwtheme-darktext,
|
||||||
|
.customizationmode-button:-moz-lwtheme-brighttext {
|
||||||
|
color: var(--bf-color) !important;;
|
||||||
|
}
|
||||||
|
|
||||||
|
.customizationmode-button:hover {
|
||||||
|
padding: 5px !important;
|
||||||
|
border-radius: 6px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.customizationmode-button label {
|
||||||
|
}
|
||||||
43
parts/findbar.css
Normal file
43
parts/findbar.css
Normal file
@ -0,0 +1,43 @@
|
|||||||
|
|
||||||
|
/*
|
||||||
|
░█▀▀░▀█▀░█▀█░█▀▄░█▀▄░█▀█░█▀▄
|
||||||
|
░█▀▀░░█░░█░█░█░█░█▀▄░█▀█░█▀▄
|
||||||
|
░▀░░░▀▀▀░▀░▀░▀▀░░▀▀░░▀░▀░▀░▀
|
||||||
|
|
||||||
|
The findbar
|
||||||
|
*/
|
||||||
|
|
||||||
|
#browser #appcontent #tabbrowser-tabbox findbar,
|
||||||
|
#browser #appcontent #tabbrowser-tabbox tabpanels {
|
||||||
|
-moz-appearance: none !important;
|
||||||
|
border: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#browser #appcontent #tabbrowser-tabbox findbar:-moz-lwtheme-darktext,
|
||||||
|
#browser #appcontent #tabbrowser-tabbox findbar:-moz-lwtheme-brighttext,
|
||||||
|
#browser #appcontent #tabbrowser-tabbox tabpanels:-moz-lwtheme-darktext,
|
||||||
|
#browser #appcontent #tabbrowser-tabbox tabpanels:-moz-lwtheme-brighttext {
|
||||||
|
background: transparent !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#browser #appcontent #tabbrowser-tabbox findbar {
|
||||||
|
}
|
||||||
|
|
||||||
|
#browser #appcontent #tabbrowser-tabbox findbar:-moz-lwtheme-darktext,
|
||||||
|
#browser #appcontent #tabbrowser-tabbox findbar:-moz-lwtheme-brighttext {
|
||||||
|
background-color: var(--bf-bg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.findbar-find-previous,
|
||||||
|
.findbar-find-next {
|
||||||
|
margin: 0 !important;
|
||||||
|
border: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#browser #appcontent #tabbrowser-tabbox .findbar-find-fast {
|
||||||
|
}
|
||||||
|
|
||||||
|
#browser #appcontent #tabbrowser-tabbox .findbar-find-fast:not([status="notfound"]):-moz-lwtheme-darktext,
|
||||||
|
#browser #appcontent #tabbrowser-tabbox .findbar-find-fast:not([status="notfound"]):-moz-lwtheme-brighttext {
|
||||||
|
background-color: var(--bf-bg) !important;
|
||||||
|
}
|
||||||
34
parts/main-window.css
Normal file
34
parts/main-window.css
Normal file
@ -0,0 +1,34 @@
|
|||||||
|
/*
|
||||||
|
░▀█▀░█▀▄░█▀█░█▀█░█▀▀░█▀█░█▀█░█▀▄░█▀▀░█▀█░█▀▀░█░█
|
||||||
|
░░█░░█▀▄░█▀█░█░█░▀▀█░█▀▀░█▀█░█▀▄░█▀▀░█░█░█░░░░█░
|
||||||
|
░░▀░░▀░▀░▀░▀░▀░▀░▀▀▀░▀░░░▀░▀░▀░▀░▀▀▀░▀░▀░▀▀▀░░▀░
|
||||||
|
|
||||||
|
Main window
|
||||||
|
*/
|
||||||
|
#main-window {
|
||||||
|
font-kerning: normal;
|
||||||
|
border: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Add transparency to light and dark color schemes */
|
||||||
|
#main-window:-moz-lwtheme-brighttext,
|
||||||
|
#main-window:-moz-lwtheme-darktext {
|
||||||
|
background: var(--bf-main-window) !important;
|
||||||
|
-moz-appearance: var(--bf-moz-appearance) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
░█▀▀░█▀█░█▀█░▀█▀
|
||||||
|
░█▀▀░█░█░█░█░░█░
|
||||||
|
░▀░░░▀▀▀░▀░▀░░▀░
|
||||||
|
|
||||||
|
I'm not sure if this does something
|
||||||
|
*/
|
||||||
|
|
||||||
|
* {
|
||||||
|
-webkit-font-smoothing: antialiased;
|
||||||
|
-moz-osx-font-smoothing: grayscale;
|
||||||
|
text-rendering: optimizeLegibility;
|
||||||
|
font-variant-ligatures: none;
|
||||||
|
font-kerning: normal;
|
||||||
|
}
|
||||||
28
parts/sidebar.css
Normal file
28
parts/sidebar.css
Normal file
@ -0,0 +1,28 @@
|
|||||||
|
/*
|
||||||
|
░█▀▀░▀█▀░█▀▄░█▀▀░█▀▄░█▀█░█▀▄
|
||||||
|
░▀▀█░░█░░█░█░█▀▀░█▀▄░█▀█░█▀▄
|
||||||
|
░▀▀▀░▀▀▀░▀▀░░▀▀▀░▀▀░░▀░▀░▀░▀
|
||||||
|
|
||||||
|
Sidebar
|
||||||
|
*/
|
||||||
|
|
||||||
|
#sidebar-box {
|
||||||
|
}
|
||||||
|
|
||||||
|
#sidebar-box:-moz-lwtheme-darktext,
|
||||||
|
#sidebar-box:-moz-lwtheme-brighttext {
|
||||||
|
--sidebar-background-color: var(--bf-sidebar-bg) !important;
|
||||||
|
--sidebar-text-color: var(--bf-sidebar-color) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#sidebar,
|
||||||
|
.sidebar-panel {
|
||||||
|
background: transparent !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Sidebar searchbar */
|
||||||
|
#sidebar-search-container #search-box {
|
||||||
|
border: none !important;
|
||||||
|
padding: 6px !important;
|
||||||
|
border-radius: var(--bf-sidebar-searchbar-radius) !important;
|
||||||
|
}
|
||||||
240
parts/tabbar.css
Normal file
240
parts/tabbar.css
Normal file
@ -0,0 +1,240 @@
|
|||||||
|
/*
|
||||||
|
░▀█▀░█▀█░█▀▄░█▀▄░█▀█░█▀▄
|
||||||
|
░░█░░█▀█░█▀▄░█▀▄░█▀█░█▀▄
|
||||||
|
░░▀░░▀░▀░▀▀░░▀▀░░▀░▀░▀░▀
|
||||||
|
|
||||||
|
The tabs container
|
||||||
|
*/
|
||||||
|
|
||||||
|
/* Move tab bar beneath the url bar */
|
||||||
|
#titlebar {
|
||||||
|
/*
|
||||||
|
Set the value to 3 to move the tabbar below the navbar
|
||||||
|
*/
|
||||||
|
-moz-box-ordinal-group: 1 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#titlebar::after {
|
||||||
|
border-bottom: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbar-items {
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Transparent tabs */
|
||||||
|
.toolbar-items:-moz-lwtheme-darktext,
|
||||||
|
.toolbar-items:-moz-lwtheme-brighttext {
|
||||||
|
background-color: transparent !important;
|
||||||
|
-moz-appearance: var(--bf-moz-appearance) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Set minimum height for tab bar */
|
||||||
|
#tabbrowser-tabs {
|
||||||
|
--tab-min-height: 0;
|
||||||
|
margin: 6px 5px 6px 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Compact mode */
|
||||||
|
:root[uidensity="compact"] #tabbrowser-tabs {
|
||||||
|
margin: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Hide solo tab */
|
||||||
|
/*
|
||||||
|
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"]:only-of-type {
|
||||||
|
visibility: collapse;
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
|
||||||
|
/* Hide New Tab Button immediately next to solo tab */
|
||||||
|
/*
|
||||||
|
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"]:only-of-type + toolbarbutton {
|
||||||
|
visibility: collapse;
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
|
||||||
|
/* Stretch Tabs */
|
||||||
|
.tabbrowser-tab[fadein]:not([pinned]) {
|
||||||
|
max-width: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-background {
|
||||||
|
border: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-background:-moz-lwtheme-darktext,
|
||||||
|
.tab-background:-moz-lwtheme-brighttext {
|
||||||
|
background: transparent !important;
|
||||||
|
-moz-appearance: var(--bf-moz-appearance) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-background[selected="true"] {
|
||||||
|
background: var(--bf-tab-selected-bg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-background:not[visuallyselected] {
|
||||||
|
background: var(--bf-tab-selected-bg) !important;
|
||||||
|
opacity: 0.5 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Remove the all the "lines" in tab sides */
|
||||||
|
/*
|
||||||
|
.tabbrowser-tab::after,
|
||||||
|
.tabbrowser-tab::before {
|
||||||
|
border-left: none !important;
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
|
||||||
|
/* Remove the lines on the side of the selected tab */
|
||||||
|
.tabbrowser-tab[beforeselected-visible="true"]::after,
|
||||||
|
.tabbrowser-tab[beforeselected-visible="true"]::before,
|
||||||
|
.tabbrowser-tab[selected="true"]::after,
|
||||||
|
.tabbrowser-tab[selected="true"]::before {
|
||||||
|
border-left: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Style all the lines before and after selected tab */
|
||||||
|
.tabbrowser-tab::after,
|
||||||
|
.tabbrowser-tab::before {
|
||||||
|
border-width: 1px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabbrowser-arrowscrollbox {
|
||||||
|
margin-inline-start: 4px !important;
|
||||||
|
margin-inline-end: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-text {
|
||||||
|
font-weight: var(--bf-tab-font-weight);
|
||||||
|
font-size: var(--bf-tab-font-size) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Center all content */
|
||||||
|
.tab-content {
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: -1px;
|
||||||
|
min-width: 100% !important;
|
||||||
|
padding: 0 10px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* A way to center the label and icon while
|
||||||
|
the close button is positioned to the far right */
|
||||||
|
.tab-content::before{
|
||||||
|
content: "";
|
||||||
|
display: -moz-box;
|
||||||
|
-moz-box-flex: 1
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Tab close button */
|
||||||
|
.tab-close-button {
|
||||||
|
opacity: 1 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Prevent tab icons size breaking */
|
||||||
|
.tab-icon-image, .tab-icon-sound,
|
||||||
|
.tab-throbber, .tab-throbber-fallback,
|
||||||
|
.tab-close-button {
|
||||||
|
min-width: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Adjust tab label width */
|
||||||
|
.tab-label-container {
|
||||||
|
min-width: 3px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* If tab close button is not present, don't force favicon to the center */
|
||||||
|
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([selected="true"]) .tab-throbber,
|
||||||
|
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([selected="true"]) .tab-throbber-fallback,
|
||||||
|
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([selected="true"]):not([busy]) .tab-icon-image,
|
||||||
|
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([selected="true"]):not([image]) .tab-label-container {
|
||||||
|
margin-left: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Tab icon */
|
||||||
|
hbox.tab-content .tab-icon-image {
|
||||||
|
display: initial !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Show the icon of pinned tabs */
|
||||||
|
hbox.tab-content[pinned=true] .tab-icon-image {
|
||||||
|
display: initial !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Hide text of pinned tabs */
|
||||||
|
hbox.tab-content[pinned=true] .tab-text {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Hide the blue line on top of tab */
|
||||||
|
.tab-line {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-bottom-line {
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabbrowser-tab {
|
||||||
|
border-radius: var(--bf-tab-border-radius) !important;
|
||||||
|
border-width: 0;
|
||||||
|
height: var(--bf-tab-height) !important;
|
||||||
|
overflow: hidden;
|
||||||
|
margin-top: 0 !important;
|
||||||
|
margin-bottom: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
:root[uidensity="compact"] .tabbrowser-tab {
|
||||||
|
border-radius: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabbrowser-tab:hover {
|
||||||
|
box-shadow: 0 1px 4px rgba(0,0,0,.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Set color scheme */
|
||||||
|
.tabbrowser-tab:hover:-moz-lwtheme-darktext,
|
||||||
|
.tabbrowser-tab:hover:-moz-lwtheme-brighttext {
|
||||||
|
background: var(--bf-hover-bg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Audio playing background */
|
||||||
|
.tabbrowser-tab[soundplaying="true"] {
|
||||||
|
background-color: var(--bf-tab-soundplaying-bg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#tabbrowser-tabs {
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Audio Icon */
|
||||||
|
.tab-icon-sound {
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Center pinned tab stack(Contains icon) if #tabbrowser-tabs[positionpinnedtabs=true] */
|
||||||
|
#tabbrowser-tabs[positionpinnedtabs=true] .tabbrowser-tab[pinned=true] .tab-stack {
|
||||||
|
position: relative !important;
|
||||||
|
top: 50% !important;
|
||||||
|
transform: translateY(-50%) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.private-browsing-indicator {
|
||||||
|
display: block;
|
||||||
|
background: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Remove hover effects on tab bar buttons */
|
||||||
|
#TabsToolbar {
|
||||||
|
--toolbarbutton-active-background: transparent !important;
|
||||||
|
--toolbarbutton-hover-background: transparent !important;
|
||||||
|
-moz-appearance: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Left to Right Alignment of tabs toolbar */
|
||||||
|
/* #TabsToolbar {
|
||||||
|
direction: rtl;
|
||||||
|
}
|
||||||
|
|
||||||
|
#tabbrowser-tabs {
|
||||||
|
direction: ltr;
|
||||||
|
}
|
||||||
|
*/
|
||||||
87
parts/toolbar.css
Normal file
87
parts/toolbar.css
Normal file
@ -0,0 +1,87 @@
|
|||||||
|
/*
|
||||||
|
░▀█▀░█▀█░█▀█░█░░░█▀▄░█▀█░█▀▄
|
||||||
|
░░█░░█░█░█░█░█░░░█▀▄░█▀█░█▀▄
|
||||||
|
░░▀░░▀▀▀░▀▀▀░▀▀▀░▀▀░░▀░▀░▀░▀
|
||||||
|
|
||||||
|
Contains navbar, urlbar, and etc.
|
||||||
|
*/
|
||||||
|
|
||||||
|
.browser-toolbar {
|
||||||
|
}
|
||||||
|
|
||||||
|
.browser-toolbar:-moz-lwtheme-darktext,
|
||||||
|
.browser-toolbar:-moz-lwtheme-brighttext {
|
||||||
|
background: var(--bf-tab-toolbar-bg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
toolbar {
|
||||||
|
background-image: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
toolbar#nav-bar {
|
||||||
|
padding: var(--bf-navbar-padding) !important;
|
||||||
|
|
||||||
|
/* Remove horizontal line on navbar */
|
||||||
|
box-shadow: none !important;
|
||||||
|
border-top: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Set color schemes for #nav-bar */
|
||||||
|
toolbar#nav-bar:-moz-lwtheme-darktext,
|
||||||
|
toolbar#nav-bar:-moz-lwtheme-brighttext {
|
||||||
|
background: var(--bf-navbar-bg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
toolbarbutton {
|
||||||
|
box-shadow: none !important;
|
||||||
|
margin-left: 2px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbarbutton-1 {
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Set color schemes for #nav-bar */
|
||||||
|
.toolbarbutton-1:-moz-lwtheme-darktext,
|
||||||
|
.toolbarbutton-1:-moz-lwtheme-brighttext {
|
||||||
|
--toolbarbutton-hover-background: var(--bf-hover-bg) !important;
|
||||||
|
--toolbarbutton-active-background: var(--bf-active-bg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#searchbar {
|
||||||
|
border: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Set color scheme */
|
||||||
|
#searchbar:-moz-lwtheme-darktext,
|
||||||
|
#searchbar:-moz-lwtheme-brighttext {
|
||||||
|
background: var(--bf-bg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchbar-textbox {
|
||||||
|
font-weight: 700 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#navigator-toolbox,
|
||||||
|
toolbaritem {
|
||||||
|
border: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#navigator-toolbox::after {
|
||||||
|
border-bottom: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbarbutton-text {
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Set color scheme */
|
||||||
|
.toolbarbutton-text:-moz-lwtheme-darktext,
|
||||||
|
.toolbarbutton-text:-moz-lwtheme-brighttext {
|
||||||
|
color: var(--bf-icon-color) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Back button */
|
||||||
|
#back-button > .toolbarbutton-icon {
|
||||||
|
--backbutton-background: transparent !important;
|
||||||
|
border: none !important;
|
||||||
|
-moz-appearance: var(--bf-moz-appearance) !important;
|
||||||
|
}
|
||||||
228
parts/urlbar.css
Normal file
228
parts/urlbar.css
Normal file
@ -0,0 +1,228 @@
|
|||||||
|
/*
|
||||||
|
░█░█░█▀▄░█░░░█▀▄░█▀█░█▀▄
|
||||||
|
░█░█░█▀▄░█░░░█▀▄░█▀█░█▀▄
|
||||||
|
░▀▀▀░▀░▀░▀▀▀░▀▀░░▀░▀░▀░▀
|
||||||
|
|
||||||
|
URL bar
|
||||||
|
*/
|
||||||
|
|
||||||
|
/* URL bar max-width and centered hack */
|
||||||
|
#urlbar {
|
||||||
|
max-width: 70% !important;
|
||||||
|
margin: 0 15% !important;
|
||||||
|
|
||||||
|
/* URL bar and toolbar height */
|
||||||
|
--urlbar-height: 36px !important;
|
||||||
|
--urlbar-toolbar-height: 40px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* URL bar and toolbar height if compact mode */
|
||||||
|
:root[uidensity="compact"] #urlbar {
|
||||||
|
--urlbar-height: 30px !important;
|
||||||
|
--urlbar-toolbar-height: 34px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#urlbar-input:focus {
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Set color scheme */
|
||||||
|
#urlbar-input:focus:-moz-lwtheme-darktext,
|
||||||
|
#urlbar-input:focus:-moz-lwtheme-brighttext {
|
||||||
|
color: var(--bf-urlbar-focused-color) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#urlbar-background {
|
||||||
|
border-radius: var(--bf-urlbar-radius) !important;
|
||||||
|
border: none !important
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Set color scheme */
|
||||||
|
#urlbar-background:-moz-lwtheme-darktext,
|
||||||
|
#urlbar-background:-moz-lwtheme-brighttext {
|
||||||
|
background: var(--bf-urlbar-bg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.urlbar-icon:not([disabled]):hover,
|
||||||
|
.urlbar-icon-wrapper:not([disabled]):hover {
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Set color scheme */
|
||||||
|
.urlbar-icon:not([disabled]):hover:-moz-lwtheme-darktext,
|
||||||
|
.urlbar-icon:not([disabled]):hover:-moz-lwtheme-brighttext,
|
||||||
|
.urlbar-icon-wrapper:not([disabled]):hover:-moz-lwtheme-darktext,
|
||||||
|
.urlbar-icon-wrapper:not([disabled]):hover:-moz-lwtheme-brighttext {
|
||||||
|
background: var(--bf-hover-bg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.urlbar-icon[open],
|
||||||
|
.urlbar-icon-wrapper[open],
|
||||||
|
.urlbar-icon:not([disabled]):hover:active,
|
||||||
|
.urlbar-icon-wrapper:hover:active {
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Set color scheme */
|
||||||
|
.urlbar-icon[open]:-moz-lwtheme-darktext,
|
||||||
|
.urlbar-icon[open]:-moz-lwtheme-brighttext,
|
||||||
|
.urlbar-icon-wrapper[open]:-moz-lwtheme-darktext,
|
||||||
|
.urlbar-icon-wrapper[open]:-moz-lwtheme-brighttext,
|
||||||
|
.urlbar-icon:not([disabled]):hover:active:-moz-lwtheme-darktext,
|
||||||
|
.urlbar-icon:not([disabled]):hover:active:-moz-lwtheme-brighttext,
|
||||||
|
.urlbar-icon-wrapper:hover:active:-moz-lwtheme-darktext,
|
||||||
|
.urlbar-icon-wrapper:hover:active:-moz-lwtheme-brighttext {
|
||||||
|
background: var(--bf-hover-bg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.urlbar-icon-wrapper[open] > .urlbar-icon,
|
||||||
|
.urlbar-icon-wrapper > .urlbar-icon:hover,
|
||||||
|
.urlbar-icon-wrapper > .urlbar-icon:hover:active {
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Set color scheme */
|
||||||
|
.urlbar-icon-wrapper[open] > .urlbar-icon:-moz-lwtheme-darktext,
|
||||||
|
.urlbar-icon-wrapper[open] > .urlbar-icon:-moz-lwtheme-brighttext,
|
||||||
|
.urlbar-icon-wrapper > .urlbar-icon:hover:-moz-lwtheme-darktext,
|
||||||
|
.urlbar-icon-wrapper > .urlbar-icon:hover:-moz-lwtheme-brighttext,
|
||||||
|
.urlbar-icon-wrapper > .urlbar-icon:hover:active:-moz-lwtheme-darktext,
|
||||||
|
.urlbar-icon-wrapper > .urlbar-icon:hover:active:-moz-lwtheme-brighttext{
|
||||||
|
background: var(--bf-hover-bg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#urlbar[breakout-extend="true"]:not([open="true"]) > #urlbar-background {
|
||||||
|
box-shadow: none !important;
|
||||||
|
display: none !important;
|
||||||
|
-moz-appearance: var(--bf-moz-appearance) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#urlbar[open="true"] > #urlbar-background {
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Set color scheme */
|
||||||
|
#urlbar[open="true"] > #urlbar-background:-moz-lwtheme-darktext,
|
||||||
|
#urlbar[open="true"] > #urlbar-background:-moz-lwtheme-brighttext {
|
||||||
|
background: var(--bf-urlbar-active-bg) !important;
|
||||||
|
backdrop-filter: blur(var(--bf-backdrop-blur)) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.urlbar-icon {
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Set color scheme */
|
||||||
|
.urlbar-icon:-moz-lwtheme-darktext,
|
||||||
|
.urlbar-icon:-moz-lwtheme-brighttext {
|
||||||
|
color: var(--bf-icon-color) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.urlbar-icon > image {
|
||||||
|
fill: #ff00ff !important;
|
||||||
|
color: #ff00ff !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.urlbarView-favicon,
|
||||||
|
.urlbarView-type-icon {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.urlbarView-row[type="bookmark"] > span {
|
||||||
|
color: var(--bf-urlbar-bookmark-color) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.urlbarView-row[type="switchtab"] > span .urlbarView-url {
|
||||||
|
color: var(--bf-urlbar-switch-tab-color) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#urlbar-results {
|
||||||
|
font-weight: var(--bf-urlbar-results-font-weight);
|
||||||
|
font-size: var(--bf-urlbar-results-font-size) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Hover background color */
|
||||||
|
.urlbarView-row-inner:hover {
|
||||||
|
background: var(--bf-accent-bg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.urlbarView-url, .search-panel-one-offs-container {
|
||||||
|
font-weight: var(--bf-urlbar-results-font-weight);
|
||||||
|
font-size: var(--bf-urlbar-font-size) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#urlbar-input {
|
||||||
|
font-size: var(--bf-urlbar-font-size) !important;
|
||||||
|
font-weight: var(--bf-urlbar-font-weight)!important;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Urlbar buttons */
|
||||||
|
.urlbar-icon,
|
||||||
|
.urlbar-page-action {
|
||||||
|
border-radius: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* URL bar hightlight color */
|
||||||
|
::-moz-selection {
|
||||||
|
background-color: var(--bf-urlbar-hightlight-bg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Bookmark button - Star button */
|
||||||
|
#star-button {
|
||||||
|
/* URL bar bookmark button */
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#star-button:hover:not(.no-hover):not([open=true]) {
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Set color scheme */
|
||||||
|
#star-button:hover:not(.no-hover):not([open=true]):-moz-lwtheme-darktext,
|
||||||
|
#star-button:hover:not(.no-hover):not([open=true]):-moz-lwtheme-brighttext {
|
||||||
|
background: var(--bf-hover-bg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#star-button:hover:active:not(.no-hover),
|
||||||
|
#star-button[open=true] {
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Set color scheme */
|
||||||
|
#star-button:hover:active:not(.no-hover):-moz-lwtheme-darktext,
|
||||||
|
#star-button:hover:active:not(.no-hover):-moz-lwtheme-brighttext,
|
||||||
|
#star-button[open=true]:-moz-lwtheme-darktext,
|
||||||
|
#star-button[open=true]:-moz-lwtheme-brighttext {
|
||||||
|
background: var(--bf-hover-bg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Tracking */
|
||||||
|
#tracking-protection-icon-container {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Identity */
|
||||||
|
#identity-box {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#identity-box:hover:not(.no-hover):not([open=true]),
|
||||||
|
#tracking-protection-icon-container:hover:not(.no-hover):not([open=true]) {
|
||||||
|
}
|
||||||
|
|
||||||
|
#identity-box:hover:not(.no-hover):not([open=true]):-moz-lwtheme-darktext,
|
||||||
|
#identity-box:hover:not(.no-hover):not([open=true]):-moz-lwtheme-brighttext,
|
||||||
|
#tracking-protection-icon-container:hover:not(.no-hover):not([open=true]):-moz-lwtheme-darktext,
|
||||||
|
#tracking-protection-icon-container:hover:not(.no-hover):not([open=true]):-moz-lwtheme-brighttext {
|
||||||
|
background: var(--bf-hover-bg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#identity-box:hover:active:not(.no-hover),
|
||||||
|
#identity-box[open=true],
|
||||||
|
#tracking-protection-icon-container:hover:active:not(.no-hover),
|
||||||
|
#tracking-protection-icon-container[open=true] {
|
||||||
|
}
|
||||||
|
|
||||||
|
#identity-box:hover:active:not(.no-hover):-moz-lwtheme-darktext,
|
||||||
|
#identity-box:hover:active:not(.no-hover):-moz-lwtheme-brighttext,
|
||||||
|
#identity-box[open=true]:-moz-lwtheme-darktext,
|
||||||
|
#identity-box[open=true]:-moz-lwtheme-brighttext,
|
||||||
|
#tracking-protection-icon-container:hover:active:not(.no-hover):-moz-lwtheme-darktext,
|
||||||
|
#tracking-protection-icon-container:hover:active:not(.no-hover):-moz-lwtheme-brighttext,
|
||||||
|
#tracking-protection-icon-container[open=true]:-moz-lwtheme-darktext,
|
||||||
|
#tracking-protection-icon-container[open=true]:-moz-lwtheme-brighttext {
|
||||||
|
background: var(--bf-hover-bg) !important;
|
||||||
|
}
|
||||||
28
parts/window-controls.css
Normal file
28
parts/window-controls.css
Normal file
@ -0,0 +1,28 @@
|
|||||||
|
|
||||||
|
|
||||||
|
/*
|
||||||
|
░█░█░▀█▀░█▀█░█▀▄░█▀█░█░█░█▀▄░█░█░▀█▀░▀█▀░█▀█░█▀█░█▀▀
|
||||||
|
░█▄█░░█░░█░█░█░█░█░█░█▄█░█▀▄░█░█░░█░░░█░░█░█░█░█░▀▀█
|
||||||
|
░▀░▀░▀▀▀░▀░▀░▀▀░░▀▀▀░▀░▀░▀▀░░▀▀▀░░▀░░░▀░░▀▀▀░▀░▀░▀▀▀
|
||||||
|
|
||||||
|
The control buttons. Contains, close, minimize, and maximize buttons
|
||||||
|
*/
|
||||||
|
|
||||||
|
#autohide-context {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#window-controls[hidden="true"] {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#window-controls[hidden="false"] {
|
||||||
|
display: inline-flex !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Hide titlebar-buttonbox if there's single tab */
|
||||||
|
/*
|
||||||
|
:root[tabsintitlebar][sizemode="maximized"] #titlebar .titlebar-buttonbox-container {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
Before Width: | Height: | Size: 140 KiB After Width: | Height: | Size: 140 KiB |
BIN
scrots/solid.webp
Normal file
BIN
scrots/solid.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 154 KiB |
878
userChrome.css
878
userChrome.css
@ -1,868 +1,34 @@
|
|||||||
:root {
|
|
||||||
/* All the CSS variables here are global */
|
|
||||||
/* These applies to all colorschemes */
|
|
||||||
|
|
||||||
/* If windows - `-moz-win-glass`, if macOS - `-moz-mac-vibrancy-dark` */
|
|
||||||
--bf-moz-appearance: -moz-win-glass !important;
|
|
||||||
|
|
||||||
--bf-backdrop-blur: 6px;
|
|
||||||
|
|
||||||
--bf-sidebar-searchbar-radius: 6px;
|
|
||||||
|
|
||||||
--bf-accent-bg: #4C5FF9CC;
|
|
||||||
--bf-blank-page-bg: #252525;
|
|
||||||
|
|
||||||
--bf-urlbar-hightlight-bg: var(--bf-accent-bg);
|
|
||||||
--bf-urlbar-radius: 9px;
|
|
||||||
--bf-urlbar-results-font-size: 12pt;
|
|
||||||
--bf-urlbar-results-font-weight: 550;
|
|
||||||
--bf-urlbar-font-size: 12pt;
|
|
||||||
--bf-urlbar-font-weight: 500;
|
|
||||||
--bf-urlbar-switch-tab-color: #6498EF;
|
|
||||||
--bf-urlbar-bookmark-color: #53E2AE;
|
|
||||||
|
|
||||||
--bf-navbar-padding: 6px;
|
|
||||||
|
|
||||||
--bf-tab-selected-bg: #77777788;
|
|
||||||
--bf-tab-font-size: 11pt;
|
|
||||||
--bf-tab-font-weight: 400;
|
|
||||||
--bf-tab-height: 36px;
|
|
||||||
--bf-tab-border-radius: 6px;
|
|
||||||
--bf-tab-soundplaying-bg: #985EFFCC;
|
|
||||||
|
|
||||||
--toolbar-bgcolor: transparent !important;
|
|
||||||
--urlbar-separator-color: transparent !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Light Mode */
|
|
||||||
:root:-moz-lwtheme-darktext {
|
|
||||||
--bf-main-window: transparent;
|
|
||||||
--bf-bg: #F2F2F266;
|
|
||||||
--bf-color: #0A0A0A;
|
|
||||||
|
|
||||||
--bf-hover-bg: #1A1A1A33;
|
|
||||||
--bf-active-bg: #1A1A1A66;
|
|
||||||
|
|
||||||
--bf-icon-color: #0A0A0A;
|
|
||||||
--bf-tab-toolbar-bg: #F2F2F2AA;
|
|
||||||
--bf-tab-selected-bg: #00000022;
|
|
||||||
--bf-navbar-bg: var(--bf-bg);
|
|
||||||
--bf-urlbar-bg: var(--bf-bg);
|
|
||||||
--bf-urlbar-active-bg: var(--bf-bg);
|
|
||||||
--bf-urlbar-focused-color: var(--bf-color);
|
|
||||||
|
|
||||||
--bf-sidebar-bg: var(--bf-bg);
|
|
||||||
--bf-sidebar-color: var(--bf-color);
|
|
||||||
|
|
||||||
--bf-menupopup-bg: #F2F2F2AA;
|
|
||||||
--bf-menupopup-color: var(--bf-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Dark Mode */
|
|
||||||
:root:-moz-lwtheme-brighttext {
|
|
||||||
--bf-main-window: transparent;
|
|
||||||
--bf-bg: #00000066;
|
|
||||||
--bf-color: #F2F2F2;
|
|
||||||
|
|
||||||
--bf-hover-bg: #F2F2F233;
|
|
||||||
--bf-active-bg: #F2F2F266;
|
|
||||||
|
|
||||||
--bf-icon-color: #F2F2F2;
|
|
||||||
--bf-tab-toolbar-bg: #000000AA;
|
|
||||||
--bf-tab-selected-bg: #F2F2F210;
|
|
||||||
--bf-navbar-bg: var(--bf-bg);
|
|
||||||
--bf-urlbar-bg: var(--bf-bg);
|
|
||||||
--bf-urlbar-active-bg: var(--bf-bg);
|
|
||||||
--bf-urlbar-focused-color: var(--bf-color);
|
|
||||||
|
|
||||||
--bf-sidebar-bg: var(--bf-bg);
|
|
||||||
--bf-sidebar-color: var(--bf-color);
|
|
||||||
|
|
||||||
--bf-menupopup-bg: #000000AA;
|
|
||||||
--bf-menupopup-color: var(--bf-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
/*
|
||||||
░▀█▀░█▀▄░█▀█░█▀█░█▀▀░█▀█░█▀█░█▀▄░█▀▀░█▀█░█▀▀░█░█
|
░█▀▀░█▀█░█░░░█▀█░█▀▄░█▀▀
|
||||||
░░█░░█▀▄░█▀█░█░█░▀▀█░█▀▀░█▀█░█▀▄░█▀▀░█░█░█░░░░█░
|
░█░░░█░█░█░░░█░█░█▀▄░▀▀█
|
||||||
░░▀░░▀░▀░▀░▀░▀░▀░▀▀▀░▀░░░▀░▀░▀░▀░▀▀▀░▀░▀░▀▀▀░░▀░
|
░▀▀▀░▀▀▀░▀▀▀░▀▀▀░▀░▀░▀▀▀
|
||||||
|
|
||||||
Main window
|
Load preferred colorscheme
|
||||||
*/
|
|
||||||
#main-window {
|
|
||||||
font-kerning: normal;
|
|
||||||
border: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Add transparency to light and dark color schemes */
|
|
||||||
#main-window:-moz-lwtheme-brighttext,
|
|
||||||
#main-window:-moz-lwtheme-darktext {
|
|
||||||
background: var(--bf-main-window) !important;
|
|
||||||
-moz-appearance: var(--bf-moz-appearance) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
|
||||||
░█▀▀░█▀█░█▀█░▀█▀
|
|
||||||
░█▀▀░█░█░█░█░░█░
|
|
||||||
░▀░░░▀▀▀░▀░▀░░▀░
|
|
||||||
|
|
||||||
I'm not sure if this does something
|
|
||||||
*/
|
*/
|
||||||
|
|
||||||
* {
|
/* Blurred Color Scheme */
|
||||||
-webkit-font-smoothing: antialiased;
|
@import url('colors/blurred.css');
|
||||||
-moz-osx-font-smoothing: grayscale;
|
|
||||||
text-rendering: optimizeLegibility;
|
|
||||||
font-variant-ligatures: none;
|
|
||||||
font-kerning: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
/* Solid Color Scheme */
|
||||||
/*
|
/*
|
||||||
░▀█▀░█▀█░█▀█░█░░░█▀▄░█▀█░█▀▄
|
@import url('colors/solid.css');
|
||||||
░░█░░█░█░█░█░█░░░█▀▄░█▀█░█▀▄
|
|
||||||
░░▀░░▀▀▀░▀▀▀░▀▀▀░▀▀░░▀░▀░▀░▀
|
|
||||||
|
|
||||||
Contains navbar, urlbar, and etc.
|
|
||||||
*/
|
|
||||||
|
|
||||||
.browser-toolbar {
|
|
||||||
}
|
|
||||||
|
|
||||||
.browser-toolbar:-moz-lwtheme-darktext,
|
|
||||||
.browser-toolbar:-moz-lwtheme-brighttext {
|
|
||||||
background: var(--bf-tab-toolbar-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
toolbar {
|
|
||||||
background-image: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
toolbar#nav-bar {
|
|
||||||
padding: var(--bf-navbar-padding) !important;
|
|
||||||
|
|
||||||
/* Remove horizontal line on navbar */
|
|
||||||
box-shadow: none !important;
|
|
||||||
border-top: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Set color schemes for #nav-bar */
|
|
||||||
toolbar#nav-bar:-moz-lwtheme-darktext,
|
|
||||||
toolbar#nav-bar:-moz-lwtheme-brighttext {
|
|
||||||
background: var(--bf-navbar-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
toolbarbutton {
|
|
||||||
box-shadow: none !important;
|
|
||||||
margin-left: 2px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.toolbarbutton-1 {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Set color schemes for #nav-bar */
|
|
||||||
.toolbarbutton-1:-moz-lwtheme-darktext,
|
|
||||||
.toolbarbutton-1:-moz-lwtheme-brighttext {
|
|
||||||
--toolbarbutton-hover-background: var(--bf-hover-bg) !important;
|
|
||||||
--toolbarbutton-active-background: var(--bf-active-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* URL bar max-width and centered hack */
|
|
||||||
#urlbar {
|
|
||||||
max-width: 70% !important;
|
|
||||||
margin: 0 15% !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* URL bar and toolbar height */
|
|
||||||
#urlbar {
|
|
||||||
--urlbar-height: 36px !important;
|
|
||||||
--urlbar-toolbar-height: 40px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* URL bar and toolbar height if compact mode */
|
|
||||||
:root[uidensity="compact"] #urlbar {
|
|
||||||
--urlbar-height: 30px !important;
|
|
||||||
--urlbar-toolbar-height: 34px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#urlbar-input:focus {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Set color scheme */
|
|
||||||
#urlbar-input:focus:-moz-lwtheme-darktext,
|
|
||||||
#urlbar-input:focus:-moz-lwtheme-brighttext {
|
|
||||||
color: var(--bf-urlbar-focused-color) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#urlbar-background {
|
|
||||||
border-radius: var(--bf-urlbar-radius) !important;
|
|
||||||
border: none !important
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Set color scheme */
|
|
||||||
#urlbar-background:-moz-lwtheme-darktext,
|
|
||||||
#urlbar-background:-moz-lwtheme-brighttext {
|
|
||||||
background: var(--bf-urlbar-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.urlbar-icon:not([disabled]):hover,
|
|
||||||
.urlbar-icon-wrapper:not([disabled]):hover {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Set color scheme */
|
|
||||||
.urlbar-icon:not([disabled]):hover:-moz-lwtheme-darktext,
|
|
||||||
.urlbar-icon:not([disabled]):hover:-moz-lwtheme-brighttext,
|
|
||||||
.urlbar-icon-wrapper:not([disabled]):hover:-moz-lwtheme-darktext,
|
|
||||||
.urlbar-icon-wrapper:not([disabled]):hover:-moz-lwtheme-brighttext {
|
|
||||||
background: var(--bf-hover-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.urlbar-icon[open],
|
|
||||||
.urlbar-icon-wrapper[open],
|
|
||||||
.urlbar-icon:not([disabled]):hover:active,
|
|
||||||
.urlbar-icon-wrapper:hover:active {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Set color scheme */
|
|
||||||
.urlbar-icon[open]:-moz-lwtheme-darktext,
|
|
||||||
.urlbar-icon[open]:-moz-lwtheme-brighttext,
|
|
||||||
.urlbar-icon-wrapper[open]:-moz-lwtheme-darktext,
|
|
||||||
.urlbar-icon-wrapper[open]:-moz-lwtheme-brighttext,
|
|
||||||
.urlbar-icon:not([disabled]):hover:active:-moz-lwtheme-darktext,
|
|
||||||
.urlbar-icon:not([disabled]):hover:active:-moz-lwtheme-brighttext,
|
|
||||||
.urlbar-icon-wrapper:hover:active:-moz-lwtheme-darktext,
|
|
||||||
.urlbar-icon-wrapper:hover:active:-moz-lwtheme-brighttext {
|
|
||||||
background: var(--bf-hover-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.urlbar-icon-wrapper[open] > .urlbar-icon,
|
|
||||||
.urlbar-icon-wrapper > .urlbar-icon:hover,
|
|
||||||
.urlbar-icon-wrapper > .urlbar-icon:hover:active {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Set color scheme */
|
|
||||||
.urlbar-icon-wrapper[open] > .urlbar-icon:-moz-lwtheme-darktext,
|
|
||||||
.urlbar-icon-wrapper[open] > .urlbar-icon:-moz-lwtheme-brighttext,
|
|
||||||
.urlbar-icon-wrapper > .urlbar-icon:hover:-moz-lwtheme-darktext,
|
|
||||||
.urlbar-icon-wrapper > .urlbar-icon:hover:-moz-lwtheme-brighttext,
|
|
||||||
.urlbar-icon-wrapper > .urlbar-icon:hover:active:-moz-lwtheme-darktext,
|
|
||||||
.urlbar-icon-wrapper > .urlbar-icon:hover:active:-moz-lwtheme-brighttext{
|
|
||||||
background: var(--bf-hover-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#urlbar[breakout-extend="true"]:not([open="true"]) > #urlbar-background {
|
|
||||||
box-shadow: none !important;
|
|
||||||
display: none !important;
|
|
||||||
-moz-appearance: var(--bf-moz-appearance) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#urlbar[open="true"] > #urlbar-background {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Set color scheme */
|
|
||||||
#urlbar[open="true"] > #urlbar-background:-moz-lwtheme-darktext,
|
|
||||||
#urlbar[open="true"] > #urlbar-background:-moz-lwtheme-brighttext {
|
|
||||||
background: var(--bf-urlbar-active-bg) !important;
|
|
||||||
backdrop-filter: blur(var(--bf-backdrop-blur)) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.urlbar-icon {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Set color scheme */
|
|
||||||
.urlbar-icon:-moz-lwtheme-darktext,
|
|
||||||
.urlbar-icon:-moz-lwtheme-brighttext {
|
|
||||||
color: var(--bf-icon-color) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.urlbar-icon > image {
|
|
||||||
fill: #ff00ff !important;
|
|
||||||
color: #ff00ff !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.urlbarView-favicon,
|
|
||||||
.urlbarView-type-icon {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.urlbarView-row[type="bookmark"] > span {
|
|
||||||
color: var(--bf-urlbar-bookmark-color) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.urlbarView-row[type="switchtab"] > span .urlbarView-url {
|
|
||||||
color: var(--bf-urlbar-switch-tab-color) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#urlbar-results {
|
|
||||||
font-weight: var(--bf-urlbar-results-font-weight);
|
|
||||||
font-size: var(--bf-urlbar-results-font-size) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Hover background color */
|
|
||||||
.urlbarView-row-inner:hover {
|
|
||||||
background: var(--bf-accent-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.urlbarView-url, .search-panel-one-offs-container {
|
|
||||||
font-weight: var(--bf-urlbar-results-font-weight);
|
|
||||||
font-size: var(--bf-urlbar-font-size) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#urlbar-input {
|
|
||||||
font-size: var(--bf-urlbar-font-size) !important;
|
|
||||||
font-weight: var(--bf-urlbar-font-weight)!important;
|
|
||||||
text-align: center !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Urlbar buttons */
|
|
||||||
.urlbar-icon,
|
|
||||||
.urlbar-page-action {
|
|
||||||
border-radius: 6px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#searchbar {
|
|
||||||
border: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Set color scheme */
|
|
||||||
#searchbar:-moz-lwtheme-darktext,
|
|
||||||
#searchbar:-moz-lwtheme-brighttext {
|
|
||||||
background: var(--bf-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.searchbar-textbox {
|
|
||||||
font-weight: 700 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* URL bar hightlight color */
|
|
||||||
::-moz-selection {
|
|
||||||
background-color: var(--bf-urlbar-hightlight-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Bookmark button - Star button */
|
|
||||||
#star-button {
|
|
||||||
/* URL bar bookmark button */
|
|
||||||
display: block !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#star-button:hover:not(.no-hover):not([open=true]) {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Set color scheme */
|
|
||||||
#star-button:hover:not(.no-hover):not([open=true]):-moz-lwtheme-darktext,
|
|
||||||
#star-button:hover:not(.no-hover):not([open=true]):-moz-lwtheme-brighttext {
|
|
||||||
background: var(--bf-hover-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#star-button:hover:active:not(.no-hover),
|
|
||||||
#star-button[open=true] {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Set color scheme */
|
|
||||||
#star-button:hover:active:not(.no-hover):-moz-lwtheme-darktext,
|
|
||||||
#star-button:hover:active:not(.no-hover):-moz-lwtheme-brighttext,
|
|
||||||
#star-button[open=true]:-moz-lwtheme-darktext,
|
|
||||||
#star-button[open=true]:-moz-lwtheme-brighttext {
|
|
||||||
background: var(--bf-hover-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#navigator-toolbox,
|
|
||||||
toolbaritem {
|
|
||||||
border: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#navigator-toolbox::after {
|
|
||||||
border-bottom: 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.toolbarbutton-text {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Set color scheme */
|
|
||||||
.toolbarbutton-text:-moz-lwtheme-darktext,
|
|
||||||
.toolbarbutton-text:-moz-lwtheme-brighttext {
|
|
||||||
color: var(--bf-icon-color) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Back button */
|
|
||||||
#back-button > .toolbarbutton-icon {
|
|
||||||
--backbutton-background: transparent !important;
|
|
||||||
border: none !important;
|
|
||||||
-moz-appearance: var(--bf-moz-appearance) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Tracking */
|
|
||||||
#tracking-protection-icon-container {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Identity */
|
|
||||||
#identity-box {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#identity-box:hover:not(.no-hover):not([open=true]),
|
|
||||||
#tracking-protection-icon-container:hover:not(.no-hover):not([open=true]) {
|
|
||||||
}
|
|
||||||
|
|
||||||
#identity-box:hover:not(.no-hover):not([open=true]):-moz-lwtheme-darktext,
|
|
||||||
#identity-box:hover:not(.no-hover):not([open=true]):-moz-lwtheme-brighttext,
|
|
||||||
#tracking-protection-icon-container:hover:not(.no-hover):not([open=true]):-moz-lwtheme-darktext,
|
|
||||||
#tracking-protection-icon-container:hover:not(.no-hover):not([open=true]):-moz-lwtheme-brighttext {
|
|
||||||
background: var(--bf-hover-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#identity-box:hover:active:not(.no-hover),
|
|
||||||
#identity-box[open=true],
|
|
||||||
#tracking-protection-icon-container:hover:active:not(.no-hover),
|
|
||||||
#tracking-protection-icon-container[open=true] {
|
|
||||||
}
|
|
||||||
|
|
||||||
#identity-box:hover:active:not(.no-hover):-moz-lwtheme-darktext,
|
|
||||||
#identity-box:hover:active:not(.no-hover):-moz-lwtheme-brighttext,
|
|
||||||
#identity-box[open=true]:-moz-lwtheme-darktext,
|
|
||||||
#identity-box[open=true]:-moz-lwtheme-brighttext,
|
|
||||||
#tracking-protection-icon-container:hover:active:not(.no-hover):-moz-lwtheme-darktext,
|
|
||||||
#tracking-protection-icon-container:hover:active:not(.no-hover):-moz-lwtheme-brighttext,
|
|
||||||
#tracking-protection-icon-container[open=true]:-moz-lwtheme-darktext,
|
|
||||||
#tracking-protection-icon-container[open=true]:-moz-lwtheme-brighttext {
|
|
||||||
background: var(--bf-hover-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
|
||||||
░▀█▀░█▀█░█▀▄░█▀▄░█▀█░█▀▄
|
|
||||||
░░█░░█▀█░█▀▄░█▀▄░█▀█░█▀▄
|
|
||||||
░░▀░░▀░▀░▀▀░░▀▀░░▀░▀░▀░▀
|
|
||||||
|
|
||||||
The tabs container
|
|
||||||
*/
|
|
||||||
|
|
||||||
/* Move tab bar beneath the url bar */
|
|
||||||
#titlebar {
|
|
||||||
/*
|
|
||||||
Set the value to 3 to move the tabbar below the navbar
|
|
||||||
*/
|
|
||||||
-moz-box-ordinal-group: 1 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#titlebar::after {
|
|
||||||
border-bottom: 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.toolbar-items {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Transparent tabs */
|
|
||||||
.toolbar-items:-moz-lwtheme-darktext,
|
|
||||||
.toolbar-items:-moz-lwtheme-brighttext {
|
|
||||||
background-color: transparent !important;
|
|
||||||
-moz-appearance: var(--bf-moz-appearance) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Set minimum height for tab bar */
|
|
||||||
#tabbrowser-tabs {
|
|
||||||
--tab-min-height: 0;
|
|
||||||
margin: 6px 5px 6px 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Compact mode */
|
|
||||||
:root[uidensity="compact"] #tabbrowser-tabs {
|
|
||||||
margin: 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Hide solo tab */
|
|
||||||
/*
|
|
||||||
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"]:only-of-type {
|
|
||||||
visibility: collapse;
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
|
|
||||||
/* Hide New Tab Button immediately next to solo tab */
|
|
||||||
/*
|
|
||||||
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"]:only-of-type + toolbarbutton {
|
|
||||||
visibility: collapse;
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
|
|
||||||
/* Stretch Tabs */
|
|
||||||
.tabbrowser-tab[fadein]:not([pinned]) {
|
|
||||||
max-width: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tab-background {
|
|
||||||
border: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tab-background:-moz-lwtheme-darktext,
|
|
||||||
.tab-background:-moz-lwtheme-brighttext {
|
|
||||||
background: transparent !important;
|
|
||||||
-moz-appearance: var(--bf-moz-appearance) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tab-background[selected="true"] {
|
|
||||||
background: var(--bf-tab-selected-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tab-background:not[visuallyselected] {
|
|
||||||
background: var(--bf-tab-selected-bg) !important;
|
|
||||||
opacity: 0.5 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Remove the all the "lines" in tab sides */
|
|
||||||
/*
|
|
||||||
.tabbrowser-tab::after,
|
|
||||||
.tabbrowser-tab::before {
|
|
||||||
border-left: none !important;
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
|
|
||||||
/* Remove the lines on the side of the selected tab */
|
|
||||||
.tabbrowser-tab[beforeselected-visible="true"]::after,
|
|
||||||
.tabbrowser-tab[beforeselected-visible="true"]::before,
|
|
||||||
.tabbrowser-tab[selected="true"]::after,
|
|
||||||
.tabbrowser-tab[selected="true"]::before {
|
|
||||||
border-left: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Style all the lines before and after selected tab */
|
|
||||||
.tabbrowser-tab::after,
|
|
||||||
.tabbrowser-tab::before {
|
|
||||||
border-width: 1px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tabbrowser-arrowscrollbox {
|
|
||||||
margin-inline-start: 4px !important;
|
|
||||||
margin-inline-end: 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tab-text {
|
|
||||||
font-weight: var(--bf-tab-font-weight);
|
|
||||||
font-size: var(--bf-tab-font-size) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Center all content */
|
|
||||||
.tab-content {
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
margin-top: -1px;
|
|
||||||
min-width: 100% !important;
|
|
||||||
padding: 0 10px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* A way to center the label and icon while
|
|
||||||
the close button is positioned to the far right */
|
|
||||||
.tab-content::before{
|
|
||||||
content: "";
|
|
||||||
display: -moz-box;
|
|
||||||
-moz-box-flex: 1
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Tab close button */
|
|
||||||
.tab-close-button {
|
|
||||||
opacity: 1 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Prevent tab icons size breaking */
|
|
||||||
.tab-icon-image, .tab-icon-sound,
|
|
||||||
.tab-throbber, .tab-throbber-fallback,
|
|
||||||
.tab-close-button {
|
|
||||||
min-width: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Adjust tab label width */
|
|
||||||
.tab-label-container {
|
|
||||||
min-width: 3px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* If tab close button is not present, don't force favicon to the center */
|
|
||||||
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([selected="true"]) .tab-throbber,
|
|
||||||
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([selected="true"]) .tab-throbber-fallback,
|
|
||||||
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([selected="true"]):not([busy]) .tab-icon-image,
|
|
||||||
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([selected="true"]):not([image]) .tab-label-container {
|
|
||||||
margin-left: 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Tab icon */
|
|
||||||
hbox.tab-content .tab-icon-image {
|
|
||||||
display: initial !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Show the icon of pinned tabs */
|
|
||||||
hbox.tab-content[pinned=true] .tab-icon-image {
|
|
||||||
display: initial !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Hide text of pinned tabs */
|
|
||||||
hbox.tab-content[pinned=true] .tab-text {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Hide the blue line on top of tab */
|
|
||||||
.tab-line {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tab-bottom-line {
|
|
||||||
}
|
|
||||||
|
|
||||||
.tabbrowser-tab {
|
|
||||||
border-radius: var(--bf-tab-border-radius) !important;
|
|
||||||
border-width: 0;
|
|
||||||
height: var(--bf-tab-height) !important;
|
|
||||||
overflow: hidden;
|
|
||||||
margin-top: 0 !important;
|
|
||||||
margin-bottom: 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
:root[uidensity="compact"] .tabbrowser-tab {
|
|
||||||
border-radius: 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tabbrowser-tab:hover {
|
|
||||||
box-shadow: 0 1px 4px rgba(0,0,0,.05);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Set color scheme */
|
|
||||||
.tabbrowser-tab:hover:-moz-lwtheme-darktext,
|
|
||||||
.tabbrowser-tab:hover:-moz-lwtheme-brighttext {
|
|
||||||
background: var(--bf-hover-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Audio playing background */
|
|
||||||
.tabbrowser-tab[soundplaying="true"] {
|
|
||||||
background-color: var(--bf-tab-soundplaying-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#tabbrowser-tabs {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Audio Icon */
|
|
||||||
.tab-icon-sound {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Center pinned tab stack(Contains icon) if #tabbrowser-tabs[positionpinnedtabs=true] */
|
|
||||||
#tabbrowser-tabs[positionpinnedtabs=true] .tabbrowser-tab[pinned=true] .tab-stack {
|
|
||||||
position: relative !important;
|
|
||||||
top: 50% !important;
|
|
||||||
transform: translateY(-50%) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.private-browsing-indicator {
|
|
||||||
display: block;
|
|
||||||
background: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Remove hover effects on tab bar buttons */
|
|
||||||
#TabsToolbar {
|
|
||||||
--toolbarbutton-active-background: transparent !important;
|
|
||||||
--toolbarbutton-hover-background: transparent !important;
|
|
||||||
-moz-appearance: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Left to Right Alignment of tabs toolbar */
|
|
||||||
/* #TabsToolbar {
|
|
||||||
direction: rtl;
|
|
||||||
}
|
|
||||||
|
|
||||||
#tabbrowser-tabs {
|
|
||||||
direction: ltr;
|
|
||||||
}
|
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/*
|
/*
|
||||||
░█▀▀░▀█▀░█▀▄░█▀▀░█▀▄░█▀█░█▀▄
|
░█░█░▀█▀░░░█▀▀░█░░░█▀▀░█▄█░█▀▀░█▀█░▀█▀░█▀▀
|
||||||
░▀▀█░░█░░█░█░█▀▀░█▀▄░█▀█░█▀▄
|
░█░█░░█░░░░█▀▀░█░░░█▀▀░█░█░█▀▀░█░█░░█░░▀▀█
|
||||||
░▀▀▀░▀▀▀░▀▀░░▀▀▀░▀▀░░▀░▀░▀░▀
|
░▀▀▀░▀▀▀░░░▀▀▀░▀▀▀░▀▀▀░▀░▀░▀▀▀░▀░▀░░▀░░▀▀▀
|
||||||
|
|
||||||
Sidebar
|
Load Customized Firefox's UI Elements
|
||||||
*/
|
*/
|
||||||
|
|
||||||
#sidebar-box {
|
@import url('parts/main-window.css');
|
||||||
}
|
@import url('parts/toolbar.css');
|
||||||
|
@import url('parts/tabbar.css');
|
||||||
#sidebar-box:-moz-lwtheme-darktext,
|
@import url('parts/urlbar.css');
|
||||||
#sidebar-box:-moz-lwtheme-brighttext {
|
@import url('parts/sidebar.css');
|
||||||
--sidebar-background-color: var(--bf-sidebar-bg) !important;
|
@import url('parts/arrow-panel.css');
|
||||||
--sidebar-text-color: var(--bf-sidebar-color) !important;
|
@import url('parts/findbar.css');
|
||||||
}
|
@import url('parts/context-menu.css');
|
||||||
|
@import url('parts/customization-window.css');
|
||||||
#sidebar,
|
@import url('parts/window-controls.css');
|
||||||
.sidebar-panel {
|
|
||||||
background: transparent !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Sidebar searchbar */
|
|
||||||
#sidebar-search-container #search-box {
|
|
||||||
border: none !important;
|
|
||||||
padding: 6px !important;
|
|
||||||
border-radius: var(--bf-sidebar-searchbar-radius) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
|
||||||
░█▀█░█▀▄░█▀▄░█▀█░█░█░█▀█░█▀█░█▀█░█▀▀░█░░
|
|
||||||
░█▀█░█▀▄░█▀▄░█░█░█▄█░█▀▀░█▀█░█░█░█▀▀░█░░
|
|
||||||
░▀░▀░▀░▀░▀░▀░▀▀▀░▀░▀░▀░░░▀░▀░▀░▀░▀▀▀░▀▀▀
|
|
||||||
|
|
||||||
The dropdown menus
|
|
||||||
*/
|
|
||||||
|
|
||||||
.panel-arrowcontent {
|
|
||||||
padding: 0 !important;
|
|
||||||
margin: 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
toolbarseparator {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
box.panel-arrowbox {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
box.panel-arrowcontent {
|
|
||||||
border-radius: 8px !important;
|
|
||||||
border: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
|
||||||
░█▀▀░▀█▀░█▀█░█▀▄░█▀▄░█▀█░█▀▄
|
|
||||||
░█▀▀░░█░░█░█░█░█░█▀▄░█▀█░█▀▄
|
|
||||||
░▀░░░▀▀▀░▀░▀░▀▀░░▀▀░░▀░▀░▀░▀
|
|
||||||
|
|
||||||
The findbar
|
|
||||||
*/
|
|
||||||
|
|
||||||
#browser #appcontent #tabbrowser-tabbox findbar,
|
|
||||||
#browser #appcontent #tabbrowser-tabbox tabpanels {
|
|
||||||
-moz-appearance: none !important;
|
|
||||||
border: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#browser #appcontent #tabbrowser-tabbox findbar:-moz-lwtheme-darktext,
|
|
||||||
#browser #appcontent #tabbrowser-tabbox findbar:-moz-lwtheme-brighttext,
|
|
||||||
#browser #appcontent #tabbrowser-tabbox tabpanels:-moz-lwtheme-darktext,
|
|
||||||
#browser #appcontent #tabbrowser-tabbox tabpanels:-moz-lwtheme-brighttext {
|
|
||||||
background: transparent !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#browser #appcontent #tabbrowser-tabbox findbar {
|
|
||||||
}
|
|
||||||
|
|
||||||
#browser #appcontent #tabbrowser-tabbox findbar:-moz-lwtheme-darktext,
|
|
||||||
#browser #appcontent #tabbrowser-tabbox findbar:-moz-lwtheme-brighttext {
|
|
||||||
background-color: var(--bf-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.findbar-find-previous,
|
|
||||||
.findbar-find-next {
|
|
||||||
margin: 0 !important;
|
|
||||||
border: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#browser #appcontent #tabbrowser-tabbox .findbar-find-fast {
|
|
||||||
}
|
|
||||||
|
|
||||||
#browser #appcontent #tabbrowser-tabbox .findbar-find-fast:not([status="notfound"]):-moz-lwtheme-darktext,
|
|
||||||
#browser #appcontent #tabbrowser-tabbox .findbar-find-fast:not([status="notfound"]):-moz-lwtheme-brighttext {
|
|
||||||
background-color: var(--bf-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
|
||||||
░█▀▀░█▀█░█▀█░▀█▀░█▀▀░█░█░▀█▀░█▄█░█▀▀░█▀█░█░█
|
|
||||||
░█░░░█░█░█░█░░█░░█▀▀░▄▀▄░░█░░█░█░█▀▀░█░█░█░█
|
|
||||||
░▀▀▀░▀▀▀░▀░▀░░▀░░▀▀▀░▀░▀░░▀░░▀░▀░▀▀▀░▀░▀░▀▀▀
|
|
||||||
|
|
||||||
Right-click menu
|
|
||||||
*/
|
|
||||||
|
|
||||||
menupopup,
|
|
||||||
popup,
|
|
||||||
popup > menu > menupopup,
|
|
||||||
menupopup > menu > menupopup {
|
|
||||||
border: 0 !important;
|
|
||||||
border-radius: 4px !important;
|
|
||||||
padding: 2px 0 2px 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
menupopup:-moz-lwtheme-darktext,
|
|
||||||
menupopup:-moz-lwtheme-brighttext,
|
|
||||||
popup:-moz-lwtheme-darktext,
|
|
||||||
popup:-moz-lwtheme-brighttext,
|
|
||||||
popup > menu > menupopup:-moz-lwtheme-darktext,
|
|
||||||
popup > menu > menupopup:-moz-lwtheme-brighttext,
|
|
||||||
menupopup > menu > menupopup:-moz-lwtheme-darktext,
|
|
||||||
menupopup > menu > menupopup:-moz-lwtheme-brighttext {
|
|
||||||
-moz-appearance: none !important;
|
|
||||||
background: var(--bf-menupopup-bg) !important;
|
|
||||||
color: var(--bf-menupopup-color) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
menupopup menuseparator {
|
|
||||||
/* -moz-appearance: none !important; */
|
|
||||||
margin: 2px 0 2px 0 !important;
|
|
||||||
padding: 0 !important;
|
|
||||||
border-top: none !important;
|
|
||||||
border-color: transparent !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
menupopup menuseparator:-moz-lwtheme-darktext,
|
|
||||||
menupopup menuseparator:-moz-lwtheme-brighttext {
|
|
||||||
-moz-appearance: none !important;
|
|
||||||
background: #525A6D !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
|
||||||
░█▀▀░█░█░█▀▀░▀█▀░█▀█░█▄█░▀█▀░▀▀█░█▀█░▀█▀░▀█▀░█▀█░█▀█░█░█░▀█▀░█▀█░█▀▄░█▀█░█░█
|
|
||||||
░█░░░█░█░▀▀█░░█░░█░█░█░█░░█░░▄▀░░█▀█░░█░░░█░░█░█░█░█░█▄█░░█░░█░█░█░█░█░█░█▄█
|
|
||||||
░▀▀▀░▀▀▀░▀▀▀░░▀░░▀▀▀░▀░▀░▀▀▀░▀▀▀░▀░▀░░▀░░▀▀▀░▀▀▀░▀░▀░▀░▀░▀▀▀░▀░▀░▀▀░░▀▀▀░▀░▀
|
|
||||||
|
|
||||||
The customization window
|
|
||||||
*/
|
|
||||||
|
|
||||||
#customization-container {
|
|
||||||
}
|
|
||||||
|
|
||||||
#customization-container:-moz-lwtheme-darktext,
|
|
||||||
#customization-container:-moz-lwtheme-brighttext {
|
|
||||||
background: var(--bf-bg) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.customizationmode-button {
|
|
||||||
padding: 5px !important;
|
|
||||||
border-radius: 6px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.customizationmode-button:hover {
|
|
||||||
padding: 5px !important;
|
|
||||||
border-radius: 6px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.customizationmode-button label {
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
|
||||||
░█░█░▀█▀░█▀█░█▀▄░█▀█░█░█░█▀▄░█░█░▀█▀░▀█▀░█▀█░█▀█░█▀▀
|
|
||||||
░█▄█░░█░░█░█░█░█░█░█░█▄█░█▀▄░█░█░░█░░░█░░█░█░█░█░▀▀█
|
|
||||||
░▀░▀░▀▀▀░▀░▀░▀▀░░▀▀▀░▀░▀░▀▀░░▀▀▀░░▀░░░▀░░▀▀▀░▀░▀░▀▀▀
|
|
||||||
|
|
||||||
The control buttons. Contains, close, minimize, and maximize buttons
|
|
||||||
*/
|
|
||||||
|
|
||||||
#autohide-context {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#window-controls[hidden="true"] {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#window-controls[hidden="false"] {
|
|
||||||
display: inline-flex !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Hide titlebar-buttonbox if there's single tab */
|
|
||||||
/*
|
|
||||||
:root[tabsintitlebar][sizemode="maximized"] #titlebar .titlebar-buttonbox-container {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
|
|||||||
@ -1,24 +0,0 @@
|
|||||||
@import url('userChrome.css');
|
|
||||||
|
|
||||||
/* Removes the white loading page */
|
|
||||||
/* url(about:newtab), url(about:home) */
|
|
||||||
@-moz-document url(about:blank) {
|
|
||||||
html:not(#ublock0-epicker),
|
|
||||||
html:not(#ublock0-epicker)
|
|
||||||
body,
|
|
||||||
#newtab-customize-overlay {
|
|
||||||
background: var(--bf-blank-page-bg) !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Hide scrollbar */
|
|
||||||
:root{
|
|
||||||
scrollbar-width: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Hide incognito scrollbar */
|
|
||||||
@-moz-document url(about:privatebrowsing) {
|
|
||||||
:root{
|
|
||||||
scrollbar-width: none !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Reference in New Issue
Block a user