Commit df668277 authored by Christian Duerr's avatar Christian Duerr

Add simple FF userstyle manager

Using userChrome.css and userContent.css it is possible to do what most
userstyle manager addons do. The only disadvantage is that it cannot be
done live, you have to restart the browser.

The `./update.sh` script is responsible for assembling the two `.css`
files. The `userChrome.css` takes everything inside the `userChrome`
folder and concatenates it. It also adds the correct header for the FF
UI domain.

The `userContent.css` works in a similar way, but here the file names
are used to set the URL the style applies to.
parent 9a5a4af8
#!/bin/bash
# userContent.css for general modifications
cat ./userContent/_variables.css > userContent.css # Variables
# Merge all userContent files, using their name as domain name
for style in $(ls -N ./userContent/[^_]*); do # Get files except for Vars
FILE=$(echo $style | cut -c 15-) # Remove "./userContent/"
URL=$(echo $FILE | rev | cut -c 5- | rev) # Remove ".css"
echo "@-moz-document $URL {" >> userContent.css # Add @-moz-document header
cat ./userContent/"$URL".css >> userContent.css # Add file content
echo "}" >> userContent.css # Close @-moh-document header
done
# userChrome.css for modifying FF UI
cat ./userChrome/_variables.css > userChrome.css # Vars and open @-moz-document
cat ./userChrome/[^_]* >> userChrome.css # Merge all files
echo "}" >> userChrome.css # Close @-moz-document
......@@ -6,67 +6,98 @@
--highlight-color: #702020;
}
/* Don't close this */
@-moz-document url(chrome://browser/content/browser.xul) {
.tab-background[selected="true"], #nav-bar, .tabbrowser-tab:hover .tab-background, #TabsToolbar .toolbarbutton-1:hover:not([disabled="true"]), #appMenu-zoomReset-button {
background: var(--bg-color) !important;
}
#TabsToolbar, #nav-bar-customization-target toolbarbutton:hover:not([disabled="true"]) > .toolbarbutton-icon, toolbarbutton:-moz-any(:hover, [open]):not([disabled="true"]) > .toolbarbutton-badge-stack, toolbarbutton.subviewbutton:-moz-any(:hover, :focus):not(:-moz-any([disabled])), toolbarbutton.subviewbutton:-moz-any([open], :hover:active):not([disabled]), #urlbar {
background: var(--secondary-bg-color) !important;
}
.urlbar-input::-moz-selection, .tabbrowser-tab:hover:not([selected="true"]) .tab-line {
background: var(--highlight-color) !important;
}
.tab-text, .urlbar-input {
color: var(--fg-color) !important;
}
.autocomplete-richlistitem:not([selected="true"]) .ac-url, .autocomplete-richlistitem:not([selected="true"]) .ac-separator, .autocomplete-richlistitem:not([selected="true"]) .ac-action {
color: var(--secondary-fg-color) !important;
}
.urlbar-input::-moz-selection {
color: var(--bg-color) !important;
}
#urlbar[pageproxystate="valid"] > #identity-box.verifiedDomain > #connection-icon, #urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity > #connection-icon, #urlbar[pageproxystate="valid"] > #identity-box.mixedActiveBlocked > #connection-icon {
fill: var(--bg-color) !important;
}
#appMenu-zoomReset-button {
border-color: var(--bg-color) !important;
}
* {
border-radius: unset !important;
}
#PanelUI-button, #urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
border: unset !important;
}
#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
padding-inline-end: 2px !important;
margin-inline-end: 2px !important;
}
.tabbrowser-tab:hover:not([selected="true"]) .tab-line {
opacity: .5 !important;
}
#urlbar-icons, .autocomplete-history-dropmarker, .urlbar-go-button, #identity-icon-labels {
display: none !important;
}
/* Fix white flashing bg */
#main-window, browser[type="content-primary"], browser[type="content"], tabbrowser#content, #content, browser[type="content"] > html {
background: #1b1b1b !important;
}
/* Customize page */
#customization-container {
background: var(--secondary-bg-color) !important;
}
* {
border-radius: unset !important;
}
#customization-container {
background: var(--secondary-bg-color) !important;
}
#appMenu-zoomReset-button {
background: var(--bg-color) !important;
}
toolbarbutton:-moz-any(:hover, [open]):not([disabled="true"]) > .toolbarbutton-badge-stack,
toolbarbutton.subviewbutton:-moz-any(:hover, :focus):not(:-moz-any([disabled])),
toolbarbutton.subviewbutton:-moz-any([open], :hover:active):not([disabled]) {
background: var(--secondary-bg-color) !important;
}
#appMenu-zoomReset-button {
border-color: var(--bg-color) !important;
}
#PanelUI-button {
border: unset !important;
}
.tab-background[selected="true"],
.tabbrowser-tab:hover .tab-background,
#TabsToolbar .toolbarbutton-1:hover:not([disabled="true"]) {
background: var(--bg-color) !important;
}
#TabsToolbar {
background: var(--secondary-bg-color) !important;
}
.tabbrowser-tab:hover:not([selected="true"]) .tab-line {
background: var(--highlight-color) !important;
}
.tab-text {
color: var(--fg-color) !important;
}
.tabbrowser-tab:hover:not([selected="true"]) .tab-line {
opacity: .5 !important;
}
#nav-bar {
background: var(--bg-color) !important;
}
#nav-bar-customization-target toolbarbutton:hover:not([disabled="true"]) > .toolbarbutton-icon,
#urlbar {
background: var(--secondary-bg-color) !important;
}
.urlbar-input::-moz-selection {
background: var(--highlight-color) !important;
}
.urlbar-input {
color: var(--fg-color) !important;
}
.urlbar-input::-moz-selection {
color: var(--bg-color) !important;
}
#urlbar[pageproxystate="valid"] > #identity-box.verifiedDomain > #connection-icon,
#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity > #connection-icon,
#urlbar[pageproxystate="valid"] > #identity-box.mixedActiveBlocked > #connection-icon {
fill: var(--bg-color) !important;
}
#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
border: unset !important;
}
#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
padding-inline-end: 2px !important;
margin-inline-end: 2px !important;
}
#urlbar-icons, .autocomplete-history-dropmarker, .urlbar-go-button, #identity-icon-labels {
display: none !important;
}
.autocomplete-richlistitem:not([selected="true"]) .ac-url,
.autocomplete-richlistitem:not([selected="true"]) .ac-separator,
.autocomplete-richlistitem:not([selected="true"]) .ac-action {
color: var(--secondary-fg-color) !important;
}
/* Fix white flashing bg */
#main-window, browser[type="content-primary"], browser[type="content"], tabbrowser#content, #content, browser[type="content"] > html {
background: #1b1b1b !important;
}
}
:root {
--bg-color: #1b1b1b;
--fg-color: #9e9e9e;
--secondary-bg-color: #262626;
--secondary-fg-color: #616161;
--highlight-color: #702020;
}
/* Don't close this */
@-moz-document url(chrome://browser/content/browser.xul) {
* {
border-radius: unset !important;
}
#customization-container {
background: var(--secondary-bg-color) !important;
}
#appMenu-zoomReset-button {
background: var(--bg-color) !important;
}
toolbarbutton:-moz-any(:hover, [open]):not([disabled="true"]) > .toolbarbutton-badge-stack,
toolbarbutton.subviewbutton:-moz-any(:hover, :focus):not(:-moz-any([disabled])),
toolbarbutton.subviewbutton:-moz-any([open], :hover:active):not([disabled]) {
background: var(--secondary-bg-color) !important;
}
#appMenu-zoomReset-button {
border-color: var(--bg-color) !important;
}
#PanelUI-button {
border: unset !important;
}
.tab-background[selected="true"],
.tabbrowser-tab:hover .tab-background,
#TabsToolbar .toolbarbutton-1:hover:not([disabled="true"]) {
background: var(--bg-color) !important;
}
#TabsToolbar {
background: var(--secondary-bg-color) !important;
}
.tabbrowser-tab:hover:not([selected="true"]) .tab-line {
background: var(--highlight-color) !important;
}
.tab-text {
color: var(--fg-color) !important;
}
.tabbrowser-tab:hover:not([selected="true"]) .tab-line {
opacity: .5 !important;
}
#nav-bar {
background: var(--bg-color) !important;
}
#nav-bar-customization-target toolbarbutton:hover:not([disabled="true"]) > .toolbarbutton-icon,
#urlbar {
background: var(--secondary-bg-color) !important;
}
.urlbar-input::-moz-selection {
background: var(--highlight-color) !important;
}
.urlbar-input {
color: var(--fg-color) !important;
}
.urlbar-input::-moz-selection {
color: var(--bg-color) !important;
}
#urlbar[pageproxystate="valid"] > #identity-box.verifiedDomain > #connection-icon,
#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity > #connection-icon,
#urlbar[pageproxystate="valid"] > #identity-box.mixedActiveBlocked > #connection-icon {
fill: var(--bg-color) !important;
}
#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
border: unset !important;
}
#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
padding-inline-end: 2px !important;
margin-inline-end: 2px !important;
}
#urlbar-icons, .autocomplete-history-dropmarker, .urlbar-go-button, #identity-icon-labels {
display: none !important;
}
.autocomplete-richlistitem:not([selected="true"]) .ac-url,
.autocomplete-richlistitem:not([selected="true"]) .ac-separator,
.autocomplete-richlistitem:not([selected="true"]) .ac-action {
color: var(--secondary-fg-color) !important;
}
/* Fix white flashing bg */
#main-window, browser[type="content-primary"], browser[type="content"], tabbrowser#content, #content, browser[type="content"] > html {
background: #1b1b1b !important;
}
This diff is collapsed.
:root {
--bg-color: #1b1b1b;
--fg-color: #9e9e9e;
--secondary-bg-color: #262626;
--secondary-fg-color: #616161;
}
../../undead-discord.css
\ No newline at end of file
../../undead-reddit.css
\ No newline at end of file
../../undead-twitter.css
\ No newline at end of file
#root {
background: var(--bg-color) !important;
}
.prefs-button {
display: none !important;
}
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment