02. Anki

Sample card layout

Front template

<div style="background-color: black; margin: 20px; margin-top: 50px;">
  {{Text}}
</div>

{{Audio}}

<div class="tag">{{Tags}}</div>

Back template

<div style="/* background-color: black;*/ margin: 20px; margin-top: 50px;">
  {{Text}}
</div>

{{Audio}}

<div class="tag">{{Tags}}</div>


{{#Extra_info}}
  <br>
  <div style="text-align: center;">
  <div style="display: inline-block;" class="greybox">
  {{Extra_info}}
  </div>
</div>
{{/Extra_info}}

Styling

.card {
 font-family: arial;
 font-size: 20px;
 text-align: left;
 color: black;
 background-color: white;
}

.tag {
 font-size: 12px;
 color: grey;
 font-style: italic;
 padding: 10px;
 text-align: right;
}

.greybox {
  text-align: left;
  max-width: 400px;
  background-color: #f5f5f5;
  padding: 5px;
}

.card1 { background-color: #FFFFFF; }
.card2 { background-color: #FFFFFF; }