Created
February 5, 2020 14:51
-
-
Save 1player/af5f02ccbe7c930f793fc104c99975df to your computer and use it in GitHub Desktop.
Auto dark mode HN - Cascadea
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* Hey there! Thanks for buying Cascadea. | |
Since it looks like this is your first custom style, | |
here's a few tips to get you started. | |
First, you need to write some CSS code for the site | |
you'd like to customize. That's what this handy | |
editor is for! I recommend using Safari's Web | |
Inspector to check out the layout and stylesheet | |
of the website you'd like to modify, so you can | |
figure out what you need to customize. | |
The "Rule Editor" up top lets you specify what | |
websites your style should apply to. You can | |
specify a specific domain name, a specific URL, | |
all URLs starting with a specific prefix, or even | |
all URLs matching a regular expression. | |
But what if you need to apply a different block | |
of CSS code to different pages, all within a single | |
"style"? That's where "sections" come in. Each | |
"section" of your style has its own block of CSS, | |
as well as its own set of rules. You can add or | |
remove sections and switch between them in the | |
toolbar up top. | |
Once you're all done, you can export your style to a | |
CSS file from the Share button up top. Then, you can | |
send that file to any other Cascadea user (or even | |
users of similar extensions for other browsers), and | |
they can use it, too. | |
Have fun, and make something beautiful! */ | |
:root { | |
--background: #222; | |
--body-background: #333; | |
--text: 210,210,210; | |
--subtext: #888; | |
--link: #ddd; | |
--visited-link: #999; | |
} | |
body, textarea { | |
background: var(--background); | |
color: rgb(var(--text)); | |
} | |
#hnmain { | |
background: var(--body-background); | |
} | |
.subtext, .subtext a:visited { | |
color: var(--subtext) !important; | |
} | |
.comhead, .comhead a:link, .comhead a:visited { | |
color: var(--subtext); | |
} | |
a:link, a.storylink:link { | |
color: var(--link); | |
} | |
a:visited, a.storylink:visited { | |
color: var(--visited-link); | |
} | |
.pagetop a { | |
color: black; | |
} | |
.votearrow { | |
filter: brightness(60%); | |
} | |
.c00, .c00 a:link { color: rgba(var(--text),1); } | |
.c5a, .c5a a:link, .c5a a:visited { color: rgba(var(--text),0.9); } | |
.c73, .c73 a:link, .c73 a:visited { color: rgba(var(--text),0.8); } | |
.c82, .c82 a:link, .c82 a:visited { color: rgba(var(--text),0.7); } | |
.c88, .c88 a:link, .c88 a:visited { color: rgba(var(--text),0.6); } | |
.c9c, .c9c a:link, .c9c a:visited { color: rgba(var(--text),0.5); } | |
.cae, .cae a:link, .cae a:visited { color: rgba(var(--text),0.4); } | |
.cbe, .cbe a:link, .cbe a:visited { color: rgba(var(--text),0.3); } | |
.cce, .cce a:link, .cce a:visited { color: rgba(var(--text),0.2); } | |
.cdd, .cdd a:link, .cdd a:visited { color: rgba(var(--text),0.1); } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment