diff options
Diffstat (limited to 'static')
-rw-r--r-- | static/archive.html | 2 | ||||
-rw-r--r-- | static/bottom.html | 23 | ||||
-rw-r--r-- | static/css/themes/default.css | 162 | ||||
-rw-r--r-- | static/css/themes/gruvbox.css | 140 | ||||
-rw-r--r-- | static/index.html | 40 | ||||
-rw-r--r-- | static/js/posts.js | 26 | ||||
-rw-r--r-- | static/js/themes.js | 40 | ||||
-rw-r--r-- | static/main.html | 92 | ||||
-rw-r--r-- | static/manage.html | 6 | ||||
-rw-r--r-- | static/nadmin.html | 8 | ||||
-rw-r--r-- | static/ncatalog.html | 63 | ||||
-rw-r--r-- | static/nposts.html | 30 | ||||
-rw-r--r-- | static/posts.html | 12 | ||||
-rw-r--r-- | static/top.html | 130 |
14 files changed, 552 insertions, 222 deletions
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/bottom.html b/static/bottom.html index 9d920c0..023deeb 100644 --- a/static/bottom.html +++ b/static/bottom.html @@ -1,20 +1,20 @@ {{ define "bottom" }} <div id="reply-box" class="popup-box" style="display: none;"> - <div id="reply-header" style="display: inline-block; width: 370px; z-index: 0; cursor: move;"></div><div id="reply-close" style="display: inline-block; float: right;"><a href="javascript:closeReply()">[X]</a></div> + <div id="reply-header" style="display: inline-block; z-index: 0; cursor: move;"></div><div id="reply-close" style="display: inline-block; float: right;"><a href="javascript:closeReply()">[X]</a></div> <form onsubmit="sessionStorage.setItem('element-closed-reply', true)" id="reply-post" action="/post" method="post" enctype="multipart/form-data"> <input id="reply-name" name="name" size="43" type="text" placeholder="Name" maxlength="100"> <input id="reply-options" name="options" size="43" type="text" placeholder="Options" maxlength="100"> - <textarea id="reply-comment" name="comment" rows="12" cols="54" style="width: 396px;" maxlength="2000" oninput="sessionStorage.setItem('element-reply-comment', document.getElementById('reply-comment').value)"></textarea> + <textarea id="reply-comment" name="comment" rows="12" cols="54" maxlength="2000" oninput="sessionStorage.setItem('element-reply-comment', document.getElementById('reply-comment').value)"></textarea> <input id="reply-file" name="file" type="file"> - <input id="reply-submit" type="submit" value="Reply" style="float: right;"><br><br> + <input id="reply-submit" type="submit" value="Reply" style="float: right;"> <input type="hidden" id="inReplyTo-box" name="inReplyTo" value="{{ .Board.InReplyTo }}"> <input type="hidden" id="sendTo" name="sendTo" value="{{ .Board.To }}"> <input type="hidden" id="boardName" name="boardName" value="{{ .Board.Name }}"> <input type="hidden" id="captchaCode" name="captchaCode" value="{{ .Board.CaptchaCode }}"> - <input type="hidden" id="returnTo" name="returnTo" value="{{ .ReturnTo }}"> - <input type="checkbox" name="sensitive"><span>Mark attachment as sensitive</span><br><br> + <input type="hidden" id="returnTo" name="returnTo" value="{{ .ReturnTo }}"><br> + <input type="checkbox" name="sensitive"><span>Mark attachment as sensitive</span><br> <div style="width: 202px; margin: 0 auto; padding-top: 12px;"> - <label for="captcha">Captcha:</label><br> + <label for="captcha">Captcha:</label><br> <input style="display: inline-block;" type="text" id="captcha" name="captcha" autocomplete="off"><br> </div> <div style="width: 230px; margin: 0 auto;"> @@ -23,19 +23,20 @@ </form> </div> -<div id="report-box" class="popup-box" style="display: none; "> - <div id="report-header" style="text-align: center; display: inline-block; width: 370px; z-index: 0; cursor: move;"></div><div id="report-close" style="display: inline-block; float: right;"><a href="javascript:closeReport()">[X]</a></div> +<div id="report-box" class="popup-box" style="display: none;"> + <div id="report-header" style="text-align: center; display: inline-block; z-index: 0; cursor: move;"></div><div id="report-close" style="display: inline-block; float: right;"><a href="javascript:closeReport()">[X]</a></div> <form onsubmit="sessionStorage.setItem('element-closed-report', true)" id="report-post" action="/report" method="post"> - <label for="comment">Reason:</label> + <label for="comment">Reason:</label><br> <textarea id="report-comment" name="comment" rows="12" cols="54" style="width: 396px;" maxlength="100" oninput="sessionStorage.setItem('element-report-comment', document.getElementById('report-comment').value)"></textarea> + <br> <input id="report-submit" type="submit" value="Report" style="float: right;"> <input type="hidden" id="report-inReplyTo-box" name="id" value="{{ .Board.InReplyTo }}"> <input type="hidden" id="sendTo" name="sendTo" value="{{ .Board.To }}"> <input type="hidden" id="boardName" name="board" value="{{ .Board.Name }}"> - <input type="hidden" name="close" value="0"> + <input type="hidden" name="close" value="0"> <input type="hidden" id="captchaCode" name="captchaCode" value="{{ .Board.CaptchaCode }}"> <div style="width: 202px; margin: 0 auto; padding-top: 12px;"> - <label for="captcha">Captcha:</label><br> + <label for="captcha">Captcha:</label><br> <input style="display: inline-block;" type="text" id="captcha" name="captcha" autocomplete="off"><br> </div> <div style="width: 230px; margin: 0 auto;"> diff --git a/static/css/themes/default.css b/static/css/themes/default.css new file mode 100644 index 0000000..24e85e6 --- /dev/null +++ b/static/css/themes/default.css @@ -0,0 +1,162 @@ +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 +} + +h1, h2, h3, h4, h5, h6 { + color: #af0a0f; +} + +.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; +} + +#newpostbtn { + text-align: center; + margin-top: 80px; +} + +#postForm { + margin: auto; +} + +#postForm tr > td:first-child { + background-color: #98e; + border: 1px black; + padding-left: 0.5em; + padding-right: 0.5em; +} + +.nsfw #postForm tr > td:first-child { + background-color: #ea8; +} + +#postForm input[type="text"], +#postForm textarea, +#reply-name, #reply-options, #reply-comment { + box-sizing: border-box; + -webkit-box-sizing:border-box; + -moz-box-sizing: border-box; +} + +#reply-name, #reply-options, #reply-comment { + width: 100%; +} + +#postForm #captcha { + display: block; + width: 100%; +} + +.popup-box { + position: absolute; + width: min-content; + z-index: 9; + display: block; +} + +/* TODO: rename */ +.box2 { + border: 4px solid #f0e2d9; + background-color: #f9f9e0; +} + +.newsbox { + padding: 25px; + border: 4px solid #f0e2d9; + background-color: #f9f9e0; +} + +.newsbox h2 { + margin: 0; + padding: 0; +} + +.newsbox-news { + text-align: left; + margin-left: 25px; + margin-top: 25px; + padding: 25px; +} + +.newsbox-news p, +.newsbox-news h3 { + margin: 0; +} diff --git a/static/css/themes/gruvbox.css b/static/css/themes/gruvbox.css new file mode 100644 index 0000000..fb40267 --- /dev/null +++ b/static/css/themes/gruvbox.css @@ -0,0 +1,140 @@ +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: 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; +} + +#newpostbtn { + text-align: center; + margin-top: 80px; +} + +input[type="text"] { + -webkit-appearance: none; + -webkit-border-radius: 0; +} + +#postForm { + border: 4px solid #928374; + background-color: #3c3836; + margin: auto; + +} + +#postForm tr > td:first-child { + background-color: #504945; + padding-left: 0.5em; + padding-right: 0.5em; +} + +#postForm input[type="text"], +#postForm textarea, +#reply-name, #reply-options, #reply-comment { + box-sizing: border-box; + -webkit-box-sizing:border-box; + -moz-box-sizing: border-box; +} + +#reply-name, #reply-options, #reply-comment { + width: 100%; +} + +#postForm #captcha { + display: block; + width: 100%; +} + +.popup-box { + position: absolute; + width: min-content; + z-index: 9; + display: block; +} + +/* TODO: rename */ +.box2 { + border: 4px solid #928374; + background-color: #3c3836; +} + +.newsbox { + padding: 25px; + border: 4px solid #928374; + background-color: #3c3836; +} + +.newsbox h2 { + margin: 0; + padding: 0; +} + +.newsbox-news { + text-align: left; + background-color: #504945; + margin-left: 25px; + margin-top: 25px; + padding: 25px; +} + +.newsbox-news p, +.newsbox-news h3 { + margin: 0; +} diff --git a/static/index.html b/static/index.html index b706e6b..8f1d53b 100644 --- a/static/index.html +++ b/static/index.html @@ -1,6 +1,6 @@ {{ define "header" }} <title>{{ .Title }}</title> -<meta name="description" content="{{ .PreferredUsername }} is a federated image board based on ActivityPub. The current version of the code running on the server is still a work-in-progress product, expect a bumpy ride for the time being. Get the server code here: https://github.com/FChannel0."> +<meta name="description" content="{{ .PreferredUsername }} is a federated image board based on ActivityPub. The current version of the code running on the server is still a work-in-progress product, expect a bumpy ride for the time being. Get the server code here: https://github.com/FChannel0."> <meta property="og:locale" content="en_US" /> <meta property="og:type" content="website" /> @@ -23,47 +23,45 @@ <p style="text-align: justify">{{ .PreferredUsername }} is a federated image board based on <a href="https://activitypub.rocks/">ActivityPub</a>. The current version of the code running on the server is still a work-in-progress product, expect a bumpy ride for the time being. Get the server code here: <a href="https://github.com/FChannel0">https://github.com/FChannel0</a>.</p> {{ if .Boards }} - {{ $l := len .Boards }} + {{ $l := len .Boards }} <div style="margin-top:50px;"> - <div style="display: grid;border-right: 2px solid #820404"> + <div style="display: grid;border-right: 2px solid #820404;"> {{ if lt $l 2 }} <div style="display: inline-grid; border-bottom: 2px solid #820404;border-left: 2px solid #820404;border-top: 2px solid #820404;"><span style="font-size: 1.5em;font-weight: bold;">Local boards</span></div> {{ else if eq $l 2 }} <div style="display: inline-grid; grid-column: 1 / 3; border-bottom: 2px solid #820404;border-left: 2px solid #820404;border-top: 2px solid #820404;"><span style="font-size: 1.5em;font-weight: bold;">Local boards</span></div> {{ else }} <div style="display: inline-grid;grid-column: 1 / 4;border-bottom: 2px solid #820404;border-left: 2px solid #820404;border-top: 2px solid #820404;"><span style="font-size: 1.5em;font-weight: bold;">Local boards</span></div> - {{ end }} + {{ end }} {{ range .Boards }} <div style="whitespace: nowrap;display: inline-grid;text-align: left;padding: 5px;border-bottom: 2px solid #820404;border-left: 2px solid #820404;"><a href="{{.Location}}"><b>/{{.Name}}/</b> - {{.PrefName}} {{ if not .Restricted }} [NSFW] {{ end }}</a></div> {{ end }} - {{ if gt $l 2 }} + {{ if gt $l 2 }} {{ range .BoardRemainer }} <div style="whitespace: nowrap;display: inline-grid;text-align: left;padding: 5px;border-bottom: 2px solid #820404;border-left: 2px solid #820404;"></div> {{ end }} {{ end }} - </div> + </div> </div> {{ end }} - - {{ if .NewsItems }} - <div class="popup-box" style="margin-top:50px;"> - <table style="text-align: left; margin: 25px;"> - <th> - <tr><h4><a href="/news">{{ .PreferredUsername }} News</a></h4></tr> - </th> + + {{ if .NewsItems }} + <div class="newsbox" style="margin-top:50px;"> + <h2><a href="/news">{{ .PreferredUsername }} News</a></h2> {{ range $i, $e := .NewsItems }} - <tr> - <td>{{ if $.Board.ModCred }}<a href="/{{ $.Key }}/newsdelete/{{ $e.Time }}">[Delete] </a>{{end}} - <a href="/news/{{.Time}}">{{unixtoreadable $e.Time}} - {{$e.Title}}</a> - <br><p style="margin-left: 25px;">{{$e.Content}}</p> + <div class="newsbox-news"> + <h3><a href="/news/{{.Time}}">{{unixtoreadable $e.Time}} - {{$e.Title}}</a>{{ if $.Board.ModCred }} <a href="/{{ $.Key }}/newsdelete/{{ $e.Time }}">[Delete] </a>{{end}}</h3> + <br> + + <p>{{$e.Content}}</p> </td> - </tr> + </div> {{ end }} </table> </div> - {{ end }} - - <div class="popup-box" style="margin-top:50px;"> + {{ end }} + + <div class="box2" style="margin-top:50px;"> <h4 style="margin-bottom:5px;">Current known instances</h4> <span>(always use a proxy)</span> <table style="text-align: left; margin: 25px;"> diff --git a/static/js/posts.js b/static/js/posts.js index 455e7ea..30f4893 100644 --- a/static/js/posts.js +++ b/static/js/posts.js @@ -2,29 +2,16 @@ function startNewPost(){ var el = document.getElementById("newpostbtn"); el.style="display:none;"; el.setAttribute("state", "1"); - document.getElementById("newpost").style = "display: block;"; + document.getElementById("newpost").style = ""; + sessionStorage.setItem("newpostState", true); } function stopNewPost(){ var el = document.getElementById("newpostbtn"); el.style="display:block;"; el.setAttribute("state", "0"); - document.getElementById("newpost").style = "display: hidden;"; -} - -function newpost() -{ - var state = document.getElementById("newpostbtn").getAttribute("state"); - if(state === "0") - { - startNewPost(); - sessionStorage.setItem("newpostState", true); - } - else - { - stopNewPost(); - sessionStorage.setItem("newpostState", false); - } + document.getElementById("newpost").style = "display: none;"; + sessionStorage.setItem("newpostState", false); } function shortURL(actorName, url) @@ -182,7 +169,7 @@ function quote(actorName, opid, id) var h = document.getElementById(id + "-content").offsetTop - 348; } - const boxStyle = "display: block; position: absolute; width: 400px; height: 600px; z-index: 9; top: " + h + "px; left: " + w + "px; padding: 5px;"; + const boxStyle = "top: " + h + "px; left: " + w + "px;"; box.setAttribute("style", boxStyle); sessionStorage.setItem("element-reply-style", boxStyle); sessionStorage.setItem("reply-top", h); @@ -202,7 +189,6 @@ function quote(actorName, opid, id) sessionStorage.setItem("element-reply-comment", comment.value); dragElement(header); - } function report(actorName, id) @@ -216,7 +202,7 @@ function report(actorName, id) var w = window.innerWidth / 2 - 200; var h = document.getElementById(id + "-content").offsetTop - 348; - const boxStyle = "display: block; position: absolute; width: 400px; height: 480px; z-index: 9; top: " + h + "px; left: " + w + "px; padding: 5px;"; + const boxStyle = "top: " + h + "px; left: " + w + "px;"; box.setAttribute("style", boxStyle); sessionStorage.setItem("element-report-style", boxStyle); sessionStorage.setItem("report-top", h); diff --git a/static/js/themes.js b/static/js/themes.js new file mode 100644 index 0000000..3f1b906 --- /dev/null +++ b/static/js/themes.js @@ -0,0 +1,40 @@ +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() { + // 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; + } + } + let theme = getCookie("theme") || "default"; + setTheme(theme); + + // reflect this in the switcher + let switcher = document.getElementById("themeSwitcher"); + for(var i = 0; i < switcher.options.length; i++) { + if (switcher.options[i].value === theme) { + switcher.selectedIndex = i; + break; + } + } +} diff --git a/static/main.html b/static/main.html index 362b7b3..794a602 100644 --- a/static/main.html +++ b/static/main.html @@ -8,81 +8,13 @@ <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/themes/default.css" title="default"> + {{ range .Themes }} + <link rel="alternate stylesheet" type="text/css" href="/static/css/themes/{{.}}.css" title="{{.}}"> + {{ end }} {{ 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> @@ -108,12 +40,24 @@ {{ template "content" . }} {{ template "bottom" . }} + + <div style="float: right;"> + Theme: + <select id="themeSwitcher" onchange="setTheme(this.options[this.selectedIndex].value)"> + {{ range .Themes }} + <option value="{{.}}">{{.}}</option> + {{ end }} + </select> + </div> + <div align="center" style="width: 500px; margin:0 auto; margin-top: 50px;"> <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/manage.html b/static/manage.html index 3bd621b..dc25468 100644 --- a/static/manage.html +++ b/static/manage.html @@ -20,7 +20,7 @@ {{ $board := .Board }} {{ $key := .Key }} {{ if .IsLocal }} -<div id="following" class="popup-box" style="margin-bottom: 25px; margin-top: 5px; padding: 12px;"> +<div id="following" class="box2" style="margin-bottom: 25px; margin-top: 5px; padding: 12px;"> <h4 style="margin: 0; margin-bottom: 5px;">Following</h4> {{ if .AutoSubscribe }}<a title="Auto Follow is On" href="/autosubscribe?board={{ .Board.Name }}">[Toggle Auto Follow Off]{{ else }}<a title="Auto Follow is Off" href="/autosubscribe?board={{ .Board.Name }}">[Toggle Auto Follow On]{{ end }}</a> <form id="follow-form" action="/{{ .Key }}/{{ .Board.Name }}/follow" method="post" enctype="application/x-www-form-urlencoded" style="margin-top: 5px;"> @@ -36,7 +36,7 @@ </ul> </div> -<div id="followers" class="popup-box" style="margin-bottom: 25px; padding: 12px;"> +<div id="followers" class="box2" style="margin-bottom: 25px; padding: 12px;"> <h4 style="margin: 0; margin-bottom: 5px;">Followers</h4> <ul style="display: inline-block; padding: 0; margin: 0; list-style-type: none;"> {{ range .Followers }} @@ -46,7 +46,7 @@ </div> {{ end }} -<div id="reported" class="popup-box" style="margin-bottom: 25px; padding: 12px;"> +<div id="reported" class="box2" style="margin-bottom: 25px; padding: 12px;"> <h4 style="margin: 0; margin-bottom: 5px;">Reported</h4> <ul style="display: inline-block; padding: 0; margin: 0; list-style-type: none;"> {{ $domain := .Domain }} diff --git a/static/nadmin.html b/static/nadmin.html index 5e38151..e8fbc36 100644 --- a/static/nadmin.html +++ b/static/nadmin.html @@ -26,7 +26,7 @@ </div> -<div id="following" class="popup-box" style="margin-bottom: 25px; padding: 12px;"> +<div id="following" class="box2" style="margin-bottom: 25px; padding: 12px;"> <h4 style="margin: 0; margin-bottom: 5px;">Subscribed</h4> <form id="follow-form" action="/{{ .Key }}/follow" method="post" enctype="application/x-www-form-urlencoded"> <input id="follow" name="follow" style="margin-bottom: 12px;" placeholder="http://localhost:3000/g"></input><input type="submit" value="Subscribe"><br> @@ -41,7 +41,7 @@ </ul> </div> -<div id="followers" class="popup-box" style="margin-bottom: 25px; padding: 12px; display:none;"> +<div id="followers" class="box2" style="margin-bottom: 25px; padding: 12px; display:none;"> <h4 style="margin: 0; margin-bottom: 5px;">Followers</h4> <ul style="display: inline-block; padding: 0; margin: 0; list-style-type: none;"> {{ range .Followers }} @@ -50,7 +50,7 @@ </ul> </div> -<div class="popup-box" style="margin-bottom: 25px; padding: 12px;"> +<div class="box2" style="margin-bottom: 25px; padding: 12px;"> <h3>Create News</h3> <form id="news" action="/{{ .Key }}/postnews" method="post" enctype="application/x-www-form-urlencoded"> <label>Title:</label><br> @@ -60,7 +60,7 @@ </form> </div> -<div id="regex" class="popup-box" style="margin-bottom: 25px; padding: 12px;"> +<div id="regex" class="box2" style="margin-bottom: 25px; padding: 12px;"> <h3>Regex Post Blacklist</h3> <form id="blacklist" action="/blacklist" method="post" enctype="application/x-www-form-urlencoded"> <label>Regex:</label><br> diff --git a/static/ncatalog.html b/static/ncatalog.html index e35edd0..ec8afd5 100644 --- a/static/ncatalog.html +++ b/static/ncatalog.html @@ -17,14 +17,16 @@ {{ define "content" }} {{ $board := .Board }} <hr> -<ul style="margin: 0; padding: 0; display: inline"> - <li style="display: inline"><a href="/{{ $board.Name }}">[Return]</a></li> + +<div class="navlinks"> + [<a href="/{{ $board.Name }}/">Return</a>] {{ if showArchive }} - <li style="display: inline"><a href="/{{ $board.Name }}/archive">[Archive]</a></li> + [<a href="/{{ $board.Name }}/archive">Archive</a>] {{ end }} - <li style="display: inline"><a href="#bottom">[Bottom]</a></li> - <li style="display: inline"><a href="javascript:location.reload()">[Refresh]</a></li> -</ul> + [<a href="#bottom">Bottom</a>] + [<a href="javascript:location.reload()">Refresh</a>] +</div> + <hr> <div style="padding: 10px; text-align: center;"> @@ -39,7 +41,12 @@ <a href="/marksensitive?id={{ .Id }}&board={{ $board.Actor.Name }}">[Mark Sensitive]</a> {{ end }} <div id="hide-{{ .Id }}" style="display: none;">[Hide]</div> - <div id="sensitive-{{ .Id }}" style="display: none;"><div style="position: relative; text-align: center;"><img id="sensitive-img-{{ .Id }}" style="float: left; margin-right: 10px; margin-bottom: 10px; max-width: 180px; max-height: 180px;" src="/static/sensitive.png"><div id="sensitive-text-{{ .Id }}" style="width: 170px; position: absolute; margin-top: 75px; padding: 5px; background-color: black; color: white; cursor: default; ">NSFW Content</div></div></div> + <div id="sensitive-{{ .Id }}" style="display: none;"> + <div style="position: relative; text-align: center;"> + <img id="sensitive-img-{{ .Id }}" style="float: left; margin-right: 10px; margin-bottom: 10px; max-width: 180px; max-height: 180px;" src="/static/sensitive.png"> + <div id="sensitive-text-{{ .Id }}" style="width: 170px; position: absolute; margin-top: 75px; padding: 5px; background-color: black; color: white; cursor: default; ">NSFW Content</div> + </div> + </div> <a id="{{ .Id }}-anchor" href="/{{ $board.Name }}/{{ short $board.Actor.Outbox .Id}}"> <div id="media-{{ .Id }}" style="width:180px;"> {{ parseAttachment . true }}</div> </a> @@ -67,33 +74,37 @@ } </script> {{ end }} - <a id="{{ .Id }}-link" href="/{{ $board.Name }}/{{ short $board.Actor.Outbox .Id }}"> - <div> - {{ $replies := .Replies }} - {{ if $replies }} - <span style="display: block;">R: {{ $replies.TotalItems }}{{ if $replies.TotalImgs }}/ A: {{ $replies.TotalImgs }}{{ end }}</span> - {{ end }} - {{ if .Name }} - <span style="display: block; color: #0f0c5d;"><b>{{ .Name }}</b></span> - {{ end }} + <a style="color: unset;" id="{{ .Id }}-link" href="/{{ $board.Name }}/{{ short $board.Actor.Outbox .Id }}"> + <div style="display: block;"> + {{ $replies := .Replies }} + {{ if $replies }} + <span>R: {{ $replies.TotalItems }}{{ if $replies.TotalImgs }}/ A: {{ $replies.TotalImgs }}{{ end }}</span> + {{ end }} + {{ if .Name }} + <br> + <span class="subject"><b>{{ .Name }}</b></span> + {{ end }} - {{ if .Content }} - <span style="display: block">{{.Content}}</span> - {{ end }} - </div> + {{ if .Content }} + <br> + <span>{{.Content}}</span> + {{ end }} + </div> </a> </div> {{ end }} </div> <hr> -<ul style="margin: 0; padding: 0; display: inline"> - <li style="display: inline"><a href="/{{ $board.Name }}">[Return]</a></li> + +<div class="navlinks"> + [<a href="/{{ $board.Name }}/">Return</a>] {{ if showArchive }} - <li style="display: inline"><a href="/{{ $board.Name }}/archive">[Archive]</a></li> + [<a href="/{{ $board.Name }}/archive">Archive</a>] {{ end }} - <li style="display: inline"><a id="bottom" href="#top">[Top]</a></li> - <li style="display: inline"><a href="javascript:location.reload()">[Refresh]</a></li> -</ul> + [<a href="#top">Top</a>] + [<a href="javascript:location.reload()">Refresh</a>] +</div> + <hr> {{ end }} {{ define "bottom" }} diff --git a/static/nposts.html b/static/nposts.html index 6def8b2..46d8bb1 100644 --- a/static/nposts.html +++ b/static/nposts.html @@ -15,33 +15,35 @@ {{ define "content" }} {{ $board := .Board }} <hr> -<ul style="margin: 0; padding: 0; display: inline"> - <li style="display: inline"><a href="/{{ $board.Name }}/catalog">[Catalog]</a></li> +<div class="navlinks"> + [<a href="/{{ $board.Name }}/catalog">Catalog</a>] {{ if showArchive }} - <li style="display: inline"><a href="/{{ $board.Name }}/archive">[Archive]</a></li> + [<a href="/{{ $board.Name }}/archive">Archive</a>] {{ end }} - <li style="display: inline"><a href="#bottom">[Bottom]</a></li> - <li style="display: inline"><a href="javascript:location.reload()">[Refresh]</a></li> -</ul> + [<a href="#bottom">Bottom</a>] + [<a href="javascript:location.reload()">Refresh</a>] +</div> {{ template "posts" . }} <hr> -<ul style="margin: 0; padding: 0; display: inline"> - <li style="display: inline"><a href="/{{ $board.Name }}/catalog">[Catalog]</a></li> + +<div class="navlinks"> + [<a href="/{{ $board.Name }}/catalog">Catalog</a>] {{ if showArchive }} - <li style="display: inline"><a href="/{{ $board.Name }}/archive">[Archive]</a></li> + [<a href="/{{ $board.Name }}/archive">Archive</a>] {{ end }} - <li style="display: inline"><a id="bottom" href="#top">[Top]</a></li> - <li style="display: inline"><a href="javascript:location.reload()">[Refresh]</a></li> -</ul> + [<a href="#top" id="bottom">Top</a>] + [<a href="javascript:location.reload()">Refresh</a>] +</div> + <hr> {{ if gt .TotalPage 0 }} {{ $totalPage := .TotalPage }} <ul style="float: right; margin: 0; padding: 0; display: inline"> {{ $page := .CurrentPage }} {{ if gt $page 0 }} - <li style="display: inline"><a href="/{{ $board.Name }}?page={{ sub $page 1 }}">[ < ]</a></li> + <li style="display: inline"><a href="/{{ $board.Name }}?page={{ sub $page 1 }}">[ < ]</a></li> {{ end }} {{ range $i, $e := .Pages }} {{ if eq $i $page}} @@ -51,7 +53,7 @@ {{ end }} {{ end }} {{ if lt .CurrentPage .TotalPage }} - <li style="display: inline"><a href="/{{ $board.Name }}?page={{ add $page 1 }}">[ > ]</a></li> + <li style="display: inline"><a href="/{{ $board.Name }}?page={{ add $page 1 }}">[ > ]</a></li> {{ end }} </ul> {{ end }} diff --git a/static/posts.html b/static/posts.html index 50d8b43..7110dd9 100644 --- a/static/posts.html +++ b/static/posts.html @@ -45,7 +45,10 @@ } </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 class="timestamp" data-utc="{{.Published | timeToUnix}}">{{ .Published | timeToReadableLong }} <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 +60,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 +100,10 @@ } </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 class="timestamp" data-utc="{{ .Published | timeToUnix }}">{{ .Published | timeToReadableLong }} <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..94abad7 100644 --- a/static/top.html +++ b/static/top.html @@ -1,39 +1,59 @@ {{ 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 }} {{ if .Board.InReplyTo }} - <h3 id="newpostbtn" state="0" style="text-align: center; margin-top: 80px; display: none;"><a href="javascript:newpost()">[Post a Reply]</a></h3> + <h3 id="newpostbtn" state="0" style="display: none;"><a href="javascript:startNewPost()">[Post a Reply]</a></h3> {{ else }} - <h3 id="newpostbtn" state="0" style="text-align: center; margin-top: 80px; display: none;"><a href="javascript:newpost()">[Start a New Thread]</a></h3> + <h3 id="newpostbtn" state="0" style="display: none;"><a href="javascript:startNewPost()">[Start a New Thread]</a></h3> {{ end }} <!-- end if inreplyto--> <div id="newpost"> - <form onsubmit="sessionStorage.setItem('element-closed-reply', true)" id="new-post" action="/post" method="post" enctype="multipart/form-data" style="margin-left: 180px;"> - <label for="name">Name:</label><br> - <input type="text" id="name" name="name" placeholder="Anonymous" maxlength="100"><br> - <label for="options">Options:</label><br> - <input type="text" id="options" name="options" maxlength="100" style="margin-right:10px">{{ if .Board.InReplyTo }}<input type="submit" value="Post">{{ end }}<br> - {{ if eq .Board.InReplyTo "" }} - <label for="subject">Subject:</label><br> - <input type="text" id="subject" name="subject" maxlength="100" style="margin-right:10px"><input type="submit" value="Post"><br> - {{ end }} - <label for="comment">Comment:</label><br> - <textarea rows="10" cols="50" id="comment" name="comment" maxlength="2000"></textarea><br> + <form onsubmit="sessionStorage.setItem('element-closed-reply', true)" id="new-post" action="/post" method="post" enctype="multipart/form-data"> + <table id="postForm"> + <tr> + <tr> + <td><label for="name">Name:</label></td> + <td><input type="text" id="name" name="name" placeholder="Anonymous" maxlength="100"> + <a onclick="stopNewPost()" style="float: right;">[X]</a> + </td> + </tr> + <tr> + <td><label for="options">Options:</label></td> + <td><input type="text" id="options" name="options" maxlength="100" style="margin-right:10px">{{ if .Board.InReplyTo }}<input type="submit" value="Post">{{ end }}</td> + </tr> + {{ if eq .Board.InReplyTo "" }} + <tr> + <td><label for="subject">Subject:</label></td> + <td><input type="text" id="subject" name="subject" maxlength="100" style="margin-right:10px"><input type="submit" value="Post"></td> + </tr> + {{ end }} + <tr> + <td><label for="comment">Comment:</label></td> + <td><textarea rows="10" cols="50" id="comment" name="comment" maxlength="2000"></textarea></td> + </tr> + <tr> + <td><label for="file">Image</label></td> + <td><input type="file" id="file" name="file" {{ if gt $len 1 }} required {{ else }} {{ if eq $len 0 }} required {{ end }} {{ end }} > + <br><input type="checkbox" name="sensitive">Mark sensitive</input></td> + </tr> + <tr> + <td><label for="captcha">Captcha:</label></td> + <td> + <div style="height: 65px; display: inline;"> + <img src="{{ .Board.Captcha }}"> + </div> + <input type="text" id="captcha" name="captcha" autocomplete="off"> + </td> + </tr> + </table> + <input type="hidden" id="inReplyTo" name="inReplyTo" value="{{ .Board.InReplyTo }}"> <input type="hidden" id="sendTo" name="sendTo" value="{{ .Board.To }}"> <input type="hidden" id="boardName" name="boardName" value="{{ .Board.Name }}"> <input type="hidden" id="captchaCode" name="captchaCode" value="{{ .Board.CaptchaCode }}"> <input type="hidden" id="returnTo" name="returnTo" value="{{ .ReturnTo }}"> - <input type="file" id="file" name="file" {{ if gt $len 1 }} required {{ else }} {{ if eq $len 0 }} required {{ end }} {{ end }} ><br><br> - <input type="checkbox" name="sensitive"><span>Mark attachment as sensitive</span><br><br> - <label stye="display: inline-block;" for="captcha">Captcha:</label> - <br> - <input style="display: inline-block;" type="text" id="captcha" name="captcha" autocomplete="off"><br> - <div style="height: 65px;"> - <img src="{{ .Board.Captcha }}"> - </div> </form> </div> @@ -41,37 +61,57 @@ {{ if eq (index .Posts 0).Type "Note" }} {{ if .Board.InReplyTo }} - <h3 id="newpostbtn" state="0" style="text-align: center; margin-top: 80px; display: none;"><a href="javascript:newpost()">[Post a Reply]</a></h3> + <h3 id="newpostbtn" state="0" style="text-align: center; margin-top: 80px; display: none;"><a href="javascript:startNewPost()">[Post a Reply]</a></h3> {{ else }} - <h3 id="newpostbtn" state="0" style="text-align: center; margin-top: 80px; display: none;"><a href="javascript:newpost()">[Start a New Thread]</a></h3> + <h3 id="newpostbtn" state="0" style="text-align: center; margin-top: 80px; display: none;"><a href="javascript:startNewPost()">[Start a New Thread]</a></h3> {{ end }} <!-- end if inreplyto--> {{ $len := len .Posts }} <div id="newpost"> - <form onsubmit="sessionStorage.setItem('element-closed-reply', true)" id="new-post" action="/post" method="post" enctype="multipart/form-data" style="margin-left: 180px;"> - <label for="name">Name:</label><br> - <input type="text" id="name" name="name" placeholder="Anonymous" maxlength="100"><br> - <label for="options">Options:</label><br> - <input type="text" id="options" name="options" maxlength="100" style="margin-right:10px">{{ if .Board.InReplyTo }}<input type="submit" value="Post">{{ end }}<br> - {{ if eq .Board.InReplyTo "" }} - <label for="subject">Subject:</label><br> - <input type="text" id="subject" name="subject" maxlength="100" style="margin-right:10px"><input type="submit" value="Post"><br> - {{ end }} - <label for="comment">Comment:</label><br> - <textarea rows="10" cols="50" id="comment" name="comment" maxlength="2000"></textarea><br> + <form onsubmit="sessionStorage.setItem('element-closed-reply', true)" id="new-post" action="/post" method="post" enctype="multipart/form-data"> + <table id="postForm"> + <tr> + <tr> + <td><label for="name">Name:</label></td> + <td><input type="text" id="name" name="name" placeholder="Anonymous" maxlength="100"> + <a onclick="stopNewPost()" style="float: right;">[X]</a> + </tr> + <tr> + <td><label for="options">Options:</label></td> + <td><input type="text" id="options" name="options" maxlength="100" style="margin-right:10px">{{ if .Board.InReplyTo }}<input type="submit" value="Post">{{ end }}</td> + </tr> + {{ if eq .Board.InReplyTo "" }} + <tr> + <td><label for="subject">Subject:</label></td> + <td><input type="text" id="subject" name="subject" maxlength="100" style="margin-right:10px"><input type="submit" value="Post"></td> + </tr> + {{ end }} + <tr> + <td><label for="comment">Comment:</label></td> + <td><textarea rows="10" cols="50" id="comment" name="comment" maxlength="2000"></textarea></td> + </tr> + <tr> + <td><label for="file">Image</label></td> + <td><input type="file" id="file" name="file" {{ if gt $len 1 }} required {{ else }} {{ if eq $len 0 }} required {{ end }} {{ end }} > + <br><input type="checkbox" name="sensitive">Mark sensitive</input></td> + </tr> + <tr> + <td><label for="captcha">Captcha:</label></td> + <td> + <div style="height: 65px; display: inline;"> + <img src="{{ .Board.Captcha }}"> + </div> + <input type="text" id="captcha" name="captcha" autocomplete="off"> + </td> + </tr> + </table> + <input type="hidden" id="inReplyTo" name="inReplyTo" value="{{ .Board.InReplyTo }}"> <input type="hidden" id="sendTo" name="sendTo" value="{{ .Board.To }}"> <input type="hidden" id="boardName" name="boardName" value="{{ .Board.Name }}"> <input type="hidden" id="captchaCode" name="captchaCode" value="{{ .Board.CaptchaCode }}"> - <input type="hidden" id="returnTo" name="returnTo" value="{{ .ReturnTo }}"> - <input type="file" id="file" name="file" {{ if gt $len 1 }} required {{ else }} {{ if eq $len 0 }} required {{ end }} {{ end }} ><br><br> - <input type="checkbox" name="sensitive"><span>Mark attachment as sensitive</span><br><br> - <label stye="display: inline-block;" for="captcha">Captcha:</label> - <br> - <input style="display: inline-block;" type="text" id="captcha" name="captcha" autocomplete="off"><br> - <div style="height: 65px;"> - <img src="{{ .Board.Captcha }}"> - </div> - </form> + <input type="hidden" id="returnTo" name="returnTo" value="{{ .ReturnTo }}"> </form> + </div> + </div> {{ else }} <h1 style="text-align: center;">Archived Post</h1> |