From 3c0e4c0a12a5c309223da64cdcf34dd2dce64cca Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=B6ren=20Weber?= <mail@soeren-weber.de>
Date: Wed, 28 Jun 2023 23:11:35 +0200
Subject: [PATCH] expand: remove slide effect on hover and add outline #577

---
 static/css/ie.css      |  9 +++++----
 static/css/theme.css   | 18 ++++++++----------
 static/css/variant.css |  9 +++++----
 3 files changed, 18 insertions(+), 18 deletions(-)

diff --git a/static/css/ie.css b/static/css/ie.css
index 7c82d8f472..5153cc8100 100644
--- a/static/css/ie.css
+++ b/static/css/ie.css
@@ -321,6 +321,11 @@
 		font-family: "Work Sans", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; /* var(--MAIN-TITLES-TEXT-font) */
 	}
 
+	.expand > input:active,
+	.expand > input:focus {
+		outline-color: rgba( 16, 16, 16, 1 ); /* var(--MAIN-TEXT-color) */
+	}
+
 	.expand > label {
 		color: rgba( 72, 106, 201, 1 ); /* var(--MAIN-LINK-color) */
 	}
@@ -329,10 +334,6 @@
 		color: rgba( 32, 40, 145, 1 ); /* var(--MAIN-LINK-HOVER-color) */
 	}
 
-	.expand > label:after {
-		color: rgba( 32, 40, 145, 1 ); /* var(--MAIN-LINK-HOVER-color) */
-	}
-
 	div.box {
 		background-color: rgba( 128, 128, 128, 1 ); /* var(--INTERNAL-BOX-NEUTRAL-color) */
 		border-color: rgba( 128, 128, 128, 1 ); /* var(--INTERNAL-BOX-NEUTRAL-color) */
diff --git a/static/css/theme.css b/static/css/theme.css
index 4e89228bf9..432361aa1d 100644
--- a/static/css/theme.css
+++ b/static/css/theme.css
@@ -1175,6 +1175,12 @@ option {
     cursor: pointer;
 }
 
+.expand > input:active,
+.expand > input:focus {
+    outline-border: 1px;
+    outline-style: solid;
+}
+
 .expand > label {
     cursor: pointer;
     display: inline;
@@ -1185,16 +1191,8 @@ option {
     position: absolute;
 }
 
-.expand > label:after {
-    content: "";
-    display: block;
-    height: 1px;
-    width: 0%;
-    transition: width 0.5s ease;
-}
-
-.expand > label:hover:after {
-    width: 100%;
+.expand > label:hover {
+    text-decoration: underline;
 }
 
 .expand > label > .fas {
diff --git a/static/css/variant.css b/static/css/variant.css
index c0cd6c536d..5db4605266 100644
--- a/static/css/variant.css
+++ b/static/css/variant.css
@@ -286,6 +286,11 @@ pre .copy-to-clipboard-button:hover {
     color: var(--INTERNAL-CODE-BLOCK-BG-color);
 }
 
+.expand > input:active,
+.expand > input:focus {
+    outline-color: var(--INTERNAL-MAIN-TEXT-color);
+}
+
 .expand > label {
     color: var(--INTERNAL-MAIN-LINK-color);
 }
@@ -294,10 +299,6 @@ pre .copy-to-clipboard-button:hover {
     color: var(--INTERNAL-MAIN-LINK-HOVER-color);
 }
 
-.expand > label:after {
-    background-color: var(--INTERNAL-MAIN-LINK-HOVER-color);
-}
-
 #homelinks {
     background-color: var(--INTERNAL-MENU-HEADER-BORDER-color);
     border-color: var(--INTERNAL-MENU-HEADER-BORDER-color);