diff options
| -rw-r--r-- | client.go | 13 | ||||
| -rw-r--r-- | static/archive.html | 2 | ||||
| -rw-r--r-- | static/css/gruvbox.css | 63 | ||||
| -rw-r--r-- | static/css/style.css | 85 | ||||
| -rw-r--r-- | static/js/themes.js | 24 | ||||
| -rw-r--r-- | static/main.html | 80 | ||||
| -rw-r--r-- | static/posts.html | 6 | ||||
| -rw-r--r-- | static/top.html | 2 |
8 files changed, 187 insertions, 88 deletions
@@ -216,7 +216,7 @@ func OutboxGet(w http.ResponseWriter, r *http.Request, db *sql.DB, collection Co "parseReplyLink": func(actorId string, op string, id string, content string) template.HTML { actor := FingerActor(actorId) title := strings.ReplaceAll(ParseLinkTitle(actor.Id, op, content), `/\<`, ">") - link := "<a href=\"" + actor.Name + "/" + shortURL(actor.Outbox, op) + "#" + shortURL(actor.Outbox, id) + "\" title=\"" + title + "\">>>" + shortURL(actor.Outbox, id) + "</a>" + link := "<a href=\"" + actor.Name + "/" + shortURL(actor.Outbox, op) + "#" + shortURL(actor.Outbox, id) + "\" title=\"" + title + "\" class=\"replyLink\">>>" + shortURL(actor.Outbox, id) + "</a>" return template.HTML(link) }, "add": func(i, j int) int { @@ -403,7 +403,7 @@ func PostGet(w http.ResponseWriter, r *http.Request, db *sql.DB) { "parseReplyLink": func(actorId string, op string, id string, content string) template.HTML { actor := FingerActor(actorId) title := strings.ReplaceAll(ParseLinkTitle(actor.Id, op, content), `/\<`, ">") - link := "<a href=\"" + actor.Name + "/" + shortURL(actor.Outbox, op) + "#" + shortURL(actor.Outbox, id) + "\" title=\"" + title + "\">>>" + shortURL(actor.Outbox, id) + "</a>" + link := "<a href=\"" + actor.Name + "/" + shortURL(actor.Outbox, op) + "#" + shortURL(actor.Outbox, id) + "\" title=\"" + title + "\" class=\"replyLink\">>>" + shortURL(actor.Outbox, id) + "</a>" return template.HTML(link) }, "sub": func(i, j int) int { return i - j }}).ParseFiles("./static/main.html", "./static/npost.html", "./static/top.html", "./static/bottom.html", "./static/posts.html")) @@ -886,17 +886,12 @@ func ParseLinkComments(db *sql.DB, board Actor, op string, content string, threa } } - var style string - if board.Restricted { - style = "color: #af0a0f;" - } - //replace link with quote format replyID, isReply := IsReplyToOP(db, op, parsedLink) if isReply { id := shortURL(board.Outbox, replyID) - content = strings.Replace(content, match[i][0], "<a class=\"reply\" style=\""+style+"\" title=\""+quoteTitle+"\" href=\"/"+board.Name+"/"+shortURL(board.Outbox, op)+"#"+id+"\">>>"+id+""+isOP+"</a>", -1) + content = strings.Replace(content, match[i][0], "<a class=\"reply\" title=\""+quoteTitle+"\" href=\"/"+board.Name+"/"+shortURL(board.Outbox, op)+"#"+id+"\">>>"+id+""+isOP+"</a>", -1) } else { @@ -909,7 +904,7 @@ func ParseLinkComments(db *sql.DB, board Actor, op string, content string, threa } if actor.Id != "" { - content = strings.Replace(content, match[i][0], "<a class=\"reply\" style=\""+style+"\" title=\""+quoteTitle+"\" href=\""+link+"\">>>"+shortURL(board.Outbox, parsedLink)+isOP+" →</a>", -1) + content = strings.Replace(content, match[i][0], "<a class=\"reply\" title=\""+quoteTitle+"\" href=\""+link+"\">>>"+shortURL(board.Outbox, parsedLink)+isOP+" →</a>", -1) } } } diff --git a/static/archive.html b/static/archive.html index b08693a..3e040bc 100644 --- a/static/archive.html +++ b/static/archive.html @@ -20,7 +20,7 @@ {{ end }} {{ define "top" }} -<h1 style="text-align: center; color: #af0a0f;">/{{ .Board.Name }}/ - {{ .Board.PrefName }}</h1> +<h1>/{{ .Board.Name }}/ - {{ .Board.PrefName }}</h1> <p style="text-align: center;">{{ .Board.Summary }}</p> <h1 style="text-align: center;">Archived Posts</h1> {{ end }} diff --git a/static/css/gruvbox.css b/static/css/gruvbox.css new file mode 100644 index 0000000..fb39ea4 --- /dev/null +++ b/static/css/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/css/style.css b/static/css/style.css new file mode 100644 index 0000000..fa76b50 --- /dev/null +++ b/static/css/style.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/js/themes.js b/static/js/themes.js new file mode 100644 index 0000000..0d9772f --- /dev/null +++ b/static/js/themes.js @@ -0,0 +1,24 @@ +function setCookie(key, value, age) { + document.cookie = key + "=" + encodeURIComponent(value) + ";sameSite=strict;max-age=" + 60 * 60 * 24 * age + ";path=/"; +} + +function getCookie(key) { + if (document.cookie.length != 0) { + return document.cookie.split('; ').find(row => row.startsWith(key)).split('=')[1]; + } + return ""; +} + +function setTheme(name) { + for (let i = 0, tags = document.getElementsByTagName("link"); i < tags.length; i++) { + if (tags[i].type === "text/css" && tags[i].title) { + tags[i].disabled = !(tags[i].title === name); + } + } + + setCookie("theme", name, 3650); +} + +function applyTheme() { + setTheme(getCookie("theme") || "default"); +} diff --git a/static/main.html b/static/main.html index 362b7b3..3fa1b66 100644 --- a/static/main.html +++ b/static/main.html @@ -8,81 +8,11 @@ <meta property="og:locale" content="en_US" /> <meta property="og:type" content="website" /> <link rel="icon" type="image/png" href="/static/favicon.png"> - <style> - 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 { - {{ if .Board.Restricted }} - background-color: #eef2fe; - color: black; - {{ else }} - background-color: #ffffee; - color: #820404 - {{ end }} - } - - .popup-box { - {{ if .Board.Restricted }} - border: 4px solid #d3caf0; - background-color: #eff5ff; - {{ else }} - border: 4px solid #f0e2d9; - background-color: #f9f9e0; - {{ end }} - } - - .box { - {{ if .Board.Restricted }} - background-color: #eff5ff; - {{ else }} - background-color: #f9f9e0; - {{ end }} - } - - .box-alt { - {{ if .Board.Restricted }} - background-color: #d3caf0; - {{ else }} - background-color: #f0e2d9; - {{ end }} - } - - .quote { - color: #789922; - } - - .post { - {{ if .Board.Restricted }} - background-color: #d5daf0; - {{ else }} - background-color: #f0e0d6; - {{ end }} - } - - :target > div > .post { - {{ if .Board.Restricted }} - background-color: #d6bad0; - {{ else }} - background-color: #f0c0b0; - {{ end }} - } - .tripcode { - color: #117743; - } - </style> + <link rel="stylesheet" type="text/css" href="/static/css/style.css" title="default"> + <link rel="alternate stylesheet" type="text/css" href="/static/css/gruvbox.css" title="gruvbox"> {{ template "header" . }} </head> - <body> + <body {{ if not .Board.Restricted }}class="nsfw"{{ end }} onload="applyTheme()"> <ul style="display: inline; padding:0;"> {{ $l := len .Boards }} <li style="display: inline;">[<a href="/">Home</a>]</li> @@ -112,8 +42,10 @@ <a href="/">[Home]</a><a href="/static/rules.html">[Rules]</a><a href="/static/faq.html">[FAQ]</a> <p>All trademarks and copyrights on this page are owned by their respective parties.</p> </div> + + <script src="/static/js/themes.js"></script> +{{ template "script" . }} </body> </html> -{{ template "script" . }} {{ end }} diff --git a/static/posts.html b/static/posts.html index 50d8b43..b9cac5e 100644 --- a/static/posts.html +++ b/static/posts.html @@ -45,7 +45,7 @@ } </script> {{ end }} - <span style="color: #0f0c5d;"><b>{{ .Name }}</b></span><span style="color: #117743;"><b>{{ if .AttributedTo }} {{.AttributedTo }} {{ else }} Anonymous {{ end }}</b></span><span class="tripcode"> {{ .TripCode }} </span><span>{{ .Published }} <a id="{{ .Id }}-anchor" href="/{{ $board.Name }}/{{ short $board.Actor.Outbox $opId }}#{{ short $board.Actor.Outbox .Id }}">No.</a> <a id="{{ .Id }}-link" title="{{ .Id }}" {{ if eq .Type "Note" }} href="javascript:quote('{{ $board.Actor.Id }}', '{{ $opId }}', '{{ .Id }}')" {{ end }}>{{ short $board.Actor.Outbox .Id }}</a> {{ if ne .Type "Tombstone" }}<a href="javascript:report('{{ $board.Actor.Id }}', '{{ .Id }}')">[Report]</a>{{ end }}</span> + <span class="subject"><b>{{ .Name }}</b></span><span class="name"><b>{{ if .AttributedTo }} {{.AttributedTo }} {{ else }} Anonymous {{ end }}</b></span><span class="tripcode"> {{ .TripCode }} </span><span>{{ .Published }} <a id="{{ .Id }}-anchor" href="/{{ $board.Name }}/{{ short $board.Actor.Outbox $opId }}#{{ short $board.Actor.Outbox .Id }}">No.</a> <a id="{{ .Id }}-link" title="{{ .Id }}" {{ if eq .Type "Note" }} href="javascript:quote('{{ $board.Actor.Id }}', '{{ $opId }}', '{{ .Id }}')" {{ end }}>{{ short $board.Actor.Outbox .Id }}</a> {{ if ne .Type "Tombstone" }}<a href="javascript:report('{{ $board.Actor.Id }}', '{{ .Id }}')">[Report]</a>{{ end }}</span> <p id="{{ .Id }}-content" style="white-space: pre-wrap; margin: 10px 30px 10px 30px;">{{ parseContent $board.Actor $opId .Content $thread }}</p> {{ if .Replies }} {{ $replies := .Replies }} @@ -57,7 +57,7 @@ {{ range $replies.OrderedItems }} <div id="{{ short $board.Actor.Outbox .Id }}"> <div style="display: inline-block; overflow: auto;"> - <div style="float: left; display: block; margin-right: 5px;">>></div> + <div style="float: left; display: block; margin-right: 5px;">>></div> <div class="post" style="overflow: auto; padding: 5px; margin-bottom: 2px;"> {{ if eq $board.ModCred $board.Domain $board.Actor.Id }} <a href="/delete?id={{ .Id }}&board={{ $board.Actor.Name }}">[Delete Post]</a> @@ -97,7 +97,7 @@ } </script> {{ end }} - <span style="color: #0f0c5d;"><b>{{ .Name }}</b></span><span style="color: #117743;"><b>{{ if .AttributedTo }} {{.AttributedTo }} {{ else }} Anonymous {{ end }}</b></span><span class="tripcode"> {{ .TripCode }} </span><span>{{ .Published }} <a id="{{ .Id }}-anchor" href="/{{ $board.Name }}/{{ short $board.Actor.Outbox $opId }}#{{ short $board.Actor.Outbox .Id }}">No. </a><a id="{{ .Id }}-link" title="{{ .Id }}" {{ if eq .Type "Note" }} href="javascript:quote('{{ $board.Actor.Id }}', '{{ $opId }}', '{{ .Id }}')" {{ end }}>{{ short $board.Actor.Outbox .Id }}</a> {{ if ne .Type "Tombstone" }}<a href="javascript:report('{{ $board.Actor.Id }}', '{{ .Id }}')">[Report]</a>{{ end }}</span> + <span class="subject"><b>{{ .Name }}</b></span><span class="name"><b>{{ if .AttributedTo }} {{.AttributedTo }} {{ else }} Anonymous {{ end }}</b></span><span class="tripcode"> {{ .TripCode }} </span><span>{{ .Published }} <a id="{{ .Id }}-anchor" href="/{{ $board.Name }}/{{ short $board.Actor.Outbox $opId }}#{{ short $board.Actor.Outbox .Id }}">No. </a><a id="{{ .Id }}-link" title="{{ .Id }}" {{ if eq .Type "Note" }} href="javascript:quote('{{ $board.Actor.Id }}', '{{ $opId }}', '{{ .Id }}')" {{ end }}>{{ short $board.Actor.Outbox .Id }}</a> {{ if ne .Type "Tombstone" }}<a href="javascript:report('{{ $board.Actor.Id }}', '{{ .Id }}')">[Report]</a>{{ end }}</span> {{ $parentId := .Id }} {{ if .Replies.OrderedItems }} {{ range .Replies.OrderedItems }} diff --git a/static/top.html b/static/top.html index 0081fc7..e37f221 100644 --- a/static/top.html +++ b/static/top.html @@ -1,6 +1,6 @@ {{ define "top" }} <div style="margin: 0 auto; width: 700px; margin-bottom: 100px;"> - <h1 style="text-align: center; color: #af0a0f;">/{{ .Board.Name }}/ - {{ .Board.PrefName }}</h1> + <h1 style="text-align: center;">/{{ .Board.Name }}/ - {{ .Board.PrefName }}</h1> <p style="text-align: center;">{{ .Board.Summary }}</p> {{ $len := len .Posts }} {{ if eq $len 0 }} |