diff options
Diffstat (limited to 'anki-card-template/card.html')
| -rw-r--r-- | anki-card-template/card.html | 18 |
1 files changed, 15 insertions, 3 deletions
diff --git a/anki-card-template/card.html b/anki-card-template/card.html index 71ca300..69edc1d 100644 --- a/anki-card-template/card.html +++ b/anki-card-template/card.html @@ -5,18 +5,30 @@ <title>card template test</title> <link rel='stylesheet' type='text/css' media='screen' href='./card.css'> <script defer src='./card.js'></script> + <style> + body.nightMode { + background-color: black; + color: white; + } + </style> </head> <body> -<div class="card back"> +<div id="card" class="back vertical-layout"> +<div id="front"> <span id="sentence" class="parse foreign">[俺](おれ)の[目](め)の[前](まえ)に{全}(ぜん)[裸](はだか)のアリスが*[立](た)っていた*。\n\*escape\* (<i>test</i>)</span> -<hr class="split"> +</div> +<hr id="separator"> +<div id="back"> <span id="target-word-reading" class="foreign">立つ【た・つ】</span> <span id="target-word-translation" class="native">To stand</span> <span id="sentence-translation" class="native spoiler hidden">Before my eyes stood Alice, butt-naked.</span> </div> +</div> -<button onclick="document.getElementsByClassName('card')[0].classList.toggle('back'); document.getElementsByClassName('card')[0].classList.toggle('front')">toggle view</button> +<button onclick="document.getElementById('card').classList.toggle('back'); document.getElementById('card').classList.toggle('front')">toggle view</button> +<button onclick="document.getElementById('card').classList.toggle('horizontal-layout'); document.getElementById('card').classList.toggle('vertical-layout')">toggle layout</button> +<button onclick="document.body.classList.toggle('nightMode')">toggle dark</button> </span> </html> |