fix onorientationchange handler + opacity for non-highlighted text in sentence instead of hardcoded hex values2.2.2

2 files changed, 11 insertions, 7 deletions

diff --git a/anki-card-template/card.css b/anki-card-template/card.css
index c8ffd6f..885b0a7 100644
--- a/anki-card-template/card.css
+++ b/anki-card-template/card.css
@@ -19,6 +19,7 @@
 	--definition-marker-height: 2px; /* definition marker height (mobile vertical only) */
 	--definition-marker-opacity: 50%; /* definition marker opacity (mobile vertical only) */
 	--indicator-stroke-weight: 1px; /* pitch accent / word type indicator stroke weight */
+	--sentence-highlight-contrast: 80%; /* opacity of non-highlighted text in sentence */
 }
 .mobile #card {
 	--text-block-padding: 0.5em;
@@ -34,10 +35,8 @@ body {
 }
 
 /* increase contrast of highlighted word */
-#card #sentence:has(b) { color: #000b; }
-#card #sentence b { color: #000f; }
-.night_mode #card #sentence:has(b) { color: #fffb; }
-.night_mode #card #sentence b { color: #ffff; }
+#card #sentence:has(b) > * { opacity: var(--sentence-highlight-contrast); }
+#card #sentence > b { opacity: 100%; }
 
 /* body margin */
 body {
@@ -356,7 +355,6 @@ body {
 	opacity: 70%;
 }
 
-
 /* theme colors */
 #target-word-reading .indicator,
 .indicator .stamp { color: white; }
diff --git a/anki-card-template/card.js b/anki-card-template/card.js
index d110c33..3cc7bee 100644
--- a/anki-card-template/card.js
+++ b/anki-card-template/card.js
@@ -128,8 +128,10 @@ function parseFurigana(nodes) {
 		var alwaysvisisble = false; // if furigana is always visible (on front of card)
 		var kanji = ""; // current kanji
 		var reading = ""; // current kanji reading
+		var normal = ""; // normal text
+		var flush_normal = () => { out += `<span class="normal">${normal}</span>`; normal = ""; };
 
-		for (var i = 0; i < input.length; i++) {
+		for (var i = 0; i < input.length; i++, lastmode = mode) {
 			// parse [kanji](reading) into ruby text
 			// [kanji](reading) is only visible on card back
 			// {kanji}(reading) is always visible
@@ -142,16 +144,18 @@ function parseFurigana(nodes) {
 			if (mode == "kanji" && kanji.length > 0 && input[i] == "(") // reading open
 			{ reading = ""; mode = "reading"; continue; }
 			if (mode == "reading" && input[i] == ")") { // reading close
+				flush_normal();
 				mode = "normal";
 				out += `<ruby>${kanji}<rt class="${alwaysvisisble ? 'visible' : 'hidden'}">${reading}</rt></ruby>`;
 				continue;
 			}
 
 			// add current character to selected mode buffer
-			if (mode == "normal") out += input[i];
+			if (mode == "normal") normal += input[i];
 			if (mode == "kanji") kanji += input[i];
 			if (mode == "reading") reading += input[i];
 		}
+		flush_normal();
 		return out;
 	});
 }
@@ -325,3 +329,5 @@ run();
 window.onload = () => run();
 window.onresize = () => layout();
 window.ondeviceorientation = () => layout();
+window.screen.orientation.onchange = () => layout();
+