Anki mining deck note

Back

{{FrontSide}}

<hr id=answer>

読み方: {{Reading}} <br>
品詞: {{PartOfSpeech}} <br>

{{#Picture}}
画像: <br>
<div id="center-text">{{Picture}}<br></div>
{{/Picture}}

<details>
<summary>解説</summary>
{{Glossary}}
</details>

{{^Hightlight}}
{{#Context}}
文脈: <br>
<div id="center-text">{{Context}}<br></div>
{{/Context}}
{{#Scene}}
場面: <br>
<div id="center-text">{{Scene}}</br></div>
{{/Scene}}
例文: <br>
<div id="center-text">{{Sentence}}</br></div>
{{/Hightlight}}

{{#Notes}}
例文メモ: <br>
<div id="center-text">{{Notes}}</br></div>
{{/Notes}}

{{#Source}}
出所: <br>
<div id="center-text">{{Source}}</br></div>
{{/Source}}

{{^Hightlight}}
{{#SentenceAudio}}
{{SentenceAudio}} <br>
{{/SentenceAudio}}
{{/Hightlight}}

発音: <br>
<div id="center-text">
{{Audio}} <br>
{{Graph}} <br>
</div>

CSS

.card {
font-family: arial;
font-size: 20px;
}

#front {
font-size: 40px;
}

#center-text {
text-align: center;
}

Fields.txt

Front - vocab you wish to study in kanji (your target word)
Reading - reading of vocab in kana
PartOfSpeech - is it a noun? is it a verb? etc.
Picture - image associated with the target word (optional)
Glossary - definitions for the target word
Audio - target word's pronunciation (optional)
Graph - pitch accent graph (optional)
SentenceAudio - audio for example sentence that use the target word (optional)
Scene - picture that use the example sentence (optional)
Notes - notes for the example sentence. you can write explanation for grammar points used in the example sentence here (optional)
Source - where you found this example sentence? (optional)
Context - brief explanation of context for the example sentence (optional)
Sentence - example sentence that use the target word
Highlight - leaving this field blank will create a vocabulary card otherwise it will be a sentence card. so if you want a sentence card, add a word from the example sentence you wish to be highlighted in this field

Front

<script>
var colors = ['#FAEBD7', '#00FFFF', '#7FFFD4', '#6495ED', '#00BFFF', '#1E90FF', '#FFD700', '#90EE90', '#87CEFA', '#00FF00', '#00FA9A', '#40E0D0', '#87CEEB', '#98FB98', '#AFEEEE'];
var random_color = colors[Math.floor(Math.random() * colors.length)];
document.getElementById('front').parentNode.parentNode.style.backgroundColor = random_color;
</script>

<div id="front">

{{^Hightlight}}
<div id="center-text">{{Front}}</br></div>
{{/Hightlight}}

{{#Hightlight}}
<span id="exp">

{{#Context}}
<div id="center-text" style="font-size:20px;">
<details>
<summary>文脈</summary>
{{Context}}
</details>
</div>
{{/Context}}

{{#Scene}}
<div id="center-text" style="font-size:20px;">
<details>
<summary>場面</summary>
{{Scene}}
</details>
</div>
{{/Scene}}

<div id="center-text">{{Sentence}}</br></div>

</span>

<script>
var target = '{{Hightlight}}';
var exp = document.getElementById("exp").innerHTML;
document.getElementById("exp").innerHTML = exp.replace(target, '<span style="color:red;">' + target + '</span>');
</script>
{{/Hightlight}}

</div>