Cleaned up CSS.

homepage/static/assets/css/about.css

@@ -0,0 +1,51 @@
+.service-up::after { content: '●';  }
+
+.service-down::after { content: '○'; }
+
+h3:is(.service-up, .service-down)::after {
+	font-size: 1rem;
+	margin-right: -.9rem;
+	vertical-align: text-top;
+	padding-left: .2rem; }
+
+.columns {
+	column-count: 3;
+	column-fill: balance-all;
+	column-gap: 1rem;
+	column-span: none; }
+
+.columns.figs { column-count: 2; }
+
+.columns > div {
+	display: inline-block;
+	width: 100%; }
+
+.columns h3 { color: var(--primary-color); }
+
+figure figcaption { font-size: .8rem; }
+
+figure.center,
+figure figcaption { text-align: center; }
+
+figure img { width: 100%; }
+
+figure.center img { width: 60%; }
+
+#contacts,
+#donation {
+	text-align: center;
+	width: 100%;
+	word-wrap: break-word; }
+
+:is(#contacts, #donation) :is(a, span) { margin: .3rem; }
+
+#contacts span a { margin: 0; }
+
+.banners {
+	display: flex;
+	flex-wrap: wrap;
+	justify-content: center; }
+
+@media screen and (max-width: 640px) {
+	.columns,
+	.columns.figs { column-count: 1; } }

homepage/static/assets/css/articles.css

@@ -29,11 +29,10 @@ pre {
 pre {
 	border-left: 1px solid var(--primary-color);
 	padding-left: .25rem;
-	margin-bottom: .5rem;
-	margin-left: 1.6rem;
-	overflow-x: auto;
-	overflow-y: auto;
-	white-space: pre; }
+	margin: .5rem 0;
+	overflow: scroll;
+	white-space: pre-wrap;
+	word-break: break-all; }
 
 article {
 	margin-top: 1rem;

homepage/static/assets/css/guestbook.css

@@ -1,8 +1,6 @@
 ::placeholder { color: var(--primary-color); }
 
-button.refresh:disabled {
-	color: gray;
-	cursor: progress; }
+small { font-size: .8rem; }
 
 form {
 	display: grid;
@@ -36,21 +34,29 @@ textarea {
 	color: var(--text-color);
 	font: inherit; }
 
-span.checkboxes { grid-area: c; }
+.checkboxes { grid-area: c; }
 
-span.checkbox:not(:last-child) { margin-right: 2rem; }
+label { padding-left: .5rem; }
 
-span.captcha {
+button.refresh:disabled {
+	color: gray;
+	cursor: progress; }
+
+.captcha {
+	align-items: center;
+	column-gap: .5rem;
 	display: flex;
-	flex-basis: 100%;
 	grid-area: a;
-	justify-content: space-evenly; align-items: center; column-gap: .5rem; }
+	justify-content: space-evenly; }
 
-span.captcha img {
+.captcha img {
 	height: 40px;
 	width: 160px; }
 
-span.captcha input[type="text"] { width: 4.5rem; text-align: center; height: 27px; }
+.captcha input[type="text"] {
+	height: 27px;
+	text-align: center;
+	width: 4.5rem; }
 
 input[type="submit"] {
 	background-color: var(--primary-color);
@@ -60,11 +66,15 @@ input[type="submit"] {
 	grid-area: s;
 	height: 2rem; }
 
-input[type="submit"]:hover { background-color: var(--secondary-color); }
+input[type="submit"]:hover {
+	background-color: var(--secondary-color);
+	cursor: pointer; }
 
 article:not(:last-child) { margin-bottom: 1rem; }
 
-article header { display: inline; font-size: .85rem; }
+article header {
+	display: inline;
+	font-size: .85rem; }
 
 article > *,
 article div.reply > * { margin-left: .5rem; }
@@ -76,11 +86,5 @@ article p.quote { font-style: italic; }
 @media screen and (max-width: 641px) {
 	form {
 		gap: 1.5rem;
-		grid-template-areas:
-			"n"
-			"w"
-			"m"
-			"c"
-			"a"
-			"s";
-		grid-template-columns: 1fr; } }
+		display: flex;
+		flex-direction: column; } }

homepage/static/assets/css/index.css

@@ -1,7 +1,6 @@
 body {
 	height: 75vh;
-	margin-top: 25vh;
- }
+	margin-top: 25vh; }
 
 header { position: relative; }
 

homepage/static/assets/css/main.css

@@ -75,27 +75,6 @@ h3 {
 
 h3 { font-size: 1.05rem; }
 
-h3:is(.service-up, .service-down)::after {
-	font-size: 1rem;
-	margin-right: -.9rem;
-	vertical-align: text-top;
-	padding-left: .2rem; }
-
-.service-up::after { content: '●';  }
-
-.service-down::after { content: '○'; }
-
-.highlighted { color: var(--primary-color); }
-
-small,
-figure figcaption { font-size: .8rem; }
-
-figure.center,
-figure figcaption { text-align: center; }
-
-figure img { width: 100%; }
-
-figure.center img { width: 60%; }
 
 table {
 	border-collapse: collapse;
@@ -107,24 +86,7 @@ tr :is(th, td) {
 
 tr :is(th, td):not(:last-child) { padding-right: .5rem; }
 
-.columns {
-	column-count: 3;
-	column-fill: balance-all;
-	column-gap: 1rem;
-	column-span: none; }
-
-.columns.figs { column-count: 2; }
-
-.columns > div {
-	display: inline-block;
-	width: 100%; }
-
-.columns h3 { color: var(--primary-color); }
-
-.banners {
-	display: flex;
-	flex-wrap: wrap;
-	justify-content: center; }
+.highlighted { color: var(--primary-color); }
 
 html {
 	margin-left: calc(100vw - 100%);
@@ -182,16 +144,6 @@ section {
 	margin-top: 1rem;
 	max-width: 100%; }
 
-#contacts,
-#donation {
-	text-align: center;
-	width: 100%;
-	word-wrap: break-word; }
-
-:is(#contacts, #donation) :is(a, span) { margin: .3rem; }
-
-#contacts span a { margin: 0; }
-
 footer {
 	font-size: .8rem;
 	text-align: center;
@@ -202,7 +154,4 @@ footer {
 
 	#logo { width: 100%; }
 
-	body > header nav { text-align: center; }
-
-	.columns,
-	.columns.figs { column-count: 1; } }
+	body > header nav { text-align: center; } }

homepage/static/assets/css/mindflow.css

@@ -1,9 +1,9 @@
+.hidden { display: none; }
+
 button:not(:last-child) { padding-right: 1rem; }
 
 article header a { color: var(--text-color); }
 
 article footer {
 	text-align: right;
-	padding: 0; }
-
-.hidden { display: none; }
+	padding: 0; }

homepage/static/assets/js/captcha_refresh.js

@@ -13,7 +13,6 @@ async function getNewCaptcha() {
 	g_captcha_timeout_remain = g_captcha_timeout_seconds;
 }
 
-e_captcha.classList.toggle("refresh");
 e_captcha.children[3].innerHTML =
 	`<button id="refresh">Refresh</button>ed in <b><span id="remain">600</span></b> seconds.`;
 

homepage/views/about.pug

@@ -1,5 +1,8 @@
 extends base.pug
 
+block append head
+	link(href='/assets/css/about.css' rel='stylesheet')
+
 block nav
 	nav
 		a(href='/') Home
@@ -25,7 +28,7 @@ block content
 		p Contact information and banners are #[a(href='#contacts') at the bottom of this page]. Yes, I totally agree with you not wanting to add my banner since I don't have a link page myself, neither participate in any webring. :) Well, it's way easier to make a banner than a links page. :)
 		p Now a little break for...
 	section#my-cat
-		h2 My cat Boris :3
+		h2 My kot Boris :3
 		div.columns.figs
 			figure
 				a(href='/assets/img/my_cat.webp')

homepage/views/articles/setting_up_a_mail_server.pug

@@ -219,7 +219,7 @@ block article
 	pre
 		| smtp       inet  n       -       n       -       -       smtpd
 		|  -o content_filter=spamassassin
-		| submission inet n       -       n       -       -       smtpd
+		| submission inet  n       -       n       -       -       smtpd
 		|  -o syslog_name=postfix/submission
 		|  -o smtpd_tls_security_level=encrypt
 		|  -o smtpd_sasl_auth_enable=yes
@@ -232,7 +232,7 @@ block article
 		|  -o smtpd_tls_wrappermode=yes
 		|  -o smtpd_sasl_auth_enable=yes
 		| 
-		| spamassassin unix -     n       n       -       -       pipe
+		| spamassassin unix -      n       n       -       -       pipe
 		| user=spamd argv=/bin/vendor_perl/spamc
 		|  -e /sbin/sendmail -oi -f ${sender} ${recipient}
 	p #[code smtp] is listening on port 25, and #[code smtps] on port 465. #[code submission] is listening on port 587 and is used by mail client to send mail.

homepage/views/guestbook.pug

@@ -24,12 +24,10 @@ block content
 		input(type='text' maxlength='255' placeholder='Website (optional)' name='website')
 		textarea(maxlength='4096' placeholder='Your message' name='message' required)
 		span.checkboxes
-			span.checkbox
-				input(type='checkbox' id='hide-website' name='hide_website' checked)
-				label(for='hide-website') Hide website*
-			small *Only I can see if set.
+			input(type='checkbox' id='hide-website' name='hide_website' checked)
+			label(for='hide-website') Hide website #[small (only I can see if set)]
 		span.captcha
-			input(type='hidden', name='captcha_id' value=captcha_id)
+			input(type='hidden' value=captcha_id name='captcha_id')
 			img(src='/api/captcha/'+captcha_id+'/image', alt="CAPTCHA" width='160' height='40')
 			input(type='text' maxlength='6' placeholder='CAPTCHA' name='captcha_answer' required)
 			small Valid for #[b 10] minutes.