From 9e782ba01620997becc3118433e3d1961a88b2c3 Mon Sep 17 00:00:00 2001 From: KushBlazingJudah <59340248+KushBlazingJudah@users.noreply.github.com> Date: Wed, 18 Aug 2021 00:26:02 -0300 Subject: rudimentary theme switching --- static/css/gruvbox.css | 63 -------------------------------- static/css/style.css | 85 ------------------------------------------- static/css/themes/default.css | 85 +++++++++++++++++++++++++++++++++++++++++++ static/css/themes/gruvbox.css | 63 ++++++++++++++++++++++++++++++++ static/js/themes.js | 6 +++ static/main.html | 13 ++++++- 6 files changed, 165 insertions(+), 150 deletions(-) delete mode 100644 static/css/gruvbox.css delete mode 100644 static/css/style.css create mode 100644 static/css/themes/default.css create mode 100644 static/css/themes/gruvbox.css (limited to 'static') diff --git a/static/css/gruvbox.css b/static/css/gruvbox.css deleted file mode 100644 index fb39ea4..0000000 --- a/static/css/gruvbox.css +++ /dev/null @@ -1,63 +0,0 @@ -a, a:link, a:visited, a:active { - color: #b16286; - text-decoration: none -} - -a.reply { - color: #cc241d; -} - -a:hover.reply { - color: #fb4934; -} - -body { - background: #282828; - color: #ebdbb2; - - font-family: Iosevka, monospace, sans-serif; - font-size: 0.9em; -} - -.popup-box { - border: 4px solid #928374; - background-color: #3c3836; -} - -.box, .box-alt { - background-color: #3c3836; -} - -.quote { - color: #98971a; -} - -.post { - background-color: #1d2021; -} - -:target > div > .post { - background-color: #504945; -} - -.subject { - color: #458588; -} - -.name { - color: #b8bb26; -} - -.tripcode { - color: #689d6a; -} - -h1,h2,h3,h4,h5,h6 { - color: #fb4934; - margin-bottom: 0.1em; -} - -.replyLink { - color: #83a598; - font-size: 0.8em; -} diff --git a/static/css/style.css b/static/css/style.css deleted file mode 100644 index fa76b50..0000000 --- a/static/css/style.css +++ /dev/null @@ -1,85 +0,0 @@ -a, a:link, a:visited, a:hover, a:active { - text-decoration: none -} - -a:link, a:visited, a:active { - color: black; -} - -a:hover { - color: #de0808; -} - -body { - background-color: #eef2fe; - color: black; -} - -body.nsfw { - background-color: #ffffee; - color: #820404 -} - -.popup-box { - border: 4px solid #d3caf0; - background-color: #eff5ff; -} - -.nsfw .popup-box { - border: 4px solid #f0e2d9; - background-color: #f9f9e0; -} - -.box { - background-color: #eff5ff; -} - -.nsfw .box { - background-color: #f9f9e0; -} - -.box-alt { - background-color: #d3caf0; -} - -.nsfw .box-alt { - background-color: #f0e2d9; -} - - -.quote { - color: #789922; -} - -.post { - background-color: #d5daf0; -} - -.nsfw .post { - background-color: #f0e0d6; -} - -:target > div > .post { - background-color: #d6bad0; -} - -.nsfw :target > div > .post { - background-color: #f0c0b0; -} - -.title { - color: #0f0c5d; -} - -.name, .tripcode { - color: #117743; -} - -a.reply { - color: #af0a0f; -} - -.replyLink { - color: #000080; - font-size: 0.8em; -} diff --git a/static/css/themes/default.css b/static/css/themes/default.css new file mode 100644 index 0000000..fa76b50 --- /dev/null +++ b/static/css/themes/default.css @@ -0,0 +1,85 @@ +a, a:link, a:visited, a:hover, a:active { + text-decoration: none +} + +a:link, a:visited, a:active { + color: black; +} + +a:hover { + color: #de0808; +} + +body { + background-color: #eef2fe; + color: black; +} + +body.nsfw { + background-color: #ffffee; + color: #820404 +} + +.popup-box { + border: 4px solid #d3caf0; + background-color: #eff5ff; +} + +.nsfw .popup-box { + border: 4px solid #f0e2d9; + background-color: #f9f9e0; +} + +.box { + background-color: #eff5ff; +} + +.nsfw .box { + background-color: #f9f9e0; +} + +.box-alt { + background-color: #d3caf0; +} + +.nsfw .box-alt { + background-color: #f0e2d9; +} + + +.quote { + color: #789922; +} + +.post { + background-color: #d5daf0; +} + +.nsfw .post { + background-color: #f0e0d6; +} + +:target > div > .post { + background-color: #d6bad0; +} + +.nsfw :target > div > .post { + background-color: #f0c0b0; +} + +.title { + color: #0f0c5d; +} + +.name, .tripcode { + color: #117743; +} + +a.reply { + color: #af0a0f; +} + +.replyLink { + color: #000080; + font-size: 0.8em; +} diff --git a/static/css/themes/gruvbox.css b/static/css/themes/gruvbox.css new file mode 100644 index 0000000..fb39ea4 --- /dev/null +++ b/static/css/themes/gruvbox.css @@ -0,0 +1,63 @@ +a, a:link, a:visited, a:active { + color: #b16286; + text-decoration: none +} + +a.reply { + color: #cc241d; +} + +a:hover.reply { + color: #fb4934; +} + +body { + background: #282828; + color: #ebdbb2; + + font-family: Iosevka, monospace, sans-serif; + font-size: 0.9em; +} + +.popup-box { + border: 4px solid #928374; + background-color: #3c3836; +} + +.box, .box-alt { + background-color: #3c3836; +} + +.quote { + color: #98971a; +} + +.post { + background-color: #1d2021; +} + +:target > div > .post { + background-color: #504945; +} + +.subject { + color: #458588; +} + +.name { + color: #b8bb26; +} + +.tripcode { + color: #689d6a; +} + +h1,h2,h3,h4,h5,h6 { + color: #fb4934; + margin-bottom: 0.1em; +} + +.replyLink { + color: #83a598; + font-size: 0.8em; +} diff --git a/static/js/themes.js b/static/js/themes.js index 0d9772f..19bdbb4 100644 --- a/static/js/themes.js +++ b/static/js/themes.js @@ -20,5 +20,11 @@ function setTheme(name) { } function applyTheme() { + // HACK: disable all of the themes first. this for some reason makes things work. + for (let i = 0, tags = document.getElementsByTagName("link"); i < tags.length; i++) { + if (tags[i].type === "text/css" && tags[i].title) { + tags[i].disabled = true; + } + } setTheme(getCookie("theme") || "default"); } diff --git a/static/main.html b/static/main.html index 3fa1b66..9a88afc 100644 --- a/static/main.html +++ b/static/main.html @@ -8,8 +8,10 @@ - - + + {{ range .Themes }} + + {{ end }} {{ template "header" . }} @@ -38,6 +40,13 @@ {{ template "content" . }} {{ template "bottom" . }} + + +
[Home][Rules][FAQ]

All trademarks and copyrights on this page are owned by their respective parties.

-- cgit v1.2.3