feat: About auf Kartenrückseite verlegt

Das Fragezeichen auf der Vorderseite wurde entfernt und durch einen Button auf der Rückseite "About this deck…" ersetzt.

Closes #317

src/components/answer-details.css

+.answer-details {
+    margin-top: 1em;
+    margin-bottom: 1em;
+}
+
 .answer-details:has(> summary:only-child) {
     display: none;
 }
@@ -10,15 +15,16 @@
     max-width: 10em;
     margin-left: auto;
     margin-right: auto;
-    margin-bottom: 1em;
     transition: border-color var(--default-transition-time) ease,
                 color var(--default-transition-time) ease;
     cursor: pointer;
+    text-align: center;
 }
 
 .answer-details[open] > summary {
     border-color: var(--color-fg);
     color: var(--color-fg);
+    margin-bottom: 1em;
 }
 
 .answer-details > summary > .answer-details-less {

src/components/notice/notice.css

-.notice-btn-open-text,
-.notice-btn-close-text {
-  display: inline-block;
-  font-weight: 700;
-  border: 1px solid rgba(0, 0, 0, 0.12);
-  border-radius: 0.3rem;
-  padding: 0.1rem 0.4rem;
-  font-size: 2em;
-}
-
-.notice-btn-open-text {
-  color: rgba(0, 0, 0, 0.5);
-}
-
-.nightMode .notice-btn-open-text {
-  color: rgba(255, 255, 255, 0.5);
-}
-
-.notice-btn-open-text {
-  display: inline;
-}
-
-.notice-btn-close-text {
-  display: none;
-}
-
-details[open] .notice-btn-open-text {
-  display: none;
-}
-
-details[open] .notice-btn-close-text {
-  display: inline;
-}
-
-.notice-btn {
-  text-align: center;
-  cursor: pointer;
-}
-
 .notice-contents {
   text-align: justify;
 }
 
 .notice-contents ul {
   list-style-type: none;
-}
\ No newline at end of file
+}

src/components/notice/notice.html

-<details>
-  <summary class="notice-btn" title="About this template…">
-    <span class="notice-btn-open-text">?</span>
-    <span class="notice-btn-close-text">?</span>
+<details class="answer-details">
+  <summary>
+    <span class="answer-details-more">About this deck…</span>
+    <span class="answer-details-less">Hide notice…</span>
   </summary>
   <aside class="notice-contents">
     <p>
-      This Anki card template and some decks made with it are open source software available on
+      The code that makes this deck work is open source software available on
       <a href="https://gitlab.phaidra.org/kartenaale/sinologie-anki-pack">University of Vienna GitLab</a>.
-      <br>Go there for updates, if you are experiencing issues or if you want to contribute.
+      <br>Check out releases for more decks and updates, or file an issue if
+      you are experiencing issues or if you want to contribute.
     </p>
     <p>
       Deck: Chinese Cultural Spaces<br>

src/templates/bijective/backward/back.html

@@ -8,6 +8,8 @@
   <div class="bijective-answer">
     {{A}}
   </div>
+
+  <include src="src/components/notice/notice.html"></include>
 </div>
 
 <!-- Suppress speech output on AnkiDroid if globally enabled -->

src/templates/bijective/backward/front.html

@@ -16,8 +16,6 @@
   <div class="prompt bijective-question">
     {{B}}
   </div>
-
-  <include src="src/components/notice/notice.html"></include>
 </div>
 
 <!-- Suppress speech output on AnkiDroid if globally enabled -->

src/templates/bijective/forward/back.html

@@ -8,6 +8,8 @@
   <div class="bijective-answer">
     {{B}}
   </div>
+
+  <include src="src/components/notice/notice.html"></include>
 </div>
 
 <!-- Suppress speech output on AnkiDroid if globally enabled -->

src/templates/bijective/forward/front.html

@@ -16,8 +16,6 @@
   <div class="prompt bijective-question">
     {{A}}
   </div>
-
-  <include src="src/components/notice/notice.html"></include>
 </div>
 
 <!-- Suppress speech output on AnkiDroid if globally enabled -->

src/templates/facts/q_a/back.html

@@ -8,6 +8,8 @@
   <div class="facts-answer">
     {{Back}}
   </div>
