From d105d9cb5a0b7b59f6555a9782e9bb6c9d8d7037 Mon Sep 17 00:00:00 2001
From: Matthias Jung <m.jung@uni-wuerzburg.de>
Date: Sat, 14 Feb 2026 11:58:20 +0100
Subject: [PATCH] feature: renamed and fixed style

---
 assets/style-course.css        | 26 ++++++++++----------------
 templates/html/brightspot.html |  2 +-
 templates/html/question.html   | 19 +++++++++++--------
 3 files changed, 22 insertions(+), 25 deletions(-)

diff --git a/assets/style-course.css b/assets/style-course.css
index 59a0bd0..deaf658 100644
--- a/assets/style-course.css
+++ b/assets/style-course.css
@@ -36,28 +36,22 @@
   margin: 1ex 1em 1.5ex 1em;
 }
 
-.question.has-brightspot .question-text {
-  margin-right: 3em;
+.question .question-brightspot {
+  float: right;
+  margin: 0 0 0.5ex 1em;
 }
 
-.question .question-brightspot {
-  position: absolute;
-  top: 1ex;
-  right: 1ex;
-  line-height: 0;
-  text-decoration: none;
-  color: inherit;
+.question .question-text::after {
+  content: "";
+  display: block;
+  clear: right;
 }
 
 .question .question-brightspot-icon {
-  width: 2em;
-  height: 2em;
+  width: 1em;
+  height: 1em;
   display: block;
-}
-
-.question .question-brightspot:focus-visible {
-  outline: 2px solid currentColor;
-  outline-offset: 2px;
+  margin-right: 0.35em;
 }
 .question .question-picture {
   max-width: 100%;
diff --git a/templates/html/brightspot.html b/templates/html/brightspot.html
index 328a52d..6667820 100644
--- a/templates/html/brightspot.html
+++ b/templates/html/brightspot.html
@@ -3,7 +3,7 @@
 		<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" fill="currentColor" aria-hidden="true" focusable="false" style="width: 1.1em; height: 1.1em; vertical-align: -0.1em;">
 			<path d="M420.9 448C428.2 425.7 442.8 405.5 459.3 388.1C492 353.7 512 307.2 512 256C512 150 426 64 320 64C214 64 128 150 128 256C128 307.2 148 353.7 180.7 388.1C197.2 405.5 211.9 425.7 219.1 448L420.8 448zM416 496L224 496L224 512C224 556.2 259.8 592 304 592L336 592C380.2 592 416 556.2 416 512L416 496zM312 176C272.2 176 240 208.2 240 248C240 261.3 229.3 272 216 272C202.7 272 192 261.3 192 248C192 181.7 245.7 128 312 128C325.3 128 336 138.7 336 152C336 165.3 325.3 176 312 176z"/>
 		</svg>
-		Lichtblick: {{number}}
+		Lösungsweg: {{number}}
 	</h2>
 
     {{content}}
diff --git a/templates/html/question.html b/templates/html/question.html
index b8e7a92..6871281 100644
--- a/templates/html/question.html
+++ b/templates/html/question.html
@@ -1,12 +1,15 @@
 <div class="question layout-{{ layout }}{% if brightspot %} has-brightspot{% endif %}" id="{{ number }}">
-    {% if brightspot %}
-      <a class="question-brightspot" href="{{ number }}.html" aria-label="Brightspot zu Frage {{ number }}">
-        <svg class="question-brightspot-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" fill="currentColor" aria-hidden="true" focusable="false">
-          <path d="M420.9 448C428.2 425.7 442.8 405.5 459.3 388.1C492 353.7 512 307.2 512 256C512 150 426 64 320 64C214 64 128 150 128 256C128 307.2 148 353.7 180.7 388.1C197.2 405.5 211.9 425.7 219.1 448L420.8 448zM416 496L224 496L224 512C224 556.2 259.8 592 304 592L336 592C380.2 592 416 556.2 416 512L416 496zM312 176C272.2 176 240 208.2 240 248C240 261.3 229.3 272 216 272C202.7 272 192 261.3 192 248C192 181.7 245.7 128 312 128C325.3 128 336 138.7 336 152C336 165.3 325.3 176 312 176z"/>
-        </svg>
-      </a>
-    {% endif %}
-    <div class="question-text">{{ number }}: {{ question }}</div>
+    <div class="question-text">
+      {% if brightspot %}
+        <a class="btn btn-warning btn-sm question-brightspot d-inline-flex align-items-center" href="{{ number }}.html" aria-label="Lösungshinweis zu Frage {{ number }}" title="Lösungshinweis">
+          <svg class="question-brightspot-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" fill="currentColor" aria-hidden="true" focusable="false">
+            <path d="M420.9 448C428.2 425.7 442.8 405.5 459.3 388.1C492 353.7 512 307.2 512 256C512 150 426 64 320 64C214 64 128 150 128 256C128 307.2 148 353.7 180.7 388.1C197.2 405.5 211.9 425.7 219.1 448L420.8 448zM416 496L224 496L224 512C224 556.2 259.8 592 304 592L336 592C380.2 592 416 556.2 416 512L416 496zM312 176C272.2 176 240 208.2 240 248C240 261.3 229.3 272 216 272C202.7 272 192 261.3 192 248C192 181.7 245.7 128 312 128C325.3 128 336 138.7 336 152C336 165.3 325.3 176 312 176z"/>
+          </svg>
+          <span>Lösungsweg</span>
+        </a>
+      {% endif %}
+      {{ number }}: {{ question }}
+    </div>
     {% if picture_question %}
       <div class="question-picture"><img src="pictures/{{ picture_question }}.svg" alt="{{ alt_text_question }}"></div>
     {% endif %}