From 503b073ac60f0a26c74084f081145d1cda8d0de1 Mon Sep 17 00:00:00 2001
From: lonkaars <loek@pipeframe.xyz>
Date: Fri, 20 Jan 2023 19:30:49 +0100
Subject: target word reading note css

---
 anki-card-template/card.css  | 16 ++++++++++++++++
 anki-card-template/card.html |  2 +-
 2 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/anki-card-template/card.css b/anki-card-template/card.css
index 1abc779..a904f38 100644
--- a/anki-card-template/card.css
+++ b/anki-card-template/card.css
@@ -174,3 +174,19 @@ body {
 
 /* don't break syllables in the reading field on vertical mobile */
 .mobile #card.vertical-layout #back #target-word-reading .reading .syllable { white-space: nowrap; }
+
+/* word note style */
+#card #target-word-reading {
+	display: inline-block;
+	position: relative;
+}
+.mobile #card #target-word-reading .note { left: 0.5em; }
+#card #target-word-reading .note {
+	position: absolute;
+	left: 1em;
+	top: 50%;
+	transform: translate(-100%, -50%);
+	font-style: italic;
+	opacity: 50%;
+	font-size: 0.75em;
+}
diff --git a/anki-card-template/card.html b/anki-card-template/card.html
index 2c7909b..63f900a 100644
--- a/anki-card-template/card.html
+++ b/anki-card-template/card.html
@@ -26,7 +26,7 @@
 </div>
 <hr id="separator">
 <div id="back">
-<span id="target-word-reading" class="parse parse-format parse-brackets foreign">予期しない【よ・き・しない】</span>
+<span id="target-word-reading" class="parse parse-format parse-brackets foreign">予期しない【よ・き・しない】<span class="note">uk</span></span>
 <span id="target-word-translation" class="parse parse-format native">Unexpected</span>
 <span id="sentence-translation" class="parse parse-format native spoiler hidden">"Dictionary" has quit unexpectedly</span>
 <span id="tags" class="parse parse-tags">tag1 tag2 tag example-long-tag-here</span>
-- 
cgit v1.2.3