AnkiNoteTemplate/templates/Japanese words/Recognition/front.html

<!--
Simple Word Cards, version 5.0
Thu Feb  4 01:06:07 AM UTC 2021
-->
<div class="wrap">
    {{#Tags}}
        <header>
            <div class="tags">{{Tags}}</div>
        </header>
    {{/Tags}}
    <div class="japanese question" id="question">
        {{edit:furigana:VocabKanji}}
    </div>
</div>

<script>
    function applyQuizFont() {
        const tags = `{{Tags}}`;
        const questionword = document.getElementById("question");
        // Add this tag if you notice that letters don't render properly
        if (tags.includes("DisableGyousyo")) {
            // nuke ID to remove specified font styling.
            questionword.removeAttribute("id");
        }
    }

    function highlightNames() {
        const tags_elems = document.getElementsByClassName("tags");
        for (const tag_elem of tags_elems) {
            if (tag_elem.innerHTML.includes("キャラ") || tag_elem.innerHTML.includes("有名人")) {
                tag_elem.style.backgroundColor = "brown";
            }
        }
    }

    function splitTagDiv() {
        const header = document.querySelector("header");
        if (header) {
            const tags = `{{Tags}}`.split(" ");
            header.innerHTML = "";
            for (const tag of tags) {
                if (tag.includes("DisableGyousyo")) {
                    continue;
                }
                const tag_elem = document.createElement("div");
                tag_elem.className = "tags";
                tag_elem.innerHTML = tag;
                header.appendChild(tag_elem);
            }
        }
    }

    splitTagDiv()
    highlightNames()
    applyQuizFont()
</script>