diff options
| author | lonkaars <loek@pipeframe.xyz> | 2023-01-20 19:30:49 +0100 |
|---|---|---|
| committer | lonkaars <loek@pipeframe.xyz> | 2023-01-20 19:30:49 +0100 |
| commit | 503b073ac60f0a26c74084f081145d1cda8d0de1 (patch) | |
| tree | e5c0eabb020eae0d6ef941af4cc0bfe7fa2787bf | |
| parent | b6eb3e31c635d43e469a721cd5e1641a28dd4162 (diff) | |
target word reading note css
| -rw-r--r-- | anki-card-template/card.css | 16 | ||||
| -rw-r--r-- | anki-card-template/card.html | 2 |
2 files changed, 17 insertions, 1 deletions
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> |