1.2.1: header bg, additional color fixes

css/_auto/custom_auto.css

@@ -1,6 +1,7 @@
 @media (prefers-color-scheme: light) {
     :root {
         --is-dark-theme: false;
+        --color-header-bg: var(--color-box-header);
         --color-primary: #4183c4;
         --color-primary-contrast: #ffffff;
         --color-primary-dark-1: #3876b3;

css/_dark/index_dark.css

@@ -46,6 +46,7 @@
 
 :root {
 	--is-dark-theme: true;
+	--color-header-bg: #333333;
 	--color-primary: #00a0fa;
 	--color-primary-contrast: #0a0a0a;
 	--color-primary-dark-1: #4ab2fa;
@@ -240,8 +241,8 @@
 	--color-secondary-bg: #303030;
 	--color-expand-button: #2f363d;
 	--color-placeholder-text: var(--color-text-light-3);
-	--color-nav-bg: #333;
-	--color-nav-hover-bg: var(--color-secondary-light-3);
+	--color-nav-bg: var(--color-secondary-light-3);
+	--color-nav-hover-bg: #3f4345;
 	--color-nav-text: var(--color-text);
 	--color-secondary-nav-bg: #0c1a28;
 	--color-label-text: var(--color-text);
@@ -389,7 +390,7 @@ button[disabled]:hover {
 .new_posts,
 .new_posts:visited,
 .new_posts:link {
-	color: var(--color-text-dark);
+	color: var(--color-white);
 	background: var(--color-green);
 }
 
@@ -680,7 +681,7 @@ div.bbc_footnotes .meaction {}
 #top_section {
 	border-top-color: var(--color-body);
 	border-bottom-color: var(--color-box-header-border);
-	background: var(--color-box-header);
+	background: var(--color-header-bg);
 }
 
 #top_section #forumtitle a,
@@ -751,7 +752,6 @@ div.bbc_footnotes .meaction {}
 #wrapper {
 	border-color: var(--color-secondary);
 	background: var(--color-card);
-	;
 }
 
 /* The footer with copyright links etc. */
@@ -833,7 +833,7 @@ div.bbc_footnotes .meaction {}
 #menu_sidebar .listlevel1:hover .linklevel1,
 #menu_current_area>strong>.linklevel1 {
 	color: var(--color-text-light);
-	border-color: var(--color-secondary-dark-2);
+	border-color: var(--color-secondary-dark-4);
 	background: var(--color-nav-hover-bg);
 	box-shadow: none;
 }
@@ -1235,7 +1235,7 @@ div.bbc_footnotes .meaction {}
 }
 
 .board_stats {
-	color: #777777;
+	color: var(--color-secondary);
 }
 
 .lastpost_link>a {
@@ -1252,7 +1252,7 @@ div.bbc_footnotes .meaction {}
 
 .childboard_row h4,
 .board_new_posts {
-	color: #777777;
+	color: var(--color-secondary);
 }
 
 /* Styles for the info center on the board index. */
@@ -1272,11 +1272,11 @@ div.bbc_footnotes .meaction {}
 
 .recentpost>strong>a,
 #info_center .inline>strong>a {
-	color: #FFA50A;
+	color: var(--color-orange-dark-2);
 }
 
 .inline>strong>a {
-	color: #1FA2E1;
+	color: var(--color-primary-dark-1);
 }
 
 #expanded_pages_container a {
@@ -1336,7 +1336,7 @@ div.bbc_footnotes .meaction {}
 }
 
 .topic_name h4 a {
-	color: #0689C8;
+	color: var(--color-primary-dark-2);
 }
 
 .sticky_row .topic_name h4 a,
@@ -1345,18 +1345,18 @@ div.bbc_footnotes .meaction {}
 }
 
 .locked_row .topic_name h4 a {
-	color: #777777;
+	color: var(--color-secondary);
 	font-style: italic;
 }
 
 .sticky_row .topic_name h4 a.new_posts,
 .locked_row.sticky_row .topic_name h4 a.new_posts,
 .locked_row .topic_name h4 a.new_posts {
-	color: #FEFEFE;
+	color: var(--color-text-dark);
 }
 
 .topic_stats {
-	color: #777777;
+	color: var(--color-secondary);
 }
 
 .qaction_row {
@@ -1477,12 +1477,12 @@ div.bbc_footnotes .meaction {}
 }
 
 .post_subject {
-	color: #777777;
+	color: var(--color-secondary);
 }
 
 .keyinfo h5 a,
 .keyinfo h5 a strong {
-	color: #1FA2E1;
+	color: var(--color-primary-dark-2);
 }
 
 .inner,
@@ -1500,7 +1500,7 @@ div.bbc_footnotes .meaction {}
 /* attachment details below thumbnails */
 .attachment_name,
 .attachment_details {
-	color: #777777 !important;
+	color: var(--color-secondary) !important;
 	border: solid 1px var(--color-secondary);
 	background: transparent !important;
 }
@@ -1925,8 +1925,8 @@ li.ui-tab.ui-tabs-active.ui-state-active.ui-state-hover .ui-tabs-anchor {
 
 /* Styles for the tooltips. */
 .tooltip {
-	border-color: #AAAAAA;
-	background: #1A1A1A;
+	border-color: var(--color-body-border);
+	background: var(--color-body);
 	box-shadow: none;
 }
 
@@ -1937,8 +1937,8 @@ li.ui-tab.ui-tabs-active.ui-state-active.ui-state-hover .ui-tabs-anchor {
 
 /* The actual pop-up wrapper. */
 .popup_window {
-	border-color: #777777;
-	background-color: #000000;
+	border-color: var(--color-secondary);
+	background-color: var(--color-body-alternate);
 	background-clip: padding-box;
 	box-shadow: none;
 }
@@ -1947,9 +1947,9 @@ li.ui-tab.ui-tabs-active.ui-state-active.ui-state-hover .ui-tabs-anchor {
 
 /* The text content, hopefully helpful. */
 .popup_content {
-	border-color: #BBBBBB;
-	border-bottom-color: #CCCCCC;
-	background: #1A1A1A;
+	border-color: var(--color-body-border);
+	border-bottom-color: var(--color-secondary);
+	background: var(--color-body);
 	box-shadow: none;
 }
 

theme_info.xml

@@ -2,7 +2,7 @@
 	<theme-info xmlns="https://www.elkarte.net/site/theme-info" xmlns:elk="https://www.elkarte.net/">
 		<!-- For the id, always use something unique - put your name, a colon, and then the package name. -->
 		<id>artix:Artix</id>
-		<version>1.2.0</version>
+		<version>1.2.1</version>
 		<!-- Theme name, used purely for aesthetics. -->
 		<name>Artix</name>
 		<!-- Author: your email address or contact information. The name attribute is optional. -->