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 --- client.go | 7 ++++ main.go | 19 ++++++++++ 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 ++++++- 8 files changed, 191 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 diff --git a/client.go b/client.go index 1be926a..bef5c77 100644 --- a/client.go +++ b/client.go @@ -53,6 +53,7 @@ type PageData struct { ReturnTo string NewsItems []NewsItem BoardRemainer []int + Themes *[]string } type AdminPage struct { @@ -271,6 +272,8 @@ func OutboxGet(w http.ResponseWriter, r *http.Request, db *sql.DB, collection Co returnData.Pages = pages returnData.TotalPage = len(returnData.Pages) - 1 + returnData.Themes = &Themes + t.ExecuteTemplate(w, "layout", returnData) } @@ -374,6 +377,8 @@ func ArchiveGet(w http.ResponseWriter, r *http.Request, db *sql.DB, collection C returnData.Posts = collection.OrderedItems + returnData.Themes = &Themes + t.ExecuteTemplate(w, "layout", returnData) } @@ -467,6 +472,8 @@ func PostGet(w http.ResponseWriter, r *http.Request, db *sql.DB) { returnData.PostId = shortURL(returnData.Board.To, returnData.Posts[0].Id) } + returnData.Themes = &Themes + t.ExecuteTemplate(w, "layout", returnData) } diff --git a/main.go b/main.go index 6502cda..dd73510 100644 --- a/main.go +++ b/main.go @@ -19,6 +19,7 @@ import ( "net/url" "os" "os/exec" + "path" "regexp" "strconv" "strings" @@ -51,6 +52,8 @@ var MediaHashs = make(map[string]string) var ActorCache = make(map[string]Actor) +var Themes []string + func main() { CreatedNeededDirectories() @@ -84,6 +87,22 @@ func main() { } } + // get list of themes + themes, err := ioutil.ReadDir("./static/css/themes") + if err != nil { + panic(err) + } + + for _, f := range themes { + if f.Name() == "default" { + continue + } + + if e := path.Ext(f.Name()); e == ".css" { + Themes = append(Themes, strings.TrimSuffix(f.Name(), e)) + } + } + // Allow access to public media folder fileServer := http.FileServer(http.Dir("./public")) http.Handle("/public/", http.StripPrefix("/public", neuter(fileServer))) 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" . }} + + +