From 3c39bffe70641f00d5dd2db161a8754495ffc319 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=B6ren=20Weber?= <mail@soeren-weber.de>
Date: Thu, 5 Oct 2023 08:13:20 +0200
Subject: [PATCH] tabs: use color for link of inactive tabs #675

---
 static/css/theme-relearn-dark.css |  1 +
 static/css/theme.css              |  2 +-
 static/css/variant.css            | 13 +++++++++----
 3 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/static/css/theme-relearn-dark.css b/static/css/theme-relearn-dark.css
index 5304a0c59f..077ae06b54 100644
--- a/static/css/theme-relearn-dark.css
+++ b/static/css/theme-relearn-dark.css
@@ -18,6 +18,7 @@
     /* adjusted to relearn-dark chroma style */
     --CODE-BLOCK-color: rgba( 248, 248, 248, 1 ); /* fallback text color of block code; should be adjusted to your selected chroma style */
     --CODE-BLOCK-BG-color: rgba( 43, 43, 43, 1 ); /* fallback background color of block code; should be adjusted to your selected chroma style */
+    --CODE-BLOCK-BORDER-color: rgba( 71, 71, 71, 1 ); /* border color of block code */
 
     --CODE-INLINE-color: rgba( 130, 229, 80, 1 ); /* text color of inline code */
     --CODE-INLINE-BG-color: rgba( 45, 45, 45, 1 ); /* background color of inline code */
diff --git a/static/css/theme.css b/static/css/theme.css
index 7bbe69cea5..824041fc7e 100644
--- a/static/css/theme.css
+++ b/static/css/theme.css
@@ -2091,7 +2091,7 @@ html[dir="rtl"] #R-sidebar ul.collapsible-menu > li > label > i.fa-chevron-right
 
 #R-body .tab-nav-button > .tab-nav-text{
     border-bottom-style: solid;
-    border-bottom-width: .2rem;
+    border-bottom-width: .15rem;
     display: block;
     padding: .2rem .6rem 0 .6rem;
 }
diff --git a/static/css/variant.css b/static/css/variant.css
index b46f4251dd..0dcb04c445 100644
--- a/static/css/variant.css
+++ b/static/css/variant.css
@@ -409,7 +409,10 @@ article ul > li > input[type="checkbox"] {
 }
 
 #R-body .tab-nav-button {
-    color: var(--INTERNAL-MAIN-TEXT-color);
+    color: var(--INTERNAL-MAIN-LINK-color);
+}
+#R-body .tab-nav-button:not(.active):hover {
+    color: var(--INTERNAL-MAIN-LINK-HOVER-color);
 }
 
 #R-body .tab-nav-button.active {
@@ -418,12 +421,14 @@ article ul > li > input[type="checkbox"] {
     color: var(--VARIABLE-BOX-TEXT-color);
 }
 
+#R-body .tab-nav-button > .tab-nav-text{
+    border-bottom-color: var(--VARIABLE-BOX-color);
+}
 #R-body .tab-nav-button.active > .tab-nav-text{
     background-color: var(--VARIABLE-BOX-BG-color);
 }
-
-#R-body .tab-nav-button > .tab-nav-text{
-    border-color: var(--VARIABLE-BOX-color);
+#R-body .tab-nav-button:not(.active) > .tab-nav-text:hover {
+    border-bottom-color: var(--INTERNAL-MAIN-LINK-HOVER-color);
 }
 
 #R-body .tab-content{