template and style changes to ban messages

gulp/res/css/style.css

@@ -299,10 +299,16 @@ p {
 	right:10px;
 }
 
-.banmessage {
+.ban {
 	color: red;
 	font-weight: bold;
 }
+.reason::before {
+	content:"\0028";
+}
+.reason::after {
+	content:"\0029";
+}
 
 .close {
 	text-decoration: none;

gulp/res/js/post.js

@@ -180,7 +180,7 @@ if (!post.message && post.files.length === 0) {
 pug_html = pug_html + "\u003Cp\u003EPost files unlinked\u003C\u002Fp\u003E";
 }
 if (post.banmessage) {
-pug_html = pug_html + "\u003Cp class=\"banmessage\"\u003EUSER WAS BANNED FOR THIS POST " + (pug_escape(null == (pug_interp = post.banmessage ? `(${post.banmessage})` : '') ? "" : pug_interp)) + "\u003C\u002Fp\u003E";
+pug_html = pug_html + "\u003Cp class=\"ban\"\u003E\u003Cspan class=\"message\"\u003EUSER WAS BANNED FOR THIS POST\u003C\u002Fspan\u003E \u003Cspan" + (" class=\"reason\""+pug_attr("data-reason", post.banmessage, true, false)) + "\u003E" + (pug_escape(null == (pug_interp = post.banmessage) ? "" : pug_interp)) + "\u003C\u002Fspan\u003E\u003C\u002Fp\u003E";
 }
 if (truncatedMessage !== post.message) {
 pug_html = pug_html + "\u003Cdiv class=\"cb mt-5 ml-5\"\u003EMessage too long. \u003Ca" + (pug_attr("href", `${postURL}#${post.postId}`, true, false)) + "\u003EView the full text\u003C\u002Fa\u003E\u003C\u002Fdiv\u003E";

gulp/res/js/themelist.js

@@ -1 +1 @@
-const themes = ['clear', 'tomorrow', 'lain'];const codeThemes = ['a11y-dark', 'a11y-light', 'agate', 'an-old-hope', 'androidstudio', 'arduino-light', 'arta', 'ascetic', 'atelier-cave-dark', 'atelier-cave-light', 'atelier-dune-dark', 'atelier-dune-light', 'atelier-estuary-dark', 'atelier-estuary-light', 'atelier-forest-dark', 'atelier-forest-light', 'atelier-heath-dark', 'atelier-heath-light', 'atelier-lakeside-dark', 'atelier-lakeside-light', 'atelier-plateau-dark', 'atelier-plateau-light', 'atelier-savanna-dark', 'atelier-savanna-light', 'atelier-seaside-dark', 'atelier-seaside-light', 'atelier-sulphurpool-dark', 'atelier-sulphurpool-light', 'atom-one-dark-reasonable', 'atom-one-dark', 'atom-one-light', 'brown-paper', 'brown-papersq', 'codepen-embed', 'color-brewer', 'darcula', 'dark', 'darkula', 'default', 'docco', 'dracula', 'far', 'foundation', 'github-gist', 'github', 'gml', 'googlecode', 'gradient-dark', 'grayscale', 'gruvbox-dark', 'gruvbox-light', 'hopscotch', 'hybrid', 'idea', 'ir-black', 'isbl-editor-dark', 'isbl-editor-light', 'kimbie.dark', 'kimbie.light', 'lightfair', 'magula', 'mono-blue', 'monokai-sublime', 'monokai', 'night-owl', 'nord', 'obsidian', 'ocean', 'paraiso-dark', 'paraiso-light', 'pojoaque', 'pojoaque', 'purebasic', 'qtcreator_dark', 'qtcreator_light', 'railscasts', 'rainbow', 'routeros', 'school-book', 'school-book', 'shades-of-purple', 'solarized-dark', 'solarized-light', 'sunburst', 'tomorrow-night-blue', 'tomorrow-night-bright', 'tomorrow-night-eighties', 'tomorrow-night', 'tomorrow', 'vs', 'vs2015', 'xcode', 'xt256', 'zenburn'];
+const themes = ['choc', 'clear', 'darkblue', 'lain', 'pink', 'tomorrow', 'yotsuba b', 'yotsuba'];const codeThemes = ['a11y-dark', 'a11y-light', 'agate', 'an-old-hope', 'androidstudio', 'arduino-light', 'arta', 'ascetic', 'atelier-cave-dark', 'atelier-cave-light', 'atelier-dune-dark', 'atelier-dune-light', 'atelier-estuary-dark', 'atelier-estuary-light', 'atelier-forest-dark', 'atelier-forest-light', 'atelier-heath-dark', 'atelier-heath-light', 'atelier-lakeside-dark', 'atelier-lakeside-light', 'atelier-plateau-dark', 'atelier-plateau-light', 'atelier-savanna-dark', 'atelier-savanna-light', 'atelier-seaside-dark', 'atelier-seaside-light', 'atelier-sulphurpool-dark', 'atelier-sulphurpool-light', 'atom-one-dark-reasonable', 'atom-one-dark', 'atom-one-light', 'brown-paper', 'brown-papersq', 'codepen-embed', 'color-brewer', 'darcula', 'dark', 'darkula', 'default', 'docco', 'dracula', 'far', 'foundation', 'github-gist', 'github', 'gml', 'googlecode', 'gradient-dark', 'grayscale', 'gruvbox-dark', 'gruvbox-light', 'hopscotch', 'hybrid', 'idea', 'ir-black', 'isbl-editor-dark', 'isbl-editor-light', 'kimbie.dark', 'kimbie.light', 'lightfair', 'magula', 'mono-blue', 'monokai-sublime', 'monokai', 'night-owl', 'nord', 'obsidian', 'ocean', 'paraiso-dark', 'paraiso-light', 'pojoaque', 'pojoaque', 'purebasic', 'qtcreator_dark', 'qtcreator_light', 'railscasts', 'rainbow', 'routeros', 'school-book', 'school-book', 'shades-of-purple', 'solarized-dark', 'solarized-light', 'sunburst', 'tomorrow-night-blue', 'tomorrow-night-bright', 'tomorrow-night-eighties', 'tomorrow-night', 'tomorrow', 'vs', 'vs2015', 'xcode', 'xt256', 'zenburn'];

views/custompages/faq.pug

@@ -186,7 +186,7 @@ block content
 				th: a(href='#post-info') What is the file size limit?
 			tr
 				td
-					p Max size of form data per-post is #{postFilesSize}. Because other fields e.g. name, message, etc contribute to this, the maximum size of file uploads will be very slightly smaller than this.
+					p The maximum size of form data per-post is #{postFilesSize}. Because name, message, etc are also counted, the effective maximum size of file uploads will be slightly less.
 	.table-container.flex-center.mv-5
 		.anchor#moderation
 		table

views/mixins/post.pug

@@ -97,7 +97,10 @@ mixin post(post, truncate, manage=false, globalmanage=false, ban=false)
 			if !post.message && post.files.length === 0
 				p Post files unlinked
 			if post.banmessage
-				p.banmessage USER WAS BANNED FOR THIS POST #{post.banmessage ? `(${post.banmessage})` : ''}
+				p.ban
+					span.message USER WAS BANNED FOR THIS POST
+					|  
+					span.reason(data-reason=post.banmessage) #{post.banmessage}
 			if truncatedMessage !== post.message
 				div.cb.mt-5.ml-5
 					| Message too long. #[a(href=`${postURL}#${post.postId}`) View the full text]