From 391667a94c04043919023872aa4437ab9f5c9ae5 Mon Sep 17 00:00:00 2001 From: Noah Petherbridge Date: Sat, 23 Nov 2024 23:49:29 -0800 Subject: [PATCH] Website theme hue settings --- pkg/config/enum.go | 38 ++++++++++++++++++++++++++--- pkg/controller/account/settings.go | 20 +++++++++++++-- pkg/utility/enum.go | 15 ++++++++++++ web/static/css/theme-blue-pink.css | 8 ++++++ web/static/css/theme-blue.css | 7 ++++++ web/static/css/theme-green.css | 7 ++++++ web/static/css/theme-pink.css | 8 ++++++ web/static/css/theme-purple.css | 8 ++++++ web/static/css/theme-red.css | 7 ++++++ web/templates/account/settings.html | 20 +++++++++++++++ web/templates/base.html | 5 ++++ 11 files changed, 138 insertions(+), 5 deletions(-) create mode 100644 pkg/utility/enum.go create mode 100644 web/static/css/theme-blue-pink.css create mode 100644 web/static/css/theme-blue.css create mode 100644 web/static/css/theme-green.css create mode 100644 web/static/css/theme-pink.css create mode 100644 web/static/css/theme-purple.css create mode 100644 web/static/css/theme-red.css diff --git a/pkg/config/enum.go b/pkg/config/enum.go index fc355c6..06ae4cc 100644 --- a/pkg/config/enum.go +++ b/pkg/config/enum.go @@ -82,8 +82,40 @@ var ( "chat_moderation_rules", } + // Website theme color hue choices. + WebsiteThemeHueChoices = []Option{ + { + Label: "Default (no added color; classic nonshy theme)", + Value: "", + }, + { + Label: "nonshy blue & pink", + Value: "blue-pink", + }, + { + Label: "Pretty in pink", + Value: "pink", + }, + { + Label: "Royal purple", + Value: "purple", + }, + { + Label: "Cool blue", + Value: "blue", + }, + { + Label: "Burnt red", + Value: "red", + }, + { + Label: "Leafy green", + Value: "green", + }, + } + // Choices for the Contact Us subject - ContactUsChoices = []ContactUs{ + ContactUsChoices = []OptGroup{ { Header: "Website Feedback", Options: []Option{ @@ -146,8 +178,8 @@ var ( } ) -// ContactUs choices for the subject drop-down. -type ContactUs struct { +// OptGroup choices for the subject drop-down. +type OptGroup struct { Header string Options []Option } diff --git a/pkg/controller/account/settings.go b/pkg/controller/account/settings.go index 34fa087..39c2a69 100644 --- a/pkg/controller/account/settings.go +++ b/pkg/controller/account/settings.go @@ -42,7 +42,8 @@ func Settings() http.HandlerFunc { var reHexColor = regexp.MustCompile(`^#[a-fA-F0-9]{6}$`) return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) { vars := map[string]interface{}{ - "Enum": config.ProfileEnums, + "Enum": config.ProfileEnums, + "WebsiteThemeHueChoices": config.WebsiteThemeHueChoices, } // Load the current user in case of updates. @@ -186,12 +187,27 @@ func Settings() http.HandlerFunc { for _, field := range []string{ "hero-text-dark", "card-lightness", - "website-theme", + "website-theme", // light, dark, auto } { value := r.PostFormValue(field) user.SetProfileField(field, value) } + // Website theme color: constrain to available options. + for _, field := range []struct { + Name string + Options []config.Option + }{ + {"website-theme-hue", config.WebsiteThemeHueChoices}, + } { + value := utility.StringInOptions( + r.PostFormValue(field.Name), + field.Options, + "", + ) + user.SetProfileField(field.Name, value) + } + if err := user.Save(); err != nil { session.FlashError(w, r, "Failed to save user to database: %s", err) } diff --git a/pkg/utility/enum.go b/pkg/utility/enum.go new file mode 100644 index 0000000..35c56e2 --- /dev/null +++ b/pkg/utility/enum.go @@ -0,0 +1,15 @@ +package utility + +import "code.nonshy.com/nonshy/website/pkg/config" + +// StringInOptions constrains a string value (posted by the user) to only be one +// of the available values in the Option list enum. Returns the string if OK, or +// else the default string. +func StringInOptions(v string, options []config.Option, orDefault string) string { + for _, option := range options { + if v == option.Value { + return v + } + } + return orDefault +} diff --git a/web/static/css/theme-blue-pink.css b/web/static/css/theme-blue-pink.css new file mode 100644 index 0000000..84d9a1f --- /dev/null +++ b/web/static/css/theme-blue-pink.css @@ -0,0 +1,8 @@ +:root { + --bulma-primary-h: 300deg; + --bulma-primary-l: 80%; + --bulma-link-h: 204deg; + --bulma-link-l: 50%; + --bulma-scheme-h: 299; + --bulma-scheme-s: 22%; +} \ No newline at end of file diff --git a/web/static/css/theme-blue.css b/web/static/css/theme-blue.css new file mode 100644 index 0000000..a0921d8 --- /dev/null +++ b/web/static/css/theme-blue.css @@ -0,0 +1,7 @@ +:root { + --bulma-primary-h: 204deg; + --bulma-primary-l: 60%; + --bulma-link-h: 200deg; + --bulma-link-l: 34%; + --bulma-scheme-h: 173; +} \ No newline at end of file diff --git a/web/static/css/theme-green.css b/web/static/css/theme-green.css new file mode 100644 index 0000000..f4467b7 --- /dev/null +++ b/web/static/css/theme-green.css @@ -0,0 +1,7 @@ +:root { + --bulma-primary-h: 99deg; + --bulma-link-h: 112deg; + --bulma-link-l: 18%; + --bulma-scheme-h: 95; + --bulma-link-text: #009900; + } \ No newline at end of file diff --git a/web/static/css/theme-pink.css b/web/static/css/theme-pink.css new file mode 100644 index 0000000..7b8f09f --- /dev/null +++ b/web/static/css/theme-pink.css @@ -0,0 +1,8 @@ +:root { + --bulma-primary-h: 300deg; + --bulma-primary-l: 80%; + --bulma-link-h: 293deg; + --bulma-scheme-h: 295; + --bulma-scheme-s: 39%; +} + diff --git a/web/static/css/theme-purple.css b/web/static/css/theme-purple.css new file mode 100644 index 0000000..fca8665 --- /dev/null +++ b/web/static/css/theme-purple.css @@ -0,0 +1,8 @@ +:root { + --bulma-primary-h: 292deg; + --bulma-primary-l: 60%; + --bulma-link-h: 277deg; + --bulma-link-l: 45%; + --bulma-scheme-h: 293; + --bulma-scheme-s: 23%; +} \ No newline at end of file diff --git a/web/static/css/theme-red.css b/web/static/css/theme-red.css new file mode 100644 index 0000000..bb3d85f --- /dev/null +++ b/web/static/css/theme-red.css @@ -0,0 +1,7 @@ +:root { + --bulma-primary-h: 15deg; + --bulma-primary-l: 63%; + --bulma-link-h: 12deg; + --bulma-link-l: 30%; + --bulma-scheme-h: 0; +} \ No newline at end of file diff --git a/web/templates/account/settings.html b/web/templates/account/settings.html index 3fcd4af..c28b6ed 100644 --- a/web/templates/account/settings.html +++ b/web/templates/account/settings.html @@ -402,6 +402,26 @@

+
+ +
+ +
+

+ Select an "accent color" for the website theme. Mix and match these with + the Light and Dark themes! Some accent colors really pop on the dark theme. +

+
+
+ {{- if and .LoggedIn (.CurrentUser.GetProfileField "website-theme-hue") -}} + + {{end}}