From f35b4d49358cb72ad27aeb64ffcc2cdf4cea6d32 Mon Sep 17 00:00:00 2001 From: Adam Spragg Date: Wed, 27 Jun 2018 16:41:11 +0100 Subject: Add new "amber" stylesheet and make it default Because apparently green doesn't show up super-bright with traditional CMYK printing, so my business card with the green-on-black header wouldn't have looked great - unless I was willing to pay a lot of money for special printing. However, apparently yellow does show up well (probably because it's the Y in CMYK), and because old-old-school CRTs came in amber-on-black as well as green-on-black, switching to amber-on-black lets me keep the same kind of aesthetic while being more print-friendly. Also, it looks less Matrix-y. On the one hand, that's better because it looks less derivative. On the other, it's worse, because it doesn't grab you quite as instinctively as it did before. I've done it with alternate stylesheets though, so you can still pick the green colorscheme if you want. --- html/style/amber-grid.png | Bin 0 -> 118 bytes html/style/amber.css | 26 ++++++++++++++++++++++++++ html/style/green-grid.png | Bin 0 -> 112 bytes html/style/green.css | 26 ++++++++++++++++++++++++++ html/style/grid.png | Bin 112 -> 0 bytes html/style/main.css | 17 +---------------- 6 files changed, 53 insertions(+), 16 deletions(-) create mode 100644 html/style/amber-grid.png create mode 100644 html/style/amber.css create mode 100644 html/style/green-grid.png create mode 100644 html/style/green.css delete mode 100644 html/style/grid.png (limited to 'html/style') diff --git a/html/style/amber-grid.png b/html/style/amber-grid.png new file mode 100644 index 0000000..4ea63a7 Binary files /dev/null and b/html/style/amber-grid.png differ diff --git a/html/style/amber.css b/html/style/amber.css new file mode 100644 index 0000000..d2b6bb3 --- /dev/null +++ b/html/style/amber.css @@ -0,0 +1,26 @@ + +html { + background-color: #f8ffe0; + background-image: url('/style/amber-grid.png'); + color: #404040; +} + +body > header { + background-color: #000000; + background-image: url('/style/amber-grid.png'); +} + +h1 { + color: #ffdf00; + text-shadow: 0 0 0.2em #ffdf00; +} + +nav { + background-color: #ffdf00; + color: #000000; +} + +nav ul li.selected { + color: #606060; +} + diff --git a/html/style/green-grid.png b/html/style/green-grid.png new file mode 100644 index 0000000..3ac5a3e Binary files /dev/null and b/html/style/green-grid.png differ diff --git a/html/style/green.css b/html/style/green.css new file mode 100644 index 0000000..758e48d --- /dev/null +++ b/html/style/green.css @@ -0,0 +1,26 @@ + +html { + background-color: #f0fff0; + background-image: url('/style/green-grid.png'); + color: #404040; +} + +body > header { + background-color: #000000; + background-image: url('/style/green-grid.png'); +} + +h1 { + color: #00c000; + text-shadow: 0 0 0.2em #00c000; +} + +nav { + background-color: #00c000; + color: #000000; +} + +nav ul li.selected { + color: #ffffff; +} + diff --git a/html/style/grid.png b/html/style/grid.png deleted file mode 100644 index 3ac5a3e..0000000 Binary files a/html/style/grid.png and /dev/null differ diff --git a/html/style/main.css b/html/style/main.css index d277de1..3ec6885 100644 --- a/html/style/main.css +++ b/html/style/main.css @@ -14,10 +14,7 @@ } html { - background-color: #f0fff0; - background-image: url('/style/grid.png'); font-family: sans-serif; - color: #404040; } body { @@ -37,21 +34,12 @@ a:visited { /* * * Header * * */ body > header { padding-top: 1px; /* Don't allow child element top margins to extend out of the header element */ - background-color: #000000; - background-image: url('/style/grid.png'); - color: #00c000; } h1 { font-family: "DejaVuSansMono", monospace; /*font-variant: small-caps;*/ text-align: center; - text-shadow: 0 0 0.2em #00c000; -} - -nav { - background-color: #00c000; - color: #000000; } nav ul { @@ -69,10 +57,6 @@ nav ul li:first-child { border-left: 1px #000000 solid; } -nav ul li.selected { - color: #ffffff; -} - nav a, nav a:visited { text-decoration: none; @@ -90,6 +74,7 @@ main { margin: 0 auto 0; padding: 2em; background-color: #ffffff; + color: #404040; } h2 { -- cgit v1.2.1