From e409176642a0f4cc5a05c726da2652076b608349 Mon Sep 17 00:00:00 2001
From: httpjamesm <51917118+httpjamesm@users.noreply.github.com>
Date: Thu, 20 Jun 2024 00:18:22 -0400
Subject: [PATCH] media query theme (#139)

* feat: use css media query to derive theme

* fix: rename alt for toggle images

* feat: remove no-cache middleware
---
 main.go                      |  1 -
 public/globals.css           | 26 ++++++++++++++------------
 src/middleware/noCache.go    | 12 ------------
 src/middleware/options.go    |  8 --------
 src/middleware/ratelimit.go  |  1 -
 src/routes/home.go           |  3 ---
 src/routes/options.go        | 20 --------------------
 src/routes/question.go       |  7 -------
 src/routes/shortened.go      |  2 --
 templates/home.html          |  5 ++---
 templates/question.html      |  3 +--
 templates/themeSwitcher.html |  6 ------
 12 files changed, 17 insertions(+), 77 deletions(-)
 delete mode 100644 src/middleware/noCache.go
 delete mode 100644 templates/themeSwitcher.html

diff --git a/main.go b/main.go
index f423cd1..3730e9d 100644
--- a/main.go
+++ b/main.go
@@ -35,7 +35,6 @@ func main() {
 
 	r.Use(gin.Recovery())
 	r.Use(middleware.XssPreventionHeaders())
-	r.Use(middleware.NoCacheMiddleware())
 	r.Use(middleware.OptionsMiddleware())
 	r.Use(middleware.Ratelimit())
 
diff --git a/public/globals.css b/public/globals.css
index 1655a96..8470cd0 100644
--- a/public/globals.css
+++ b/public/globals.css
@@ -11,17 +11,19 @@
     --link-color: #92adff;
 }
 
-[data-theme='light'] {
-    --main-bg: #dbdbdb;
-    --text-color: #000;
-    --muted-text-color: #636363;
-    --code-bg: #36383d;
-    --code-fg: #ffffff;
-    --input-bg: #bcbcbc;
-    --input-bg-hover: #a8a8a8;
-    --meta-bg: #aaa8a8;
-    --divider-color: #b5b5b5;
-    --link-color: #335ad0;
+@media (prefers-color-scheme: light) {
+    :root {
+        --main-bg: #dbdbdb;
+        --text-color: #000;
+        --muted-text-color: #636363;
+        --code-bg: #36383d;
+        --code-fg: #ffffff;
+        --input-bg: #bcbcbc;
+        --input-bg-hover: #a8a8a8;
+        --meta-bg: #aaa8a8;
+        --divider-color: #b5b5b5;
+        --link-color: #335ad0;
+    }
 }
 
 a {
@@ -76,4 +78,4 @@ details {
 
 .fw-nowrap {
     flex-wrap: nowrap;
-}
+}
\ No newline at end of file
diff --git a/src/middleware/noCache.go b/src/middleware/noCache.go
deleted file mode 100644
index 0b5c8a5..0000000
--- a/src/middleware/noCache.go
+++ /dev/null
@@ -1,12 +0,0 @@
-package middleware
-
-import "github.com/gin-gonic/gin"
-
-func NoCacheMiddleware() gin.HandlerFunc {
-	return func(c *gin.Context) {
-		c.Header("Cache-Control", "no-cache, no-store, must-revalidate")
-		c.Header("Pragma", "no-cache")
-		c.Header("Expires", "0")
-		c.Next()
-	}
-}
diff --git a/src/middleware/options.go b/src/middleware/options.go
index 95b9d94..a0fea14 100644
--- a/src/middleware/options.go
+++ b/src/middleware/options.go
@@ -7,7 +7,6 @@ import (
 func OptionsMiddleware() gin.HandlerFunc {
 	return func(c *gin.Context) {
 		c.Set("disable_images", false)
-		c.Set("theme", "dark")
 
 		imagesCookie, err := c.Cookie("disable_images")
 		if err == nil {
@@ -16,13 +15,6 @@ func OptionsMiddleware() gin.HandlerFunc {
 			}
 		}
 
-		themeCookie, err := c.Cookie("theme")
-		if err == nil {
-			if themeCookie == "light" {
-				c.Set("theme", "light")
-			}
-		}
-
 		c.Next()
 	}
 }
diff --git a/src/middleware/ratelimit.go b/src/middleware/ratelimit.go
index bc0bf47..d83c901 100644
--- a/src/middleware/ratelimit.go
+++ b/src/middleware/ratelimit.go
@@ -47,7 +47,6 @@ func Ratelimit() gin.HandlerFunc {
 		if val.(int) > 30 {
 			c.HTML(429, "home.html", gin.H{
 				"errorMessage": "You have exceeded the request limit. Please try again in a minute.",
-				"theme":        c.MustGet("theme").(string),
 				"version":      config.Version,
 			})
 			c.Abort()
diff --git a/src/routes/home.go b/src/routes/home.go
index 5c546cd..a45b4f7 100644
--- a/src/routes/home.go
+++ b/src/routes/home.go
@@ -12,7 +12,6 @@ import (
 func GetHome(c *gin.Context) {
 	c.HTML(200, "home.html", gin.H{
 		"version": config.Version,
-		"theme":   c.MustGet("theme").(string),
 	})
 }
 
@@ -62,7 +61,6 @@ func PostHome(c *gin.Context) {
 	if err := c.ShouldBind(&body); err != nil {
 		c.HTML(400, "home.html", gin.H{
 			"errorMessage": "Invalid request body",
-			"theme":        c.MustGet("theme").(string),
 		})
 		return
 	}
@@ -72,7 +70,6 @@ func PostHome(c *gin.Context) {
 	if translated == "" {
 		c.HTML(400, "home.html", gin.H{
 			"errorMessage": "Invalid stack overflow/exchange URL",
-			"theme":        c.MustGet("theme").(string),
 		})
 		return
 	}
diff --git a/src/routes/options.go b/src/routes/options.go
index a665be2..1bafa59 100644
--- a/src/routes/options.go
+++ b/src/routes/options.go
@@ -3,8 +3,6 @@ package routes
 import (
 	"anonymousoverflow/config"
 	"fmt"
-	"os"
-	"strings"
 
 	"github.com/gin-gonic/gin"
 )
@@ -21,26 +19,8 @@ func ChangeOptions(c *gin.Context) {
 		c.SetCookie("disable_images", fmt.Sprintf("%t", !c.MustGet("disable_images").(bool)), 60*60*24*365*10, "/", "", false, true)
 		c.HTML(200, "home.html", gin.H{
 			"successMessage": "Images are now " + text,
-			"theme":          c.MustGet("theme").(string),
 			"version":        config.Version,
 		})
-
-	case "theme":
-		text := "dark"
-		if c.MustGet("theme").(string) == "dark" {
-			text = "light"
-		}
-
-		c.SetCookie("theme", text, 60*60*24*365*10, "/", "", false, true)
-		// get redirect url from query
-		redirectUrl := c.Query("redirect_url")
-
-		if !strings.HasPrefix(redirectUrl, os.Getenv("APP_URL")) {
-			redirectUrl = os.Getenv("APP_URL")
-		}
-
-		c.Redirect(302, redirectUrl)
-
 	default:
 		c.String(400, "400 Bad Request")
 	}
diff --git a/src/routes/question.go b/src/routes/question.go
index e184ba8..7d5f7bf 100644
--- a/src/routes/question.go
+++ b/src/routes/question.go
@@ -34,7 +34,6 @@ func ViewQuestion(c *gin.Context) {
 	if _, err := strconv.Atoi(questionId); err != nil {
 		c.HTML(400, "home.html", gin.H{
 			"errorMessage": "Invalid question ID",
-			"theme":        c.MustGet("theme").(string),
 			"version":      config.Version,
 		})
 		return
@@ -60,7 +59,6 @@ func ViewQuestion(c *gin.Context) {
 	if resp.StatusCode() != 200 {
 		c.HTML(500, "home.html", gin.H{
 			"errorMessage": fmt.Sprintf("Received a non-OK status code %d", resp.StatusCode()),
-			"theme":        c.MustGet("theme").(string),
 			"version":      config.Version,
 		})
 		return
@@ -74,7 +72,6 @@ func ViewQuestion(c *gin.Context) {
 	if err != nil {
 		c.HTML(500, "home.html", gin.H{
 			"errorMessage": "Unable to parse question data",
-			"theme":        c.MustGet("theme").(string),
 			"version":      config.Version,
 		})
 		return
@@ -84,7 +81,6 @@ func ViewQuestion(c *gin.Context) {
 	if err != nil {
 		c.HTML(500, "home.html", gin.H{
 			"errorMessage": "Failed to extract question data",
-			"theme":        c.MustGet("theme").(string),
 			"version":      config.Version,
 		})
 		return
@@ -94,7 +90,6 @@ func ViewQuestion(c *gin.Context) {
 	if err != nil {
 		c.HTML(500, "home.html", gin.H{
 			"errorMessage": "Failed to extract answer data",
-			"theme":        c.MustGet("theme").(string),
 			"version":      config.Version,
 		})
 		return
@@ -110,7 +105,6 @@ func ViewQuestion(c *gin.Context) {
 		"question":    newFilteredQuestion,
 		"answers":     answers,
 		"imagePolicy": imagePolicy,
-		"theme":       c.MustGet("theme").(string),
 		"currentUrl":  fmt.Sprintf("%s%s", os.Getenv("APP_URL"), c.Request.URL.Path),
 		"sortValue":   params.SoSortValue,
 		"domain":      domain,
@@ -132,7 +126,6 @@ func parseAndValidateParameters(c *gin.Context) (inputs viewQuestionInputs, err
 	if _, err = strconv.Atoi(questionId); err != nil {
 		c.HTML(400, "home.html", gin.H{
 			"errorMessage": "Invalid question ID",
-			"theme":        c.MustGet("theme").(string),
 			"version":      config.Version,
 		})
 		return
diff --git a/src/routes/shortened.go b/src/routes/shortened.go
index 07b5445..494b5bc 100644
--- a/src/routes/shortened.go
+++ b/src/routes/shortened.go
@@ -33,7 +33,6 @@ func RedirectShortenedOverflowURL(c *gin.Context) {
 	if err != nil {
 		c.HTML(400, "home.html", gin.H{
 			"errorMessage": "Unable to fetch stack overflow URL",
-			"theme":        c.MustGet("theme").(string),
 		})
 		return
 	}
@@ -41,7 +40,6 @@ func RedirectShortenedOverflowURL(c *gin.Context) {
 	if resp.StatusCode() != 302 {
 		c.HTML(400, "home.html", gin.H{
 			"errorMessage": fmt.Sprintf("Unexpected HTTP status from origin: %d", resp.StatusCode()),
-			"theme":        c.MustGet("theme").(string),
 		})
 		return
 	}
diff --git a/templates/home.html b/templates/home.html
index 057e062..cb47709 100644
--- a/templates/home.html
+++ b/templates/home.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html data-theme="{{ .theme }}">
+<html>
 
 <head>
     <title>AnonymousOverflow - Private frontend for StackOverflow</title>
@@ -43,10 +43,9 @@
         <div class="options">
             <div class="icon">
                 <a href="/options/images">
-                    <img src="/static/icons/image.svg" alt="Toggle theme" />
+                    <img src="/static/icons/image.svg" alt="Toggle images" />
                 </a>
             </div>
-            {{ template "themeSwitcher.html" .}}
         </div>
         <p class="footer">
             Brought to you by
diff --git a/templates/question.html b/templates/question.html
index 8af2f03..a0b41f0 100644
--- a/templates/question.html
+++ b/templates/question.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html data-theme="{{ .theme }}">
+<html>
 
 <head>
     <title>{{ .question.Title }} | AnonymousOverflow</title>
@@ -25,7 +25,6 @@
         <a href="/" class="logo-link">
             <img class="logo" src="/static/codecircles.webp" alt="AnonymousOverflow home" />
         </a>
-        {{ template "themeSwitcher.html" . }}
     </div>
     <div class="card">
         <div class="card-header">
diff --git a/templates/themeSwitcher.html b/templates/themeSwitcher.html
deleted file mode 100644
index a34b512..0000000
--- a/templates/themeSwitcher.html
+++ /dev/null
@@ -1,6 +0,0 @@
-<div class="icon">
-    <a href="/options/theme?redirect_url={{ .currentUrl }}">
-        <img src="/static/icons/{{ if eq .theme "dark" }}sun{{
-        else }}moon{{ end }}.svg" alt="Toggle theme" />
-    </a>
-</div>