Use data-quiz-shown attributes for quiz mode visibility

Mark elements that should remain visible in quiz mode at build time
via data-quiz-shown attributes (toolbar, breadcrumb, h1, questions,
solution links, next-section/-chapter links). The runtime tail
detection becomes obsolete and the CSS collapses to a single show/hide
rule.

Switch the body markers to data-quiz-mode / data-quiz-has-questions
attributes, swap the toggle between btn-secondary and btn-primary
instead of hardcoded colors, and use Bootstrap's alert alert-info for
the no-questions notice.

templates/html/chapter.html

@@ -1,4 +1,4 @@
-<div class="course-toolbar" style="float: right;">
+<div class="course-toolbar" style="float: right;" data-quiz-shown>
   <div class="btn-group" role="group">
     {% if chapter["video_url"] %}
       <a class="btn btn-secondary" href="{{ chapter["video_url"] }}" title="Video öffnen" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M21 3H3c-1.11 0-2 .89-2 2v12c0 1.1.89 2 2 2h5v2h8v-2h5c1.1 0 1.99-.9 1.99-2L23 5c0-1.11-.9-2-2-2zm0 14H3V5h18v12zm-5-6l-7 4V7z"></path></svg></a>
@@ -9,7 +9,7 @@
   </div>
 </div>
 
-<nav aria-label="breadcrumb">
+<nav aria-label="breadcrumb" data-quiz-shown>
   <ol class="breadcrumb">
     <li class="breadcrumb-item"><a href="index.html">Home</a></li>
     <li class="breadcrumb-item"><a href="{{ edition }}_course_index.html">{{ name }}</a></li>
@@ -17,7 +17,7 @@
   </ol>
 </nav>
 
-<h1>{{ chapter["title"] }}</h1>
+<h1 data-quiz-shown>{{ chapter["title"] }}</h1>
 <p>{{ chapter["abstract"] }}</p>
 <div class="chapter-toc d-grid gap-2">
     {% for section in chapter["sections"] %}

templates/html/next_chapter.html

@@ -1,4 +1,4 @@
 <br/>
-<div>
+<div data-quiz-shown>
 	Weiter zum nächsten Kapitel: <a href="{{ url }}">{{ title }}</a>
 </div>

templates/html/next_section.html

@@ -1,4 +1,4 @@
 <br/>
-<div>
+<div data-quiz-shown>
 	Weiter zum nächsten Abschnitt: <a href="{{ url }}">{{ title }}</a>
 </div>

templates/html/question.html

@@ -1,4 +1,4 @@
-<div class="question layout-{{ layout }}" id="{{ number }}">
+<div class="question layout-{{ layout }}" id="{{ number }}" data-quiz-shown>
   <div class="question-text">
     {{ number }}: {{ question }}
   </div>
@@ -23,7 +23,7 @@
     {% endfor %}
   </div>
 </div>
-<div class="solution">
+<div class="solution" data-quiz-shown>
   {% if has_solution %}
     <a class="btn btn-warning btn-sm d-inline-flex align-items-center" href="{{ number }}.html" aria-label="Lösungshinweis zu Frage {{ number }}" title="Lösungshinweis">
       <svg class="solution-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" fill="currentColor" aria-hidden="true" focusable="false">

templates/html/section.html

@@ -1,4 +1,4 @@
-<div class="course-toolbar" style="float: right;">
+<div class="course-toolbar" style="float: right;" data-quiz-shown>
   <div class="btn-group" role="group">
     {% if section["video_url"] %}
       <a class="btn btn-secondary" href="{{ section["video_url"] }}" title="Video öffnen" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M21 3H3c-1.11 0-2 .89-2 2v12c0 1.1.89 2 2 2h5v2h8v-2h5c1.1 0 1.99-.9 1.99-2L23 5c0-1.11-.9-2-2-2zm0 14H3V5h18v12zm-5-6l-7 4V7z"></path></svg></a>
@@ -9,7 +9,7 @@
   </div>
 </div>
 
-<nav aria-label="breadcrumb">
+<nav aria-label="breadcrumb" data-quiz-shown>
   <ol class="breadcrumb">
     <li class="breadcrumb-item"><a href="index.html">Home</a></li>
     <li class="breadcrumb-item"><a href="{{ edition }}_course_index.html">{{ name }}</a></li>
@@ -18,7 +18,7 @@
   </ol>
 </nav>
 
-<h1>{{ section["title"] }}</h1>
+<h1 data-quiz-shown>{{ section["title"] }}</h1>
 
 <a id="margin_0"></a>
 {{ section["content"] }}