Move optional features to use CSS @supports -moz-bool-pref()
so users can enable features from about:config
This commit is contained in:
parent
8bef9efc86
commit
d966b67813
45
README.md
45
README.md
|
@ -111,45 +111,46 @@ git pull origin master
|
|||
To achieve Firefox with overlay scrollbars install [firefox-gnome-scrollbars](https://github.com/rafaelmardojai/firefox-gnome-scrollbars).
|
||||
|
||||
## Enabling optional features
|
||||
Open `chrome/firefox-gnome-theme/userChrome.css` with a text editor and follow instructions to enable extra features. Keep in mind this file might change in future versions and your configuration will be lost. You can copy the @imports you want to enable to a new file named `customChrome.css` directly in your `chrome/firefox-gnome-theme` directory if you want it to survive updates. Remember all @imports must be at the top of the file, before other statements.
|
||||
Optional features can be enabled by crating new `boolean` preferences in `about:config`.
|
||||
|
||||
Alternatively you can run installation script with `-g` flag to auto install GNOMISH features.
|
||||
1. Go to the `about:config` page
|
||||
2. Type the key of the feature you want to enable
|
||||
3. Set it as a `boolean` and click on the add button
|
||||
4. Restart Firefox
|
||||
|
||||
```sh
|
||||
./scripts/install.sh -g
|
||||
```
|
||||
### Features
|
||||
|
||||
*Those features are not included by default, because can introduce bugs or Firefox functionalities lost.*
|
||||
|
||||
- **hide-single-tab.css** *GNOMISH*
|
||||
#### Hide single tab
|
||||
`gnomeTheme.hideSingleTab`
|
||||
|
||||
Hide the tab bar when only one tab is open.
|
||||
|
||||
You should move the new tab button somewhere else for this to work, because by default it is on the tab bar too.
|
||||
> You should move the new tab button somewhere else for this to work, because by default it is on the tab bar too.
|
||||
|
||||
- **square-title-buttons.css**
|
||||
#### Normal width tabs
|
||||
`gnomeTheme.normalWidthTabs`
|
||||
|
||||
Use square title buttons old style.
|
||||
Use normal width tabs as default Firefox.
|
||||
|
||||
- **normal-width-tabs.css**
|
||||
#### Active tab contrast
|
||||
`gnomeTheme.activeTabContrast`
|
||||
|
||||
Use normal width tabs.
|
||||
Add more contrast to the active tab.
|
||||
|
||||
- **active-tab-contrast.css**
|
||||
|
||||
Active tab better contrast.
|
||||
|
||||
- **system-icons.css**
|
||||
#### System icons
|
||||
`gnomeTheme.systemIcons`
|
||||
|
||||
Use system theme icons instead of Adwaita icons included by theme.
|
||||
|
||||
- **drag-window-headerbar-buttons.css**
|
||||
#### Drag window from headerbar buttons [BUGGED]
|
||||
`gnomeTheme.dragWindowHeaderbarButtons`
|
||||
|
||||
Allow drag window from headerbar buttons *GNOMISH* **[BUGGED]**
|
||||
Allow draging the window from headerbar buttons.
|
||||
|
||||
It can activate button action, with unpleasant behavior.
|
||||
> **Note:** It can activate button action, with unpleasant behavior.
|
||||
|
||||
- **symbolic-tab-icons.css**
|
||||
#### Symbolic tab icons
|
||||
`gnomeTheme.symbolicTabIcons`
|
||||
|
||||
Make all tab icons look kinda like symbolic icons.
|
||||
|
||||
|
|
|
@ -1,10 +0,0 @@
|
|||
/* Better active tab contrast */
|
||||
|
||||
@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
||||
|
||||
.tab-background[selected=true],
|
||||
:root:not(:-moz-window-inactive) .tabbrowser-tab:hover > .tab-stack > .tab-background:not(#hack) {
|
||||
background: var(--gnome-tabbar-tab-active-background-contrast) !important;
|
||||
border-bottom-width: 5px !important;
|
||||
border-bottom-color: var(--gnome-tabbar-tab-active-border-bottom-color-contrast) !important;
|
||||
}
|
|
@ -1,16 +0,0 @@
|
|||
/* Allow drag window from headerbar buttons */
|
||||
|
||||
@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
||||
|
||||
:root[tabsintitlebar] #nav-bar *,
|
||||
:root[tabsintitlebar] #titlebar .titlebar-button,
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls toolbarbutton {
|
||||
-moz-window-dragging: drag;
|
||||
}
|
||||
|
||||
/* Avoid window dragging from urlbar */
|
||||
:root[tabsintitlebar] #nav-bar .urlbar-input-box,
|
||||
:root[tabsintitlebar] #nav-bar .urlbar-input-box * {
|
||||
-moz-window-dragging: no-drag !important;
|
||||
}
|
||||
|
|
@ -11,10 +11,12 @@
|
|||
@import "parts/icons.css";
|
||||
@import "colors/light.css";
|
||||
@import "colors/dark.css";
|
||||
@import "system-icons.css";
|
||||
@import "symbolic-tab-icons.css";
|
||||
@namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
|
||||
|
||||
/* Set theme version text in customization panel */
|
||||
#customization-footer::before {
|
||||
content: "Firefox GNOME theme v80";
|
||||
content: "Firefox GNOME theme v81";
|
||||
padding: 9px;
|
||||
}
|
||||
|
|
|
@ -1,7 +0,0 @@
|
|||
@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
||||
|
||||
#tabbrowser-tabs tab:only-of-type {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
/* TODO: Hidde tabbar bottom border */
|
|
@ -1,8 +0,0 @@
|
|||
/* Use normal width tabs */
|
||||
|
||||
@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
||||
|
||||
.tabbrowser-tab:not([style^="max-width"]):not([pinned]),
|
||||
.tabbrowser-tab[style^="max-width: 100px !important;"]:not([pinned]) {
|
||||
max-width: 225px !important;
|
||||
}
|
|
@ -159,3 +159,18 @@
|
|||
box-shadow: var(--gnome-button-active-box-shadow);
|
||||
border-color: var(--gnome-button-active-border-color) !important;
|
||||
}
|
||||
|
||||
/* OPTIONAL: Allow draging the window from headerbar buttons */
|
||||
@supports -moz-bool-pref("gnomeTheme.dragWindowHeaderbarButtons") {
|
||||
:root[tabsintitlebar] #nav-bar *,
|
||||
:root[tabsintitlebar] #titlebar .titlebar-button,
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls toolbarbutton {
|
||||
-moz-window-dragging: drag;
|
||||
}
|
||||
|
||||
/* Avoid window dragging from urlbar */
|
||||
:root[tabsintitlebar] #nav-bar .urlbar-input-box,
|
||||
:root[tabsintitlebar] #nav-bar .urlbar-input-box * {
|
||||
-moz-window-dragging: no-drag !important;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -292,9 +292,27 @@ tab[selected]:-moz-window-inactive {
|
|||
margin-right: -10px;
|
||||
}
|
||||
|
||||
/* OPTIONAL: Hide Single Tab */
|
||||
/* OPTIONAL: Hide single tab */
|
||||
@supports -moz-bool-pref("gnomeTheme.hideSingleTab") {
|
||||
#tabbrowser-tabs tab:only-of-type {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* OPTIONAL: Use normal width tabs */
|
||||
@supports -moz-bool-pref("gnomeTheme.normalWidthTabs") {
|
||||
.tabbrowser-tab:not([style^="max-width"]):not([pinned]),
|
||||
.tabbrowser-tab[style^="max-width: 100px !important;"]:not([pinned]) {
|
||||
max-width: 225px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* OPTIONAL: Add more contrast to the active tab */
|
||||
@supports -moz-bool-pref("gnomeTheme.activeTabContrast") {
|
||||
.tab-background[selected=true],
|
||||
:root:not(:-moz-window-inactive) .tabbrowser-tab:hover > .tab-stack > .tab-background:not(#hack) {
|
||||
background: var(--gnome-tabbar-tab-active-background-contrast) !important;
|
||||
border-bottom-width: 5px !important;
|
||||
border-bottom-color: var(--gnome-tabbar-tab-active-border-bottom-color-contrast) !important;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,14 +0,0 @@
|
|||
/* Square title buttons old style */
|
||||
|
||||
@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
||||
|
||||
:root[tabsintitlebar] #titlebar .titlebar-button {
|
||||
border-radius: 5px !important;
|
||||
height: 34px !important;
|
||||
margin: 0 3px !important;
|
||||
width: 34px !important;
|
||||
}
|
||||
|
||||
:root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-button {
|
||||
border-color: transparent !important;
|
||||
}
|
|
@ -10,8 +10,10 @@
|
|||
}
|
||||
}
|
||||
|
||||
/* Make tab icons look kinda like symbolic icons */
|
||||
/* OPTIONAL: Make all tab icons look kinda like symbolic icons */
|
||||
@supports -moz-bool-pref("gnomeTheme.symbolicTabIcons") {
|
||||
tab .tab-icon-image {
|
||||
filter: var(--gnome-convert-icon-to-symbolic-hack-filter);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -12,6 +12,8 @@
|
|||
}
|
||||
}
|
||||
|
||||
/* OPTIONAL: Use system theme icons instead of Adwaita icons included by theme */
|
||||
@supports -moz-bool-pref("gnomeTheme.systemIcons") {
|
||||
/* Window buttons */
|
||||
:root[tabsintitlebar] #titlebar .titlebar-button .toolbarbutton-icon,
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls toolbarbutton .toolbarbutton-icon {
|
||||
|
@ -197,4 +199,5 @@
|
|||
filter: var(--gnome-icons-hack-filter);
|
||||
list-style-image: url("moz-icon://stock/edit-paste-symbolic?size=dialog") !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -2,39 +2,8 @@
|
|||
/* Import theme */
|
||||
@import "theme/gnome-theme.css";
|
||||
|
||||
/*
|
||||
* Here you can enable other theme features not included by default.
|
||||
* To enable a specific feature, uncomment its @import line by removing "/*" at
|
||||
* the beginning of the line. To disable it, put the "/*" back.
|
||||
*/
|
||||
|
||||
/* Hide the tab bar when only one tab is open (GNOMISH)
|
||||
* You should move the new tab button somewhere else for this to work, because by
|
||||
* default it is on the tab bar too. */
|
||||
/*@import "theme/hide-single-tab.css"; /**/
|
||||
|
||||
/* Use square title buttons old style */
|
||||
/*@import "theme/square-title-buttons.css"; /**/
|
||||
|
||||
/* Use normal width tabs */
|
||||
/*@import "theme/normal-width-tabs.css"; /**/
|
||||
|
||||
/* Active tab high contrast */
|
||||
/*@import "theme/active-tab-contrast.css"; /**/
|
||||
|
||||
/* Use system theme icons instead of Adwaita icons included by theme */
|
||||
/*@import "theme/system-icons.css"; /**/
|
||||
|
||||
/* Allow drag window from headerbar buttons (GNOMISH) [BUGGED]
|
||||
* It can activate button action, with unpleasant behavior. */
|
||||
/*@import "theme/drag-window-headerbar-buttons.css"; /**/
|
||||
|
||||
/* Make all tab icons look kinda like symbolic icons */
|
||||
/*@import "theme/symbolic-tab-icons.css"; /**/
|
||||
|
||||
/* Import a custom stylesheet
|
||||
* Everything you add in your customChrome.css file (it doesn't exist by
|
||||
* default) will be included here and preserved between updates, so you can move
|
||||
* your configuration to that file if you don't like setting it up after every
|
||||
* update. You can also apply your own custom styles in that file. */
|
||||
* default) will be included here and preserved between updates.
|
||||
* You can apply your own custom styles in that file. */
|
||||
@import "customChrome.css"; /**/
|
||||
|
|
Loading…
Reference in New Issue