Add option to increase line height

LICENSE

@@ -1,4 +1,4 @@
-Copyright (c) 2013-2024, Gochan development group
+Copyright (c) 2013-2025, Gochan development group
 All rights reserved.
 
 Redistribution and use in source and binary forms, with or without

frontend/sass/global.scss

@@ -6,20 +6,24 @@
 @import "global/watcher";
 @import 'global/bans';
 
+.increase-line-height {
+	line-height: 1.5;
+}
+
 header {
-	margin-top:50px;
-	text-align:center;
+	margin-top: 50px;
+	text-align: center;
 	h1 {
 		margin: 0px;
 	}
 }
 
 div#topbar {
-	left:0;
-	position:fixed;
-	top:0;
-	width:100%;
-	margin-top:0px;
+	left: 0;
+	position: fixed;
+	top: 0;
+	width: 100%;
+	margin-top: 0px;
 
 	* {
 		padding: 4px;
@@ -63,15 +67,15 @@ div#staffmenu {
 div.section-block {
 	margin-bottom: 8px;
 	div.section-title-block {
-		display:block;
-		padding:4px 8px 4px 8px;
+		display: block;
+		padding: 4px 8px 4px 8px;
 	}
 	div.section-body {
 		overflow-y: hidden;
 		margin-right: 0px;
 		margin-bottom:8px;
 		min-height: 48px;
-		padding:8px;
+		padding: 8px;
 	}
 }
 
@@ -81,12 +85,12 @@ div.section-block {
 }
 
 #footer {
-	bottom:0px;
-	clear:both;
-	left:0px;
-	position:static;
-	text-align:center;
-	width:100%;
+	bottom: 0px;
+	clear: both;
+	left: 0px;
+	position: static;
+	text-align: center;
+	width: 100%;
 }
 
 select.post-actions {

frontend/ts/settings.ts

@@ -107,6 +107,7 @@ interface MinMax {
 	min?: number;
 	max?: number;
 }
+
 class NumberSetting extends Setting<number, HTMLInputElement> {
 	constructor(key: string, title: string, defaultVal = 0, minMax: MinMax = {min: null, max: null}, onSave?:()=>any) {
 		super(key, title, defaultVal, onSave);
@@ -205,6 +206,15 @@ export function setTheme() {
 		else
 			themeElem.setAttribute("href", path.join(webroot ?? "/", "css", style));
 	}
+	setLineHeight();
+}
+
+function setLineHeight() {
+	if(getBooleanStorageVal("increaselineheight", false)) {
+		document.body.classList.add("increase-line-height");
+	} else {
+		document.body.classList.remove("increase-line-height");
+	}
 }
 
 /**
@@ -249,16 +259,17 @@ $(() => {
 		}
 	}) as Setting);
 	settings.set("pintopbar", new BooleanSetting("pintopbar", "Pin top bar", true, initTopBar));
+	settings.set("increaselineheight", new BooleanSetting("increaselineheight", "Increase line height", false, setLineHeight));
 	settings.set("enableposthover", new BooleanSetting("enableposthover", "Preview post on hover", true, initPostPreviews));
 	settings.set("enablepostclick", new BooleanSetting("enablepostclick", "Preview post on click", true, initPostPreviews));
 	settings.set("useqr", new BooleanSetting("useqr", "Use Quick Reply box", true, () => {
 		if(getBooleanStorageVal("useqr", true)) initQR();
 		else closeQR();
 	}));
+	settings.set("persistentqr", new BooleanSetting("persistentqr", "Persistent Quick Reply", false));
 	settings.set("watcherseconds", new NumberSetting("watcherseconds", "Check watched threads every # seconds", 15, {
 		min: 2
 	}, initWatcher));
-	settings.set("persistentqr", new BooleanSetting("persistentqr", "Persistent Quick Reply", false));
 	settings.set("newuploader", new BooleanSetting("newuploader", "Use new upload element", true, updateBrowseButton));
 
 	settings.set("customjs", new TextSetting("customjs", "Custom JavaScript", ""));

html/css/global.css

@@ -597,6 +597,10 @@ img#banpage-image {
   margin: 4px 8px 8px 4px;
 }
 
+.increase-line-height {
+  line-height: 1.5;
+}
+
 header {
   margin-top: 50px;
   text-align: center;