Iterate on color themes + Forum style fixes
* Move the forum box colors into dedicated styles that are easier to override for the new theme colors. * Updated the themes so forums and comment thread background cards now match your chosen style. * Add yellow and orange theme variants.
This commit is contained in:
Noah Petherbridge
parent
391667a94c
commit
d8593d89c0
|
|
@ -83,34 +83,52 @@ var (
|
|||
}
|
||||
|
||||
// Website theme color hue choices.
|
||||
WebsiteThemeHueChoices = []Option{
|
||||
WebsiteThemeHueChoices = []OptGroup{
|
||||
{
|
||||
Label: "Default (no added color; classic nonshy theme)",
|
||||
Value: "",
|
||||
Header: "Custom Themes",
|
||||
Options: []Option{
|
||||
{
|
||||
Label: "Default (no added color; classic nonshy theme)",
|
||||
Value: "",
|
||||
},
|
||||
{
|
||||
Label: "nonshy blue & pink",
|
||||
Value: "blue-pink",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
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",
|
||||
Header: "Just a Splash of Color",
|
||||
Options: []Option{
|
||||
{
|
||||
Label: "Burnt red",
|
||||
Value: "red",
|
||||
},
|
||||
{
|
||||
Label: "Harvest orange",
|
||||
Value: "orange",
|
||||
},
|
||||
{
|
||||
Label: "Golden yellow",
|
||||
Value: "yellow",
|
||||
},
|
||||
{
|
||||
Label: "Leafy green",
|
||||
Value: "green",
|
||||
},
|
||||
{
|
||||
Label: "Cool blue",
|
||||
Value: "blue",
|
||||
},
|
||||
{
|
||||
Label: "Pretty in pink",
|
||||
Value: "pink",
|
||||
},
|
||||
{
|
||||
Label: "Royal purple",
|
||||
Value: "purple",
|
||||
},
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -196,11 +196,11 @@ func Settings() http.HandlerFunc {
|
|||
// Website theme color: constrain to available options.
|
||||
for _, field := range []struct {
|
||||
Name string
|
||||
Options []config.Option
|
||||
Options []config.OptGroup
|
||||
}{
|
||||
{"website-theme-hue", config.WebsiteThemeHueChoices},
|
||||
} {
|
||||
value := utility.StringInOptions(
|
||||
value := utility.StringInOptGroup(
|
||||
r.PostFormValue(field.Name),
|
||||
field.Options,
|
||||
"",
|
||||
|
|
|
|||
|
|
@ -13,3 +13,17 @@ func StringInOptions(v string, options []config.Option, orDefault string) string
|
|||
}
|
||||
return orDefault
|
||||
}
|
||||
|
||||
// StringInOptGroup 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 StringInOptGroup(v string, options []config.OptGroup, orDefault string) string {
|
||||
for _, group := range options {
|
||||
for _, option := range group.Options {
|
||||
if v == option.Value {
|
||||
return v
|
||||
}
|
||||
}
|
||||
}
|
||||
return orDefault
|
||||
}
|
||||
|
|
|
|||
|
|
@ -78,3 +78,19 @@ a.has-text-dark:hover {
|
|||
background-color: #550;
|
||||
color: #FFC;
|
||||
}
|
||||
|
||||
/*
|
||||
* Forum Color overrides for dark theme.
|
||||
*/
|
||||
.nonshy-forum-box-1 {
|
||||
/* Outermost box: Forum or Thread top-level wrappers */
|
||||
background-color: #163b27;
|
||||
}
|
||||
.nonshy-forum-box-2 {
|
||||
/* Nested box: "Latest Post" on Forum-level views */
|
||||
background-color: #144225;
|
||||
}
|
||||
.nonshy-forum-box-3 {
|
||||
/* Nested box: Topics/Posts/Users/View counters */
|
||||
background-color: #2c2812;
|
||||
}
|
||||
15
web/static/css/theme-blue-dark.css
Normal file
15
web/static/css/theme-blue-dark.css
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
/*
|
||||
* Forum Color overrides for dark theme.
|
||||
*/
|
||||
.nonshy-forum-box-1 {
|
||||
/* Outermost box: Forum or Thread top-level wrappers */
|
||||
background-color: #18163b;
|
||||
}
|
||||
.nonshy-forum-box-2 {
|
||||
/* Nested box: "Latest Post" on Forum-level views */
|
||||
background-color: #142842;
|
||||
}
|
||||
.nonshy-forum-box-3 {
|
||||
/* Nested box: Topics/Posts/Users/View counters */
|
||||
background-color: #17122c;
|
||||
}
|
||||
15
web/static/css/theme-blue-pink-dark.css
Normal file
15
web/static/css/theme-blue-pink-dark.css
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
/*
|
||||
* Forum Color overrides for dark theme.
|
||||
*/
|
||||
.nonshy-forum-box-1 {
|
||||
/* Outermost box: Forum or Thread top-level wrappers */
|
||||
background-color: #3b1638;
|
||||
}
|
||||
.nonshy-forum-box-2 {
|
||||
/* Nested box: "Latest Post" on Forum-level views */
|
||||
background-color: #42143e;
|
||||
}
|
||||
.nonshy-forum-box-3 {
|
||||
/* Nested box: Topics/Posts/Users/View counters */
|
||||
background-color: #1e122c;
|
||||
}
|
||||
|
|
@ -6,3 +6,20 @@
|
|||
--bulma-scheme-h: 299;
|
||||
--bulma-scheme-s: 22%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Forum Colors: with all the nested boxes, Bulma's default color scheme is
|
||||
* too limited for a good experience.
|
||||
*/
|
||||
.nonshy-forum-box-1 {
|
||||
/* Outermost box: Forum or Thread top-level wrappers */
|
||||
background-color: #fbd1ff;
|
||||
}
|
||||
.nonshy-forum-box-2 {
|
||||
/* Nested box: "Latest Post" on Forum-level views */
|
||||
background-color: #ddd0f1;
|
||||
}
|
||||
.nonshy-forum-box-3 {
|
||||
/* Nested box: Topics/Posts/Users/View counters */
|
||||
background-color: #e7c2ff;
|
||||
}
|
||||
|
|
@ -5,3 +5,20 @@
|
|||
--bulma-link-l: 34%;
|
||||
--bulma-scheme-h: 173;
|
||||
}
|
||||
|
||||
/*
|
||||
* Forum Colors: with all the nested boxes, Bulma's default color scheme is
|
||||
* too limited for a good experience.
|
||||
*/
|
||||
.nonshy-forum-box-1 {
|
||||
/* Outermost box: Forum or Thread top-level wrappers */
|
||||
background-color: #d1f0ff;
|
||||
}
|
||||
.nonshy-forum-box-2 {
|
||||
/* Nested box: "Latest Post" on Forum-level views */
|
||||
background-color: #d6d9ff;
|
||||
}
|
||||
.nonshy-forum-box-3 {
|
||||
/* Nested box: Topics/Posts/Users/View counters */
|
||||
background-color: #c2d2ff;
|
||||
}
|
||||
15
web/static/css/theme-green-dark.css
Normal file
15
web/static/css/theme-green-dark.css
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
/*
|
||||
* Forum Color overrides for dark theme.
|
||||
*/
|
||||
.nonshy-forum-box-1 {
|
||||
/* Outermost box: Forum or Thread top-level wrappers */
|
||||
background-color: #193b16;
|
||||
}
|
||||
.nonshy-forum-box-2 {
|
||||
/* Nested box: "Latest Post" on Forum-level views */
|
||||
background-color: #2e4214;
|
||||
}
|
||||
.nonshy-forum-box-3 {
|
||||
/* Nested box: Topics/Posts/Users/View counters */
|
||||
background-color: #122c1f;
|
||||
}
|
||||
|
|
@ -4,4 +4,21 @@
|
|||
--bulma-link-l: 18%;
|
||||
--bulma-scheme-h: 95;
|
||||
--bulma-link-text: #009900;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Forum Colors: with all the nested boxes, Bulma's default color scheme is
|
||||
* too limited for a good experience.
|
||||
*/
|
||||
.nonshy-forum-box-1 {
|
||||
/* Outermost box: Forum or Thread top-level wrappers */
|
||||
background-color: #d1ffd1;
|
||||
}
|
||||
.nonshy-forum-box-2 {
|
||||
/* Nested box: "Latest Post" on Forum-level views */
|
||||
background-color: #e3f1d0;
|
||||
}
|
||||
.nonshy-forum-box-3 {
|
||||
/* Nested box: Topics/Posts/Users/View counters */
|
||||
background-color: #c2ffe8;
|
||||
}
|
||||
15
web/static/css/theme-orange-dark.css
Normal file
15
web/static/css/theme-orange-dark.css
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
/*
|
||||
* Forum Color overrides for dark theme.
|
||||
*/
|
||||
.nonshy-forum-box-1 {
|
||||
/* Outermost box: Forum or Thread top-level wrappers */
|
||||
background-color: #3b2816;
|
||||
}
|
||||
.nonshy-forum-box-2 {
|
||||
/* Nested box: "Latest Post" on Forum-level views */
|
||||
background-color: #422a14;
|
||||
}
|
||||
.nonshy-forum-box-3 {
|
||||
/* Nested box: Topics/Posts/Users/View counters */
|
||||
background-color: #2c1912;
|
||||
}
|
||||
23
web/static/css/theme-orange.css
Normal file
23
web/static/css/theme-orange.css
Normal file
|
|
@ -0,0 +1,23 @@
|
|||
:root {
|
||||
--bulma-primary-h: 39deg;
|
||||
--bulma-link-h: 21deg;
|
||||
--bulma-link-l: 39%;
|
||||
--bulma-scheme-h: 34;
|
||||
}
|
||||
|
||||
/*
|
||||
* Forum Colors: with all the nested boxes, Bulma's default color scheme is
|
||||
* too limited for a good experience.
|
||||
*/
|
||||
.nonshy-forum-box-1 {
|
||||
/* Outermost box: Forum or Thread top-level wrappers */
|
||||
background-color: #ffe2d1;
|
||||
}
|
||||
.nonshy-forum-box-2 {
|
||||
/* Nested box: "Latest Post" on Forum-level views */
|
||||
background-color: #f1e8d0;
|
||||
}
|
||||
.nonshy-forum-box-3 {
|
||||
/* Nested box: Topics/Posts/Users/View counters */
|
||||
background-color: #ffcbc2;
|
||||
}
|
||||
15
web/static/css/theme-pink-dark.css
Normal file
15
web/static/css/theme-pink-dark.css
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
/*
|
||||
* Forum Color overrides for dark theme.
|
||||
*/
|
||||
.nonshy-forum-box-1 {
|
||||
/* Outermost box: Forum or Thread top-level wrappers */
|
||||
background-color: #3b1638;
|
||||
}
|
||||
.nonshy-forum-box-2 {
|
||||
/* Nested box: "Latest Post" on Forum-level views */
|
||||
background-color: #42143e;
|
||||
}
|
||||
.nonshy-forum-box-3 {
|
||||
/* Nested box: Topics/Posts/Users/View counters */
|
||||
background-color: #1e122c;
|
||||
}
|
||||
|
|
@ -6,3 +6,19 @@
|
|||
--bulma-scheme-s: 39%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Forum Colors: with all the nested boxes, Bulma's default color scheme is
|
||||
* too limited for a good experience.
|
||||
*/
|
||||
.nonshy-forum-box-1 {
|
||||
/* Outermost box: Forum or Thread top-level wrappers */
|
||||
background-color: #fbd1ff;
|
||||
}
|
||||
.nonshy-forum-box-2 {
|
||||
/* Nested box: "Latest Post" on Forum-level views */
|
||||
background-color: #ddd0f1;
|
||||
}
|
||||
.nonshy-forum-box-3 {
|
||||
/* Nested box: Topics/Posts/Users/View counters */
|
||||
background-color: #e7c2ff;
|
||||
}
|
||||
15
web/static/css/theme-purple-dark.css
Normal file
15
web/static/css/theme-purple-dark.css
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
/*
|
||||
* Forum Color overrides for dark theme.
|
||||
*/
|
||||
.nonshy-forum-box-1 {
|
||||
/* Outermost box: Forum or Thread top-level wrappers */
|
||||
background-color: #37163b;
|
||||
}
|
||||
.nonshy-forum-box-2 {
|
||||
/* Nested box: "Latest Post" on Forum-level views */
|
||||
background-color: #3e1442;
|
||||
}
|
||||
.nonshy-forum-box-3 {
|
||||
/* Nested box: Topics/Posts/Users/View counters */
|
||||
background-color: #1e122c;
|
||||
}
|
||||
|
|
@ -6,3 +6,20 @@
|
|||
--bulma-scheme-h: 293;
|
||||
--bulma-scheme-s: 23%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Forum Colors: with all the nested boxes, Bulma's default color scheme is
|
||||
* too limited for a good experience.
|
||||
*/
|
||||
.nonshy-forum-box-1 {
|
||||
/* Outermost box: Forum or Thread top-level wrappers */
|
||||
background-color: #f4d1ff;
|
||||
}
|
||||
.nonshy-forum-box-2 {
|
||||
/* Nested box: "Latest Post" on Forum-level views */
|
||||
background-color: #f1d0ef;
|
||||
}
|
||||
.nonshy-forum-box-3 {
|
||||
/* Nested box: Topics/Posts/Users/View counters */
|
||||
background-color: #d7c2ff;
|
||||
}
|
||||
15
web/static/css/theme-red-dark.css
Normal file
15
web/static/css/theme-red-dark.css
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
/*
|
||||
* Forum Color overrides for dark theme.
|
||||
*/
|
||||
.nonshy-forum-box-1 {
|
||||
/* Outermost box: Forum or Thread top-level wrappers */
|
||||
background-color: #3b1616;
|
||||
}
|
||||
.nonshy-forum-box-2 {
|
||||
/* Nested box: "Latest Post" on Forum-level views */
|
||||
background-color: #421d14;
|
||||
}
|
||||
.nonshy-forum-box-3 {
|
||||
/* Nested box: Topics/Posts/Users/View counters */
|
||||
background-color: #2c1912;
|
||||
}
|
||||
|
|
@ -5,3 +5,20 @@
|
|||
--bulma-link-l: 30%;
|
||||
--bulma-scheme-h: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Forum Colors: with all the nested boxes, Bulma's default color scheme is
|
||||
* too limited for a good experience.
|
||||
*/
|
||||
.nonshy-forum-box-1 {
|
||||
/* Outermost box: Forum or Thread top-level wrappers */
|
||||
background-color: #ffd1d1;
|
||||
}
|
||||
.nonshy-forum-box-2 {
|
||||
/* Nested box: "Latest Post" on Forum-level views */
|
||||
background-color: #f1d8d0;
|
||||
}
|
||||
.nonshy-forum-box-3 {
|
||||
/* Nested box: Topics/Posts/Users/View counters */
|
||||
background-color: #ffd0c2;
|
||||
}
|
||||
15
web/static/css/theme-yellow-dark.css
Normal file
15
web/static/css/theme-yellow-dark.css
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
/*
|
||||
* Forum Color overrides for dark theme.
|
||||
*/
|
||||
.nonshy-forum-box-1 {
|
||||
/* Outermost box: Forum or Thread top-level wrappers */
|
||||
background-color: #3b3516;
|
||||
}
|
||||
.nonshy-forum-box-2 {
|
||||
/* Nested box: "Latest Post" on Forum-level views */
|
||||
background-color: #423714;
|
||||
}
|
||||
.nonshy-forum-box-3 {
|
||||
/* Nested box: Topics/Posts/Users/View counters */
|
||||
background-color: #2c2c12;
|
||||
}
|
||||
25
web/static/css/theme-yellow.css
Normal file
25
web/static/css/theme-yellow.css
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
:root {
|
||||
--bulma-primary-h: 59deg;
|
||||
--bulma-primary-l: 51%;
|
||||
--bulma-link-h: 57deg;
|
||||
--bulma-link-l: 26%;
|
||||
--bulma-scheme-h: 62;
|
||||
--bulma-link-text: #999900;
|
||||
}
|
||||
|
||||
/*
|
||||
* Forum Colors: with all the nested boxes, Bulma's default color scheme is
|
||||
* too limited for a good experience.
|
||||
*/
|
||||
.nonshy-forum-box-1 {
|
||||
/* Outermost box: Forum or Thread top-level wrappers */
|
||||
background-color: #ffe2d1;
|
||||
}
|
||||
.nonshy-forum-box-2 {
|
||||
/* Nested box: "Latest Post" on Forum-level views */
|
||||
background-color: #f1e8d0;
|
||||
}
|
||||
.nonshy-forum-box-3 {
|
||||
/* Nested box: Topics/Posts/Users/View counters */
|
||||
background-color: #ffcbc2;
|
||||
}
|
||||
|
|
@ -251,3 +251,20 @@ nav.navbar {
|
|||
top: 4px;
|
||||
right: 4px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Forum Colors: with all the nested boxes, Bulma's default color scheme is
|
||||
* too limited for a good experience.
|
||||
*/
|
||||
.nonshy-forum-box-1 {
|
||||
/* Outermost box: Forum or Thread top-level wrappers */
|
||||
background-color: #d1fff8;
|
||||
}
|
||||
.nonshy-forum-box-2 {
|
||||
/* Nested box: "Latest Post" on Forum-level views */
|
||||
background-color: #d0f1e2;
|
||||
}
|
||||
.nonshy-forum-box-3 {
|
||||
/* Nested box: Topics/Posts/Users/View counters */
|
||||
background-color: #ffedc2;
|
||||
}
|
||||
|
|
@ -14,7 +14,7 @@
|
|||
<div class="columns mt-4">
|
||||
<div class="column is-one-quarter">
|
||||
<div class="card">
|
||||
<div class="card-header has-background-info">
|
||||
<div class="card-header has-background-link">
|
||||
<p class="card-header-title has-text-light">
|
||||
<i class="fa fa-gear mr-2"></i>
|
||||
Settings Menu
|
||||
|
|
@ -344,268 +344,295 @@
|
|||
</div>
|
||||
|
||||
<!-- Look & Feel -->
|
||||
<div class="card mb-5" id="look">
|
||||
<header class="card-header has-background-link">
|
||||
<p class="card-header-title has-text-light">
|
||||
<i class="fa fa-palette pr-2"></i>
|
||||
Look & Feel
|
||||
</p>
|
||||
</header>
|
||||
<div id="look">
|
||||
<form method="POST" action="/settings">
|
||||
{{InputCSRF}}
|
||||
<input type="hidden" name="intent" value="look">
|
||||
|
||||
<div class="card-content">
|
||||
<form method="POST" action="/settings">
|
||||
<input type="hidden" name="intent" value="look">
|
||||
{{InputCSRF}}
|
||||
|
||||
<p class="block">
|
||||
On this screen, you may customize the visual appearance of your profile
|
||||
page. You may set a custom color gradient for your header bar and personalize
|
||||
the colors of your profile cards.
|
||||
</p>
|
||||
|
||||
<!--
|
||||
-- Website Theme Section
|
||||
-->
|
||||
<h2 class="subtitle">Website Theme <span class="tag is-success">New!</span></h2>
|
||||
|
||||
<div class="field">
|
||||
<label class="checkbox">
|
||||
<input type="radio"
|
||||
name="website-theme"
|
||||
value=""
|
||||
{{if eq (.CurrentUser.GetProfileField "website-theme") ""}}checked{{end}}>
|
||||
Automatically match my device's theme
|
||||
</label>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="checkbox">
|
||||
<input type="radio"
|
||||
name="website-theme"
|
||||
value="light"
|
||||
{{if eq (.CurrentUser.GetProfileField "website-theme") "light"}}checked{{end}}>
|
||||
Always use the light theme
|
||||
</label>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="checkbox">
|
||||
<input type="radio"
|
||||
name="website-theme"
|
||||
value="dark"
|
||||
{{if eq (.CurrentUser.GetProfileField "website-theme") "dark"}}checked{{end}}>
|
||||
Always use the dark theme
|
||||
</label>
|
||||
<p class="help">
|
||||
This setting controls how the website theme will appear to you while logged in.
|
||||
By default, the dark theme is used if your device prefers dark, but you can
|
||||
manually override it to the Light or Dark themes above.
|
||||
Remember to click "Save Look & Feel" below to see the change!
|
||||
<div class="card mb-5">
|
||||
<header class="card-header has-background-link">
|
||||
<p class="card-header-title has-text-light">
|
||||
<i class="fa fa-palette pr-2"></i>
|
||||
Website Theme
|
||||
</p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="field">
|
||||
<label class="label" for="website-theme-hue">
|
||||
Accent color <span class="tag is-success">New!</span>
|
||||
</label>
|
||||
<div class="select is-fullwidth">
|
||||
<select name="website-theme-hue">
|
||||
{{range .WebsiteThemeHueChoices}}
|
||||
<option value="{{.Value}}"
|
||||
{{if eq ($User.GetProfileField "website-theme-hue") .Value}}selected{{end}}>
|
||||
{{.Label}}
|
||||
</option>
|
||||
{{end}}
|
||||
</select>
|
||||
<div class="card-content">
|
||||
<!--
|
||||
-- Website Theme Section
|
||||
-->
|
||||
<p class="block">
|
||||
You may set a custom theme to change the way the {{PrettyTitle}} website looks to you.
|
||||
Choose between a Light and Dark variant, and set an optional accent color to apply a
|
||||
new style to the entire website.
|
||||
</p>
|
||||
|
||||
<h2 class="subtitle">Light or Dark Mode</h2>
|
||||
|
||||
<div class="field">
|
||||
<label class="checkbox">
|
||||
<input type="radio"
|
||||
name="website-theme"
|
||||
value=""
|
||||
{{if eq (.CurrentUser.GetProfileField "website-theme") ""}}checked{{end}}>
|
||||
Automatically match my device's theme
|
||||
</label>
|
||||
</div>
|
||||
<p class="help">
|
||||
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.
|
||||
<div class="field">
|
||||
<label class="checkbox">
|
||||
<input type="radio"
|
||||
name="website-theme"
|
||||
value="light"
|
||||
{{if eq (.CurrentUser.GetProfileField "website-theme") "light"}}checked{{end}}>
|
||||
Always use the light theme
|
||||
</label>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="checkbox">
|
||||
<input type="radio"
|
||||
name="website-theme"
|
||||
value="dark"
|
||||
{{if eq (.CurrentUser.GetProfileField "website-theme") "dark"}}checked{{end}}>
|
||||
Always use the dark theme
|
||||
</label>
|
||||
<p class="help">
|
||||
This setting controls how the website theme will appear to you while logged in.
|
||||
By default, the dark theme is used if your device prefers dark, but you can
|
||||
manually override it to the Light or Dark themes above.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="label" for="website-theme-hue">
|
||||
Accent color <span class="tag is-success">New!</span>
|
||||
</label>
|
||||
<div class="select is-fullwidth">
|
||||
<select name="website-theme-hue">
|
||||
{{range .WebsiteThemeHueChoices}}
|
||||
<optgroup label="{{.Header}}">
|
||||
{{range .Options}}
|
||||
<option value="{{.Value}}"
|
||||
{{if eq ($User.GetProfileField "website-theme-hue") .Value}}selected{{end}}>
|
||||
{{.Label}}
|
||||
</option>
|
||||
{{end}}
|
||||
</optgroup>
|
||||
{{end}}
|
||||
</select>
|
||||
</div>
|
||||
<p class="help">
|
||||
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.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<button type="submit" class="button is-primary">
|
||||
<i class="fa fa-save mr-2"></i> Apply Website Theme
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card mb-5">
|
||||
<header class="card-header has-background-link">
|
||||
<p class="card-header-title has-text-light">
|
||||
<i class="fa fa-palette pr-2"></i>
|
||||
My Profile Page Look & Feel
|
||||
</p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<hr>
|
||||
<div class="card-content">
|
||||
|
||||
<!--
|
||||
-- Profile Header Section
|
||||
-->
|
||||
<h2 class="subtitle">Profile Header</h2>
|
||||
<p class="block">
|
||||
On this screen, you may customize the visual appearance of your profile
|
||||
page. You may set a custom color gradient for your header bar and personalize
|
||||
the colors of your profile cards.
|
||||
</p>
|
||||
|
||||
<div class="field">
|
||||
<label class="label">Preview</label>
|
||||
</div>
|
||||
<!--
|
||||
-- Profile Header Section
|
||||
-->
|
||||
<h2 class="subtitle">Profile Header</h2>
|
||||
|
||||
<!-- Header preview hero, should be similar to profile page. -->
|
||||
<div class="hero is-link is-bold mb-4" id="header-hero-preview">
|
||||
<div class="hero-body p-4">
|
||||
<div class="container">
|
||||
<div class="columns is-mobile is-gapless mt-1 mb-6">
|
||||
<div class="column is-narrow has-text-centered">
|
||||
<figure class="profile-photo is-inline-block" style="width: auto; height: auto">
|
||||
{{template "avatar-48x48" .CurrentUser}}
|
||||
</figure>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label">Preview</label>
|
||||
</div>
|
||||
|
||||
<div class="column mx-2">
|
||||
<strong>{{.CurrentUser.NameOrUsername}}</strong>
|
||||
</div>
|
||||
|
||||
{{if and .LoggedIn (not .IsPrivate)}}
|
||||
<div class="column is-narrow">
|
||||
<div class="box">
|
||||
<div style="width: 16px;"></div>
|
||||
<!-- Header preview hero, should be similar to profile page. -->
|
||||
<div class="hero is-link is-bold mb-4" id="header-hero-preview">
|
||||
<div class="hero-body p-4">
|
||||
<div class="container">
|
||||
<div class="columns is-mobile is-gapless mt-1 mb-6">
|
||||
<div class="column is-narrow has-text-centered">
|
||||
<figure class="profile-photo is-inline-block" style="width: auto; height: auto">
|
||||
{{template "avatar-48x48" .CurrentUser}}
|
||||
</figure>
|
||||
</div>
|
||||
|
||||
<div class="column mx-2">
|
||||
<strong>{{.CurrentUser.NameOrUsername}}</strong>
|
||||
</div>
|
||||
|
||||
{{if and .LoggedIn (not .IsPrivate)}}
|
||||
<div class="column is-narrow">
|
||||
<div class="box">
|
||||
<div style="width: 16px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
{{end}}<!-- if .LoggedIn -->
|
||||
</div>
|
||||
{{end}}<!-- if .LoggedIn -->
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="label">Header Gradient</label>
|
||||
<div class="columns is-mobile">
|
||||
<div class="column is-narrow">
|
||||
<input type="color" class="color"
|
||||
id="hero-color-start"
|
||||
name="hero-color-start"
|
||||
{{if ($User.GetProfileField "hero-color-start")}}
|
||||
value="{{$User.GetProfileField "hero-color-start"}}"
|
||||
{{else}}
|
||||
value="{{template "--prof-colorA"}}"
|
||||
{{end}}
|
||||
>
|
||||
</div>
|
||||
<div class="column is-narrow">
|
||||
<input type="color" class="color"
|
||||
id="hero-color-end"
|
||||
name="hero-color-end"
|
||||
{{if ($User.GetProfileField "hero-color-end")}}
|
||||
value="{{$User.GetProfileField "hero-color-end"}}"
|
||||
{{else}}
|
||||
value="{{template "--prof-colorB"}}"
|
||||
{{end}}
|
||||
>
|
||||
</div>
|
||||
<div class="column">
|
||||
<label class="checkbox">
|
||||
<input type="checkbox"
|
||||
id="hero-text-dark"
|
||||
name="hero-text-dark"
|
||||
value="true"
|
||||
{{if eq (.CurrentUser.GetProfileField "hero-text-dark") "true"}}checked{{end}}
|
||||
<div class="field">
|
||||
<label class="label">Header Gradient</label>
|
||||
<div class="columns is-mobile">
|
||||
<div class="column is-narrow">
|
||||
<input type="color" class="color"
|
||||
id="hero-color-start"
|
||||
name="hero-color-start"
|
||||
{{if ($User.GetProfileField "hero-color-start")}}
|
||||
value="{{$User.GetProfileField "hero-color-start"}}"
|
||||
{{else}}
|
||||
value="{{template "--prof-colorA"}}"
|
||||
{{end}}
|
||||
>
|
||||
Dark text
|
||||
</label>
|
||||
</div>
|
||||
<div class="column is-narrow">
|
||||
<input type="color" class="color"
|
||||
id="hero-color-end"
|
||||
name="hero-color-end"
|
||||
{{if ($User.GetProfileField "hero-color-end")}}
|
||||
value="{{$User.GetProfileField "hero-color-end"}}"
|
||||
{{else}}
|
||||
value="{{template "--prof-colorB"}}"
|
||||
{{end}}
|
||||
>
|
||||
</div>
|
||||
<div class="column">
|
||||
<label class="checkbox">
|
||||
<input type="checkbox"
|
||||
id="hero-text-dark"
|
||||
name="hero-text-dark"
|
||||
value="true"
|
||||
{{if eq (.CurrentUser.GetProfileField "hero-text-dark") "true"}}checked{{end}}
|
||||
>
|
||||
Dark text
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
<hr>
|
||||
|
||||
<!--
|
||||
-- Profile Page Section
|
||||
-->
|
||||
<h2 class="subtitle">Profile Page</h2>
|
||||
<!--
|
||||
-- Profile Page Section
|
||||
-->
|
||||
<h2 class="subtitle">Profile Page</h2>
|
||||
|
||||
<div class="card block" id="profile-card-preview">
|
||||
<div class="card-header">
|
||||
<p class="card-header-title">Card Colors</p>
|
||||
<div class="card block" id="profile-card-preview">
|
||||
<div class="card-header">
|
||||
<p class="card-header-title">Card Colors</p>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<table class="table is-fullwidth">
|
||||
<tr>
|
||||
<td>
|
||||
<strong>Lightness</strong>
|
||||
</td>
|
||||
<td>
|
||||
<div class="select is-fullwidth">
|
||||
<select id="card-lightness" name="card-lightness">
|
||||
<option value="">Automatic</option>
|
||||
<option value="light"{{if eq ($User.GetProfileField "card-lightness") "light"}} selected{{end}}>Light theme (black on white)</option>
|
||||
<option value="dark"{{if eq ($User.GetProfileField "card-lightness") "dark"}} selected{{end}}>Dark theme (white on black)</option>
|
||||
</select>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="is-narrow">
|
||||
<strong>Card Title BG</strong>
|
||||
</td>
|
||||
<td>
|
||||
<input type="color"
|
||||
id="card-title-bg"
|
||||
name="card-title-bg"
|
||||
{{if ($User.GetProfileField "card-title-bg")}}
|
||||
value="{{$User.GetProfileField "card-title-bg"}}"
|
||||
{{else}}
|
||||
value="{{template "--prof-card-bg"}}"
|
||||
{{end}}
|
||||
>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<strong>Card Title FG</strong>
|
||||
</td>
|
||||
<td>
|
||||
<input type="color"
|
||||
id="card-title-fg"
|
||||
name="card-title-fg"
|
||||
{{if ($User.GetProfileField "card-title-fg")}}
|
||||
value="{{$User.GetProfileField "card-title-fg"}}"
|
||||
{{else}}
|
||||
value="{{template "--prof-card-fg"}}"
|
||||
{{end}}
|
||||
>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<strong>Link Color</strong>
|
||||
</td>
|
||||
<td>
|
||||
<input type="color"
|
||||
id="card-link-color"
|
||||
name="card-link-color"
|
||||
{{if ($User.GetProfileField "card-link-color")}}
|
||||
value="{{$User.GetProfileField "card-link-color"}}"
|
||||
{{else}}
|
||||
value="{{template "--prof-link-fg"}}"
|
||||
{{end}}
|
||||
>
|
||||
<a href="#" onclick="return false" class="ml-2">
|
||||
Example
|
||||
<i class="fa fa-link"></i>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<table class="table is-fullwidth">
|
||||
<tr>
|
||||
<td>
|
||||
<strong>Lightness</strong>
|
||||
</td>
|
||||
<td>
|
||||
<div class="select is-fullwidth">
|
||||
<select id="card-lightness" name="card-lightness">
|
||||
<option value="">Automatic</option>
|
||||
<option value="light"{{if eq ($User.GetProfileField "card-lightness") "light"}} selected{{end}}>Light theme (black on white)</option>
|
||||
<option value="dark"{{if eq ($User.GetProfileField "card-lightness") "dark"}} selected{{end}}>Dark theme (white on black)</option>
|
||||
</select>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="is-narrow">
|
||||
<strong>Card Title BG</strong>
|
||||
</td>
|
||||
<td>
|
||||
<input type="color"
|
||||
id="card-title-bg"
|
||||
name="card-title-bg"
|
||||
{{if ($User.GetProfileField "card-title-bg")}}
|
||||
value="{{$User.GetProfileField "card-title-bg"}}"
|
||||
{{else}}
|
||||
value="{{template "--prof-card-bg"}}"
|
||||
{{end}}
|
||||
>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<strong>Card Title FG</strong>
|
||||
</td>
|
||||
<td>
|
||||
<input type="color"
|
||||
id="card-title-fg"
|
||||
name="card-title-fg"
|
||||
{{if ($User.GetProfileField "card-title-fg")}}
|
||||
value="{{$User.GetProfileField "card-title-fg"}}"
|
||||
{{else}}
|
||||
value="{{template "--prof-card-fg"}}"
|
||||
{{end}}
|
||||
>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<strong>Link Color</strong>
|
||||
</td>
|
||||
<td>
|
||||
<input type="color"
|
||||
id="card-link-color"
|
||||
name="card-link-color"
|
||||
{{if ($User.GetProfileField "card-link-color")}}
|
||||
value="{{$User.GetProfileField "card-link-color"}}"
|
||||
{{else}}
|
||||
value="{{template "--prof-link-fg"}}"
|
||||
{{end}}
|
||||
>
|
||||
<a href="#" onclick="return false" class="ml-2">
|
||||
Example
|
||||
<i class="fa fa-link"></i>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<div class="field">
|
||||
<label class="label">
|
||||
Reset Styles
|
||||
</label>
|
||||
<label class="checkbox">
|
||||
<input type="checkbox"
|
||||
name="reset"
|
||||
value="true">
|
||||
Reset to default style
|
||||
</label>
|
||||
<p class="help">
|
||||
If you'd like to reset all your page styles to their default, check
|
||||
this box and click Save below.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<button type="submit" class="button is-primary">
|
||||
<i class="fa fa-save mr-2"></i> Save Look & Feel
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="label">
|
||||
Reset Styles
|
||||
</label>
|
||||
<label class="checkbox">
|
||||
<input type="checkbox"
|
||||
name="reset"
|
||||
value="true">
|
||||
Reset to default style
|
||||
</label>
|
||||
<p class="help">
|
||||
If you'd like to reset all your page styles to their default, check
|
||||
this box and click Save below.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<button type="submit" class="button is-primary">
|
||||
<i class="fa fa-save mr-2"></i> Save Look & Feel
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<!-- Website Preferences -->
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@
|
|||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" type="text/css" href="/static/css/bulma.min.css?build={{.BuildHash}}">
|
||||
<link rel="stylesheet" href="/static/css/theme.css?build={{.BuildHash}}">
|
||||
<!-- Bulma theme CSS -->
|
||||
{{- if eq .WebsiteTheme "light" -}}
|
||||
<link rel="stylesheet" type="text/css" href="/static/css/bulma-no-dark-mode.min.css?build={{.BuildHash}}">
|
||||
|
|
@ -17,12 +18,18 @@
|
|||
<link rel="stylesheet" type="text/css" href="/static/css/nonshy-prefers-dark.css?build={{.BuildHash}}">
|
||||
{{- end -}}
|
||||
|
||||
<!-- User theme hue -->
|
||||
{{- if and .LoggedIn (.CurrentUser.GetProfileField "website-theme-hue") -}}
|
||||
<link rel="stylesheet" type="text/css" href="/static/css/theme-{{.CurrentUser.GetProfileField "website-theme-hue"}}.css">
|
||||
{{end}}
|
||||
<!-- User theme hue -->
|
||||
{{- if and .LoggedIn (.CurrentUser.GetProfileField "website-theme-hue") }}
|
||||
{{- $WebsiteThemeHue := .CurrentUser.GetProfileField "website-theme-hue" }}
|
||||
<link rel="stylesheet" type="text/css" href="/static/css/theme-{{$WebsiteThemeHue}}.css">
|
||||
|
||||
<!-- Dark theme mixin -->
|
||||
{{- if or (eq .WebsiteTheme "dark") (ne .WebsiteTheme "light") -}}
|
||||
<link rel="stylesheet" type="text/css" href="/static/css/theme-{{$WebsiteThemeHue}}-dark.css" {{if ne .WebsiteTheme "dark"}}media="(prefers-color-scheme: dark)"{{end}}>
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
|
||||
<link rel="stylesheet" href="/static/fontawesome-free-6.6.0-web/css/all.css">
|
||||
<link rel="stylesheet" href="/static/css/theme.css?build={{.BuildHash}}">
|
||||
<link rel="manifest" href="/manifest.json">
|
||||
<title>{{template "title" .}} - {{ .Title }}</title>
|
||||
</head>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
{{define "title"}}Chat Rooms{{end}}
|
||||
{{define "content"}}
|
||||
<div class="block">
|
||||
<section class="hero is-light is-bold">
|
||||
<section class="hero is-link is-bold">
|
||||
<div class="hero-body">
|
||||
<div class="container">
|
||||
<div class="level">
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
{{define "title"}}{{.Forum.Title}}{{end}}
|
||||
{{define "content"}}
|
||||
<div class="block">
|
||||
<section class="hero is-light is-success">
|
||||
<section class="hero is-link is-bold">
|
||||
<div class="hero-body">
|
||||
<div class="container">
|
||||
<div class="level">
|
||||
|
|
@ -108,7 +108,7 @@
|
|||
<div class="block p-2">
|
||||
{{range .Threads}}
|
||||
{{$Stats := $Root.ThreadMap.Get .ID}}
|
||||
<div class="box has-background-success-light has-text-dark">
|
||||
<div class="box nonshy-forum-box-1 has-text-dark">
|
||||
<div class="columns">
|
||||
<div class="column is-2 has-text-centered pt-0 pb-1">
|
||||
<!-- Thread starter is blocked? -->
|
||||
|
|
@ -171,7 +171,7 @@
|
|||
<div class="column is-narrow pb-1 pt-0 px-1">
|
||||
<div class="columns is-mobile">
|
||||
<div class="column has-text-centered pr-1">
|
||||
<div class="box p-2">
|
||||
<div class="box nonshy-forum-box-3 p-2">
|
||||
<p class="is-size-7">Replies</p>
|
||||
{{if $Stats}}
|
||||
{{$Stats.Replies}}
|
||||
|
|
@ -181,7 +181,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="column has-text-centered pl-1">
|
||||
<div class="box p-2">
|
||||
<div class="box nonshy-forum-box-3 p-2">
|
||||
<p class="is-size-7">Views</p>
|
||||
{{if $Stats}}
|
||||
{{$Stats.Views}}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
{{define "title"}}Forums{{end}}
|
||||
{{define "content"}}
|
||||
<div class="block">
|
||||
<section class="hero is-light is-success">
|
||||
<section class="hero is-link is-bold">
|
||||
<div class="hero-body">
|
||||
<div class="container">
|
||||
<div class="level">
|
||||
|
|
@ -154,7 +154,7 @@
|
|||
{{else}}
|
||||
{{range .Forums}}
|
||||
{{$Stats := $Root.ForumMap.Get .ID}}
|
||||
<div class="card block has-background-primary-light has-text-dark">
|
||||
<div class="card block nonshy-forum-box-1 has-text-dark">
|
||||
<div class="card-content">
|
||||
<div class="columns">
|
||||
<div class="column is-3 pt-0 pb-1">
|
||||
|
|
@ -230,7 +230,7 @@
|
|||
|
||||
</div>
|
||||
<div class="column py-1">
|
||||
<div class="box has-background-success-light has-text-dark">
|
||||
<div class="box nonshy-forum-box-2 has-text-dark">
|
||||
<h2 class="subtitle mb-1 has-text-dark">Latest Post</h2>
|
||||
{{if $Stats.RecentThread}}
|
||||
<a href="/go/comment?id={{$Stats.RecentPost.ID}}">
|
||||
|
|
@ -253,7 +253,7 @@
|
|||
<div class="column is-3 py-1">
|
||||
<div class="columns is-mobile is-gapless">
|
||||
<div class="column has-text-centered mr-1">
|
||||
<div class="box has-background-warning-light has-text-dark p-2">
|
||||
<div class="box nonshy-forum-box-3 has-text-dark p-2">
|
||||
<p class="is-size-7 has-text-dark">Topics</p>
|
||||
{{if $Stats}}
|
||||
{{$Stats.Threads}}
|
||||
|
|
@ -263,7 +263,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="column has-text-centered mx-1">
|
||||
<div class="box has-background-warning-light has-text-dark p-2">
|
||||
<div class="box nonshy-forum-box-3 has-text-dark p-2">
|
||||
<p class="is-size-7 has-text-dark">Posts</p>
|
||||
{{if $Stats}}
|
||||
{{$Stats.Posts}}
|
||||
|
|
@ -273,7 +273,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="column has-text-centered ml-1">
|
||||
<div class="box has-background-warning-light has-text-dark p-2">
|
||||
<div class="box nonshy-forum-box-3 has-text-dark p-2">
|
||||
<p class="is-size-7 has-text-dark">Users</p>
|
||||
{{if $Stats}}
|
||||
{{$Stats.Users}}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
{{define "title"}}Newest Posts - Forums{{end}}
|
||||
{{define "content"}}
|
||||
<div class="block">
|
||||
<section class="hero is-light is-success">
|
||||
<section class="hero is-link is-bold">
|
||||
<div class="hero-body">
|
||||
<h1 class="title">
|
||||
<span class="icon mr-4"><i class="fa fa-comments"></i></span>
|
||||
|
|
@ -91,7 +91,7 @@
|
|||
<div class="p-4">
|
||||
{{range .RecentPosts}}
|
||||
{{$User := .Thread.Comment.User}}
|
||||
<div class="card block has-background-link-light">
|
||||
<div class="card block nonshy-forum-box-1">
|
||||
<div class="card-content">
|
||||
<div class="columns">
|
||||
<div class="column is-narrow has-text-centered pt-0 pb-1">
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
{{define "title"}}Newest Posts - Forums{{end}}
|
||||
{{define "content"}}
|
||||
<div class="block">
|
||||
<section class="hero is-light is-success">
|
||||
<section class="hero is-link is-bold">
|
||||
<div class="hero-body">
|
||||
<h1 class="title">
|
||||
<span class="icon mr-4"><i class="fa fa-comments"></i></span>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
{{define "title"}}{{.Thread.Title}} - {{.Forum.Title}}{{end}}
|
||||
{{define "content"}}
|
||||
<div class="block">
|
||||
<section class="hero is-light is-success">
|
||||
<section class="hero is-link is-bold">
|
||||
<div class="hero-body">
|
||||
<div class="container">
|
||||
<div class="level">
|
||||
|
|
@ -130,7 +130,7 @@
|
|||
{{$Root := .}}
|
||||
<div class="block p-2">
|
||||
{{range $i, $c := .Comments}}
|
||||
<div class="box has-background-link-light has-text-dark" id="p{{.ID}}">
|
||||
<div class="box nonshy-forum-box-1 has-text-dark" id="p{{.ID}}">
|
||||
<div class="columns">
|
||||
<div class="column is-2 has-text-centered">
|
||||
<!-- Thread starter is blocked? -->
|
||||
|
|
|
|||
|
|
@ -277,7 +277,7 @@
|
|||
</p>
|
||||
{{else}}
|
||||
{{range .Comments}}
|
||||
<div class="box has-background-link-light has-text-dark" id="p{{.ID}}">
|
||||
<div class="box nonshy-forum-box-1 has-text-dark" id="p{{.ID}}">
|
||||
<div class="columns">
|
||||
<div class="column is-2 has-text-centered">
|
||||
<!-- User has no display name distinct from their username? -->
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user