Skip to content

Instantly share code, notes, and snippets.

@PatrickLerner
Last active December 18, 2015 01:59
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save PatrickLerner/5707970 to your computer and use it in GitHub Desktop.
Save PatrickLerner/5707970 to your computer and use it in GitHub Desktop.
.card {
font-family: Arial;
font-size: 20px;
text-align: center;
color: black;
background-color: #f0f1eb;
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center;
margin: 0;
}
.question {
margin: 0;
height: 100px;
position:relative;
}
.question span {
bottom: 15px;
width: 100%;
position:absolute;
}
.answer {
font-size: 23px;
font-family: 'Helvetica';
padding: 0.6em;
border-bottom: 1px solid #c8c8c6;
border-top: 1px solid #c8c8c6;
background-color: #e7e8e3;
}
.box {
background-color: white;
opacity: 0.98;
color: #191919;
border-radius: 6px;
padding: 10px;
padding-top: 15px;
}
.japanese {
font-family: IPAMincho;
font-size: 33px;
}
ruby rt {
font-size: 0.4em;
font-family: Arial;
opacity: 0.6;
}
.question:hover ruby rt {
opacity: 1;
}
.hidden {
display: none;
}
<div class="question japanese">
<span>{{furigana:日本語}}</span>
</div>
<div class="answer">{{Meaning}}</div>
<div class="hidden">{{Audio}}</div>
@import url("_cards.css");
<div class="question japanese">
<span>{{kanji:日本語}}</span>
</div>
<div class="answer">…</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment