From 3a659ca4bc1fe1a5b274771ea28f956e3bd7beeb Mon Sep 17 00:00:00 2001
From: albertlast <mathiaspapealbert@hotmail.com>
Date: Sun, 9 Aug 2026 22:17:49 +0200
Subject: [PATCH] Points the board index at design tokens

The hairline the board index draws around a board group, between the
stats columns, above a child board list and above the message index
information line is one line drawn in five places, so it gets one set of
tokens. Also the board subject colour, the board picker lists and the
info center's recent posts table.

Every token holds the value the rule has today, so nothing renders
differently.

Signed-off-by: Mathias Albert <mathiaspapealbert@hotmail.com>
Signed-off-by: albertlast <mathiaspapealbert@hotmail.com>
---
 Themes/default/css/index.css     | 22 +++++++++++-----------
 Themes/default/css/variables.css | 21 +++++++++++++++++++++
 2 files changed, 32 insertions(+), 11 deletions(-)

diff --git a/Themes/default/css/index.css b/Themes/default/css/index.css
index b72959eec3..932b39ec38 100644
--- a/Themes/default/css/index.css
+++ b/Themes/default/css/index.css
@@ -2693,13 +2693,13 @@ dl {
 }
 .boardslist a {
 	font-weight: bold;
-	border-bottom: 1px solid #c4c4c4;
+	border-bottom: var(--boardslist-border-width) var(--boardslist-border-style) var(--boardslist-border-color);
 	display: block;
 	margin-bottom: 0.5em;
 }
 .boardslist a:hover {
 	text-decoration: none;
-	border-bottom: 1px solid #334466;
+	border-bottom: var(--boardslist-border-width) var(--boardslist-border-style) var(--boardslist-border-color_hover);
 }
 .boardslist label {
 	display: inline-block;
@@ -3273,8 +3273,8 @@ h3 .collapse {
 	padding: 13px 10px 10px;
 }
 .boardindex_table .board_stats p {
-	border-left: 1px solid #ddd;
-	border-right: 1px solid #ddd;
+	border-left: var(--boardindex-border-width) var(--boardindex-border-style) var(--boardindex-border-color);
+	border-right: var(--boardindex-border-width) var(--boardindex-border-style) var(--boardindex-border-color);
 }
 .info {
 	overflow: hidden;
@@ -3285,7 +3285,7 @@ h3 .collapse {
 .info .subject {
 	font-weight: 600;
 	font-size: 1.1em;
-	color: #a85400;
+	color: var(--boardindex-subject-color);
 }
 .board_stats {
 	width: 15%;
@@ -3307,14 +3307,14 @@ h3 .collapse {
 }
 .up_contain {
 	overflow: hidden;
-	border: 1px solid #ddd;
+	border: var(--boardindex-border-width) var(--boardindex-border-style) var(--boardindex-border-color);
 	margin: 0 0 3px 0;
 	display: flex;
 	flex-wrap: wrap;
 }
 /* Child boards */
 .children {
-	border-top: 1px solid #ddd;
+	border-top: var(--boardindex-border-width) var(--boardindex-border-style) var(--boardindex-border-color);
 	padding: 5px;
 	width: 100%;
 }
@@ -3341,7 +3341,7 @@ span.postby {
 	clear: both;
 }
 #info_center .sub_bar {
-	border-top: 1px solid #ddd;
+	border-top: var(--boardindex-border-width) var(--boardindex-border-style) var(--boardindex-border-color);
 }
 #info_center .sub_bar:first-child {
 	border-top: none;
@@ -3360,7 +3360,7 @@ span.postby {
 	padding: 0 4px 0 0;
 }
 #ic_recentposts td {
-	border-top: 1px solid #eaeaea;
+	border-top: var(--infocenter-row-border-width) var(--infocenter-row-border-style) var(--infocenter-row-border-color);
 	padding: 0 4px 0 0;
 	vertical-align: top;
 }
@@ -3380,7 +3380,7 @@ span.postby {
 	width: 25%;
 }
 #ic_recentposts .recenttime strong {
-	color: #555;
+	color: var(--infocenter-time-color);
 }
 #ic_recentposts .windowbg {
 	background: none;
@@ -4100,7 +4100,7 @@ p.information img {
 }
 #topic_icons .information,
 #messageindex .information {
-	border-top: 1px solid #ddd;
+	border-top: var(--boardindex-border-width) var(--boardindex-border-style) var(--boardindex-border-color);
 }
 .topic_pages {
 	font-size: 0.75em;
diff --git a/Themes/default/css/variables.css b/Themes/default/css/variables.css
index f18c29ee3e..bc73867de1 100644
--- a/Themes/default/css/variables.css
+++ b/Themes/default/css/variables.css
@@ -326,6 +326,27 @@
 	--popup-content-color:                            #222;
 	--popup-content-line-height:                      1.6em;
 
+	/** Board Index **/
+	/* The hairline the board index draws everywhere: around a board group,
+	   between the stats columns, above a child board list and above the
+	   information line on a message index. */
+	--boardindex-border-color:                        #ddd;
+	--boardindex-border-style:                        solid;
+	--boardindex-border-width:                        1px;
+	--boardindex-subject-color:                       #a85400;
+
+	/** Board Picker Lists **/
+	--boardslist-border-color:                        #c4c4c4;
+	--boardslist-border-color_hover:                  #334466;
+	--boardslist-border-style:                        solid;
+	--boardslist-border-width:                        1px;
+
+	/** Info Center **/
+	--infocenter-row-border-color:                    #eaeaea;
+	--infocenter-row-border-style:                    solid;
+	--infocenter-row-border-width:                    1px;
+	--infocenter-time-color:                          #555;
+
 	/** Search Highlight **/
 	--searchhighlight-color:                          #ff7200;
 	--searchhighlight-font-size:                      1.1em;