Archives
/
solarized-everything-css
mirror of https://github.com/alphapapa/solarized-everything-css
2
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Reorganize files

Browse Source 
Now correctly including generic.styl in all other sheets.  This was
quite a mess to figure out because of the way Stylus handles
imports/requires.  IIRC, Less doesn't work this way, but, of course,
Less is much more limited than Stylus.
pull/4/head
Adam Porter 9 years ago
parent c463d9958a
commit e2104657d8
29 changed files with 459 additions and 35 deletions
Show Stats Download Patch File Download Diff File

4
Makefile
Unescape Escape View File

@ -3,11 +3,11 @@ VPATH = .:sites
CSS_DIR := css
COLORS := light dark
COMMON_FILES := $(wildcard *.styl)
COMMON_FILES := $(wildcard styl/*.styl)
SITES := $(patsubst sites/%.styl,%,$(wildcard sites/*))
# ** Functions
make_site = for color in $(COLORS); do stylus --import $$color.styl -p sites/$(1).styl >$(CSS_DIR)/solarized-$(1)-$$color.css; done
make_site = for color in $(COLORS); do stylus --include styl --import styl/$$color.styl --import styl -p sites/$(1).styl >$(CSS_DIR)/solarized-$(1)-$$color.css; done
# ** Rules
.PHONY: all

19
README.org
Unescape Escape View File

@ -16,7 +16,7 @@ You can find some GitHub-specific stylesheets at the [[https://github.com/alphap
** Installation
Install the stylesheet of your choice according to your browser's method (e.g. using the Stylish extension in Firefox).
*** Files
- ~solarized-all-sites*.css~
- ~solarized-all-sites-*.css~
These have all the sites' styles smushed into one big file. Might work pretty well for most sites. If the collection grows, it might begin to have conflicts--but it still might work pretty well. It might be a lot better than adding a separate stylesheet for every site you visit...
- ~solarized-generic-*.css~
These are intended to be generic, suitable for many simple sites. They probably won't do much for fancy, popular sites with lots of custom CSS, but for simple, mostly unstyled sites, they might work okay.
@ -30,6 +30,23 @@ Basically, nearly the only things that should be in =dark.styl= or =light.styl=
I highly recommend using Emacs with =stylus-mode= and =outline-minor-mode=, but, of course, you can use whatever you like. :)
It's a good idea to avoid the use of =*= selectors wherever possible. They tend to have unanticipated side-effects which can take time to track down.
*** Require tree
Stylus can be very confusing when it comes to importing/requiring sheets into other sheets. Unfortunately, the order in which they are imported /does/ matter, as each one seems to be parsed and executed in-order, rather than importing them all at once and then having a global namespace.
This is how the sheets ~require~ in this project:
+ =Makefile=
- =styl/{dark,light}.styl= (in Makefile syntax: ~$$color.styl~)
+ =colors=
+ Contents of ={dark,light}.styl=
- =styl= (which loads =styl/index.styl=)
+ =generic=
- =mixins=
- =sites/*.styl=: The site-specific sheets, as well as =generic.styl=, which applies to all of them, and also builds as a separate sheet for non-specific sites. =all-sites.styl= puts all of the site-specific sheets into one big CSS file, which some people may prefer over setting up custom CSS for each site in their browser.
This way, the Solarized color values are loaded first, followed by the dark- or light-themed mappings of those color values to friendly names, after which those friendly names can be used in the sheets that actually style elements and pages.
** License
Really? Come on, it's just some CSS. Just have fun and share!

17
css/solarized-all-sites-dark.css
Unescape Escape View File

@ -1,16 +1,12 @@
.post-actions {
background-color: #073642 !important;
}
.textarea-wrapper {
background-color: #002b36 !important;
color: #839496 !important;
}
* {
border-color: #657b83 !important;
}
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #002b36 !important;
color: #839496 !important;
@ -28,6 +24,13 @@ pre {
background-color: #073642 !important;
color: #839496 !important;
}
.post-actions {
background-color: #073642 !important;
}
.textarea-wrapper {
background-color: #002b36 !important;
color: #839496 !important;
}
.breadcrumb strong.final-path {
color: #839496 !important;
}

17
css/solarized-all-sites-light.css
Unescape Escape View File

@ -1,16 +1,12 @@
.post-actions {
background-color: #eee8d5 !important;
}
.textarea-wrapper {
background-color: #fdf6e3 !important;
color: #657b83 !important;
}
* {
border-color: #839496 !important;
}
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #fdf6e3 !important;
color: #657b83 !important;
@ -28,6 +24,13 @@ pre {
background-color: #eee8d5 !important;
color: #657b83 !important;
}
.post-actions {
background-color: #eee8d5 !important;
}
.textarea-wrapper {
background-color: #fdf6e3 !important;
color: #657b83 !important;
}
.breadcrumb strong.final-path {
color: #657b83 !important;
}

26
css/solarized-disqus-dark.css
Unescape Escape View File

@ -1,3 +1,29 @@
* {
border-color: #657b83 !important;
}
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #002b36 !important;
color: #839496 !important;
}
html {
background-color: #002b36 !important;
}
input,
textarea {
background-color: #073642 !important;
color: #839496 !important;
}
blockquote,
pre {
background-color: #073642 !important;
color: #839496 !important;
}
.post-actions {
background-color: #073642 !important;
}

26
css/solarized-disqus-light.css
Unescape Escape View File

@ -1,3 +1,29 @@
* {
border-color: #839496 !important;
}
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #fdf6e3 !important;
color: #657b83 !important;
}
html {
background-color: #fdf6e3 !important;
}
input,
textarea {
background-color: #eee8d5 !important;
color: #657b83 !important;
}
blockquote,
pre {
background-color: #eee8d5 !important;
color: #657b83 !important;
}
.post-actions {
background-color: #eee8d5 !important;
}

29
css/solarized-generic-dark.css
Unescape Escape View File

@ -4,6 +4,35 @@
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #002b36 !important;
color: #839496 !important;
}
html {
background-color: #002b36 !important;
}
input,
textarea {
background-color: #073642 !important;
color: #839496 !important;
}
blockquote,
pre {
background-color: #073642 !important;
color: #839496 !important;
}
* {
border-color: #657b83 !important;
}
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #002b36 !important;
color: #839496 !important;

29
css/solarized-generic-light.css
Unescape Escape View File

@ -4,6 +4,35 @@
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #fdf6e3 !important;
color: #657b83 !important;
}
html {
background-color: #fdf6e3 !important;
}
input,
textarea {
background-color: #eee8d5 !important;
color: #657b83 !important;
}
blockquote,
pre {
background-color: #eee8d5 !important;
color: #657b83 !important;
}
* {
border-color: #839496 !important;
}
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #fdf6e3 !important;
color: #657b83 !important;

26
css/solarized-github-dark.css
Unescape Escape View File

@ -1,3 +1,29 @@
* {
border-color: #657b83 !important;
}
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #002b36 !important;
color: #839496 !important;
}
html {
background-color: #002b36 !important;
}
input,
textarea {
background-color: #073642 !important;
color: #839496 !important;
}
blockquote,
pre {
background-color: #073642 !important;
color: #839496 !important;
}
.breadcrumb strong.final-path {
color: #839496 !important;
}

26
css/solarized-github-light.css
Unescape Escape View File

@ -1,3 +1,29 @@
* {
border-color: #839496 !important;
}
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #fdf6e3 !important;
color: #657b83 !important;
}
html {
background-color: #fdf6e3 !important;
}
input,
textarea {
background-color: #eee8d5 !important;
color: #657b83 !important;
}
blockquote,
pre {
background-color: #eee8d5 !important;
color: #657b83 !important;
}
.breadcrumb strong.final-path {
color: #657b83 !important;
}

26
css/solarized-google-dark.css
Unescape Escape View File

@ -1,3 +1,29 @@
* {
border-color: #657b83 !important;
}
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #002b36 !important;
color: #839496 !important;
}
html {
background-color: #002b36 !important;
}
input,
textarea {
background-color: #073642 !important;
color: #839496 !important;
}
blockquote,
pre {
background-color: #073642 !important;
color: #839496 !important;
}
.sfbgg {
background-color: #073642 !important;
}

26
css/solarized-google-light.css
Unescape Escape View File

@ -1,3 +1,29 @@
* {
border-color: #839496 !important;
}
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #fdf6e3 !important;
color: #657b83 !important;
}
html {
background-color: #fdf6e3 !important;
}
input,
textarea {
background-color: #eee8d5 !important;
color: #657b83 !important;
}
blockquote,
pre {
background-color: #eee8d5 !important;
color: #657b83 !important;
}
.sfbgg {
background-color: #eee8d5 !important;
}

26
css/solarized-hackernews-dark.css
Unescape Escape View File

@ -1,3 +1,29 @@
* {
border-color: #657b83 !important;
}
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #002b36 !important;
color: #839496 !important;
}
html {
background-color: #002b36 !important;
}
input,
textarea {
background-color: #073642 !important;
color: #839496 !important;
}
blockquote,
pre {
background-color: #073642 !important;
color: #839496 !important;
}
#hnmain > tbody:nth-child(1) > tr:nth-child(1) > td:nth-child(1) {
background-color: #cb4b16 !important;
}

26
css/solarized-hackernews-light.css
Unescape Escape View File

@ -1,3 +1,29 @@
* {
border-color: #839496 !important;
}
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #fdf6e3 !important;
color: #657b83 !important;
}
html {
background-color: #fdf6e3 !important;
}
input,
textarea {
background-color: #eee8d5 !important;
color: #657b83 !important;
}
blockquote,
pre {
background-color: #eee8d5 !important;
color: #657b83 !important;
}
#hnmain > tbody:nth-child(1) > tr:nth-child(1) > td:nth-child(1) {
background-color: #cb4b16 !important;
}

7
css/solarized-mediawiki-dark.css
Unescape Escape View File

@ -4,10 +4,16 @@
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #002b36 !important;
color: #839496 !important;
}
html {
background-color: #002b36 !important;
}
input,
textarea {
background-color: #073642 !important;
@ -16,6 +22,7 @@ textarea {
blockquote,
pre {
background-color: #073642 !important;
color: #839496 !important;
}
body * {
border-color: #094352 !important;

7
css/solarized-mediawiki-light.css
Unescape Escape View File

@ -4,10 +4,16 @@
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #fdf6e3 !important;
color: #657b83 !important;
}
html {
background-color: #fdf6e3 !important;
}
input,
textarea {
background-color: #eee8d5 !important;
@ -16,6 +22,7 @@ textarea {
blockquote,
pre {
background-color: #eee8d5 !important;
color: #657b83 !important;
}
body * {
border-color: #e9e1c8 !important;

26
css/solarized-planet.emacsen.org-dark.css
Unescape Escape View File

@ -1,3 +1,29 @@
* {
border-color: #657b83 !important;
}
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #002b36 !important;
color: #839496 !important;
}
html {
background-color: #002b36 !important;
}
input,
textarea {
background-color: #073642 !important;
color: #839496 !important;
}
blockquote,
pre {
background-color: #073642 !important;
color: #839496 !important;
}
div#page div#header {
background-color: #002b36 !important;
}

26
css/solarized-planet.emacsen.org-light.css
Unescape Escape View File

@ -1,3 +1,29 @@
* {
border-color: #839496 !important;
}
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #fdf6e3 !important;
color: #657b83 !important;
}
html {
background-color: #fdf6e3 !important;
}
input,
textarea {
background-color: #eee8d5 !important;
color: #657b83 !important;
}
blockquote,
pre {
background-color: #eee8d5 !important;
color: #657b83 !important;
}
div#page div#header {
background-color: #fdf6e3 !important;
}

26
css/solarized-stackexchange-dark.css
Unescape Escape View File

@ -1,3 +1,29 @@
* {
border-color: #657b83 !important;
}
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #002b36 !important;
color: #839496 !important;
}
html {
background-color: #002b36 !important;
}
input,
textarea {
background-color: #073642 !important;
color: #839496 !important;
}
blockquote,
pre {
background-color: #073642 !important;
color: #839496 !important;
}
hr {
background-color: #094352 !important;
color: #094352 !important;

26
css/solarized-stackexchange-light.css
Unescape Escape View File

@ -1,3 +1,29 @@
* {
border-color: #839496 !important;
}
a {
color: #268bd2 !important;
}
a:visited {
color: #6c71c4 !important;
}
body {
background-color: #fdf6e3 !important;
color: #657b83 !important;
}
html {
background-color: #fdf6e3 !important;
}
input,
textarea {
background-color: #eee8d5 !important;
color: #657b83 !important;
}
blockquote,
pre {
background-color: #eee8d5 !important;
color: #657b83 !important;
}
hr {
background-color: #e9e1c8 !important;
color: #e9e1c8 !important;

6
main.styl
Unescape Escape View File

@ -1,6 +0,0 @@
// * main.styl
// Included in every sheet
@require "mixins"
@require "colors"

5
sites/all-sites.styl
Unescape Escape View File

@ -2,6 +2,7 @@
// All site-specific rules in one file
// Strange that this requires "sites/". It seems that the --import
// option changes the directory used for @require. Maybe a bug?
// This requires "sites/" because the Makefile runs stylus from the
// parent directory. Using "stylus -r" should make this unnecessary,
// but it doesn't.
@require 'sites/*'

7
sites/generic.styl
Unescape Escape View File

@ -1,14 +1,17 @@
// * generic.styl
// Generic rules for sites
@require mixins
i = !important
// Generic rules for sites
// ** HTML elements
*
border-color()
a
a()
a:visited
a visited
body
background-color()
color()

2
sites/mediawiki.styl
Unescape Escape View File

@ -2,8 +2,6 @@
// For Wikipedia and other MediaWiki sites
@require generic
body
*
border-color color-background-highlight-extra-less

0
colors.styl → styl/colors.styl
Unescape Escape View File

9
dark.styl → styl/dark.styl
Unescape Escape View File

@ -1,14 +1,21 @@
@require "main"
// * dark.styl
@require colors
// ** Colors
color-a = blue
color-a-visited = violet
color-background = base03
color-background-highlight = base02
color-background-highlight-extra = base01
color-background-highlight-extra-less = lighten(color-background-highlight, 4%)
color-background-highlight-extra-less-less = lighten(color-background-highlight, 2%)
color-border = base00
color-text = base0
comment = base01
emphasized = base1
emphasized-more = base2
emphasized-more-more = base3

7
styl/index.styl
Unescape Escape View File

@ -0,0 +1,7 @@
// * index.styl
// Included in every sheet
@require "sites/generic"

10
light.styl → styl/light.styl
Unescape Escape View File

@ -1,16 +1,22 @@
@require "main"
// * light.styl
@require colors
// ** Colors
color-a = blue
color-a-visited = violet
color-background = base3
color-background-highlight = base2
color-background-highlight-extra = base1
color-background-highlight-extra-less = darken(color-background-highlight, 4%)
color-background-highlight-extra-less-less = darken(color-background-highlight, 2%)
color-border = base0
color-text = base00
comment = base1
emphasized = base01
emphasized = base01
emphasized-more = base02
emphasized-more-more = base03

7
mixins.styl → styl/mixins.styl
Unescape Escape View File

@ -4,8 +4,10 @@
i = !important
a()
color blue i
a(c = color-a)
if c is "visited"
c = color-a-visited
color c i
background-color(c = color-background)
if c is "highlight"
@ -26,4 +28,3 @@ border-color(args...)
color(c = color-text)
color c i
Write Preview
Loading…
Cancel
Save