+
+  <include src="src/components/notice/notice.html"></include>
 </div>
 
 <!-- Suppress speech output on AnkiDroid if globally enabled -->

src/templates/facts/q_a/front.html

@@ -16,8 +16,6 @@
   <div class="prompt facts-question">
     {{Front}}
   </div>
-
-  <include src="src/components/notice/notice.html"></include>
 </div>
 
 <!-- Suppress speech output on AnkiDroid if globally enabled -->

src/templates/hanzi/write/back.html

@@ -13,6 +13,8 @@
     <dt>Print form</dt>
     <dd><span class="hanzi-print is-large">{{Hanzi}}</span></dd>
   </dl>
+
+  <include src="src/components/notice/notice.html"></include>
 </div>
 
 <!-- Suppress speech output on AnkiDroid if globally enabled -->

src/templates/hanzi/write/front.html

@@ -22,8 +22,6 @@
     <dt>Notes</dt>
     <dd>{{Notes (Front)}}</dd>
   </dl>
-
-  <include src="src/components/notice/notice.html"></include>
 </div>
 
 <!-- Suppress speech output on AnkiDroid if globally enabled -->

src/templates/molaoshi/hear/back.html

@@ -55,6 +55,8 @@
       {{/繁體字}}
     </details>
   </dl>
+
+  <include src="src/components/notice/notice.html"></include>
 </div>
 
 <!-- Repeat only relevant text on the back side on AnkiDroid, not all of it -->

src/templates/molaoshi/hear/front.html

@@ -34,8 +34,6 @@
     <dt>Bemerkungen</dt>
     <dd>{{Bemerkungen (Vorderseite)}}</dd>
   </dl>
-
-  <include src="src/components/notice/notice.html"></include>
 </div>
 
 <script type="module">

src/templates/molaoshi/identify_radical/back.html

@@ -20,6 +20,8 @@
     <dt>Strichzahl</dt>
     <dd hanzi-data="{{text:简体字}}" hanzi-prop="count"></dd>
   </dl>
+
+  <include src="src/components/notice/notice.html"></include>
 </div>
 
 <!-- Suppress speech output on AnkiDroid if globally enabled -->

src/templates/molaoshi/identify_radical/front.html

@@ -25,8 +25,6 @@
     <dt>Bemerkungen</dt>
     <dd>{{Bemerkungen (Vorderseite)}}</dd>
   </dl>
-
-  <include src="src/components/notice/notice.html"></include>
 </div>
 
 <!-- Suppress speech output on AnkiDroid if globally enabled -->

src/templates/molaoshi/identify_radical_traditional/back.html

@@ -20,6 +20,8 @@
     <dt>Strichzahl</dt>
     <dd hanzi-data="{{text:繁體字}}" hanzi-kind="traditional" hanzi-prop="count"></dd>
   </dl>
+
+  <include src="src/components/notice/notice.html"></include>
 </div>
 
 <!-- Suppress speech output on AnkiDroid if globally enabled -->

src/templates/molaoshi/identify_radical_traditional/front.html

@@ -25,8 +25,6 @@
     <dt>Bemerkungen</dt>
     <dd>{{Bemerkungen (Vorderseite)}}</dd>
   </dl>
-
-  <include src="src/components/notice/notice.html"></include>
 </div>
 
 <!-- Suppress speech output on AnkiDroid if globally enabled -->

src/templates/molaoshi/read_hanzi/back.html

@@ -66,6 +66,8 @@
       {{/繁體字}}
     </details>
   </dl>
+
+  <include src="src/components/notice/notice.html"></include>
 </div>
 
 <script type="module">

src/templates/molaoshi/read_hanzi/front.html

@@ -25,8 +25,6 @@
     <dt>Bemerkungen</dt>
     <dd>{{Bemerkungen (Vorderseite)}}</dd>
   </dl>
-
-  <include src="src/components/notice/notice.html"></include>
 </div>
 
 <!-- Suppress speech output on AnkiDroid until card flipped -->

src/templates/molaoshi/read_hanzi_traditional/back.html

@@ -57,6 +57,8 @@
       {{/繁體字}}
     </details>
   </dl>
+
+  <include src="src/components/notice/notice.html"></include>
 </div>
 
 <script type="module">