🎨 Format of the code

This commit is contained in:
Maxim Lebedev 2018-11-13 16:06:18 +05:00
parent d1dc04719d
commit 086470d973
No known key found for this signature in database
GPG Key ID: F8978F46FF0FFA4F
1 changed files with 120 additions and 228 deletions

176
ru.html
View File

@ -61,14 +61,9 @@ Good luck, and many thanks again!
<link rel="stylesheet" type="text/css" href="css/comic.css"/> <link rel="stylesheet" type="text/css" href="css/comic.css"/>
<meta name="viewport" content="width=600"> <meta name="viewport" content="width=600">
<link href="https://fonts.googleapis.com/css?family=Neucha" rel="stylesheet"> <link href="https://fonts.googleapis.com/css?family=Neucha" rel="stylesheet">
<style> <style> body { font-family: 'Neucha', Helvetica, Arial; } </style>
body {
font-family: 'Neucha', Helvetica, Arial;
}
</style>
</head> </head>
<body> <body>
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<!-- CHAPTER 0: INTRODUCTION - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- CHAPTER 0: INTRODUCTION - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
@ -95,32 +90,20 @@ Good luck, and many thanks again!
</div> </div>
<div class="comic"> <div class="comic">
<div id="language_options"></div> <div id="language_options"></div>
<!-- TRANSLATOR NOTE:
<!--
TRANSLATOR NOTE:
There may already be "official" translations for terms like "Spaced Repetition" or "Forgetting Curve"! There may already be "official" translations for terms like "Spaced Repetition" or "Forgetting Curve"!
Go to their Wikipedia pages, scroll down to "Languages" in the left sidebar, and if your language is there, Go to their Wikipedia pages, scroll down to "Languages" in the left sidebar, and if your language is there,
click on that Wikipedia page, and use the "official" translated term there. click on that Wikipedia page, and use the "official" translated term there.
Spaced Repetition: https://en.wikipedia.org/wiki/Spaced_repetition Spaced Repetition: https://en.wikipedia.org/wiki/Spaced_repetition
Forgetting Curve: https://en.wikipedia.org/wiki/Forgetting_curve Forgetting Curve: https://en.wikipedia.org/wiki/Forgetting_curve -->
-->
<!--
TRANSLATOR NOTE:
<!-- TRANSLATOR NOTE:
Try to make your translated text about the same length or shorter as the original text. Try to make your translated text about the same length or shorter as the original text.
If that's not possible, and your text doesn't fit in its box, you can modify attributes If that's not possible, and your text doesn't fit in its box, you can modify attributes
"x", "y", "w", "h" to change the box, or add your own custom CSS style to make the font fit. "x", "y", "w", "h" to change the box, or add your own custom CSS style to make the font fit.
(CSS properties like "font-size" are very helpful) (CSS properties like "font-size" are very helpful) -->
-->
<panel w=400 h=650> <panel w=400 h=650>
<pic src="pics/intro0.png" sx=0 sy=0></pic> <pic src="pics/intro0.png" sx=0 sy=0></pic>
@ -185,7 +168,6 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
</words> </words>
</panel> </panel>
<panel w=500 h=30 style="margin-top:-5px"> <panel w=500 h=30 style="margin-top:-5px">
<words w=500 x=-15 y=-15 no-bg style="width: 500px; font-size:0.8em; text-align: right; color:#999;"> <words w=500 x=-15 y=-15 no-bg style="width: 500px; font-size:0.8em; text-align: right; color:#999;">
* пока ты не умрёшь * пока ты не умрёшь
@ -329,12 +311,8 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
Давай начнем. Давай начнем.
</words> </words>
</panel> </panel>
</div> </div>
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<!-- CHAPTER 1: THE SCIENCE OF SPACED REPETITION - - - - - - - - - - - - - - - - - - - - - - - --> <!-- CHAPTER 1: THE SCIENCE OF SPACED REPETITION - - - - - - - - - - - - - - - - - - - - - - - -->
@ -356,7 +334,6 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
</div> </div>
<div class="comic"> <div class="comic">
<panel w=500 h=450> <panel w=500 h=450>
<pic src="pics/sci0.png" sx=0 sy=0></pic> <pic src="pics/sci0.png" sx=0 sy=0></pic>
<words x=10 y=10 w=400 h=60> <words x=10 y=10 w=400 h=60>
@ -728,17 +705,8 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
...using a <i>shoebox.</i> ...using a <i>shoebox.</i>
</words> </words>
</panel> </panel>
</div> </div>
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<!-- CHAPTER 2: THE ART OF SPACED REPETITION - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- CHAPTER 2: THE ART OF SPACED REPETITION - - - - - - - - - - - - - - - - - - - - - - - - - -->
@ -760,8 +728,7 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
</div> </div>
<div class="comic"> <div class="comic">
<panel w=500 0>
<panel w=500 h=450>
<pic src="pics/leit0.png" sx=0 sy=0></pic> <pic src="pics/leit0.png" sx=0 sy=0></pic>
<words x=10 y=10 w=430 h=60> <words x=10 y=10 w=430 h=60>
You don't <i>have</i> to use a shoebox for Spaced Repetition, You don't <i>have</i> to use a shoebox for Spaced Repetition,
@ -775,12 +742,10 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
</words> </words>
<words x=246 y=118 w=120 no-bg class="comic_text smaller" style="font-size:22px"> <words x=246 y=118 w=120 no-bg class="comic_text smaller" style="font-size:22px">
they're TRAINERS they're TRAINERS
<!-- <!-- TRANSLATOR NOTE:
TRANSLATOR NOTE:
this is a pun that may not work in all languages. this is a pun that may not work in all languages.
If it doesn't translate to your language, try coming up with your own pun! If it doesn't translate to your language, try coming up with your own pun!
Or, replace this line with: "they help me go far" Or, replace this line with: "they help me go far" -->
-->
</words> </words>
<words x=367 y=116 w=120 no-bg class="comic_text smaller" style="font-size:22px"> <words x=367 y=116 w=120 no-bg class="comic_text smaller" style="font-size:22px">
we're not friends anymore we're not friends anymore
@ -945,8 +910,7 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
</words> </words>
<words x=38 y=517 w=200 no-bg class="comic_text smaller" style="text-align:right"> <words x=38 y=517 w=200 no-bg class="comic_text smaller" style="text-align:right">
katamari damacy katamari damacy
<!-- TRANSLATOR NOTE: leave this in its japanese. <!-- TRANSLATOR NOTE: leave this in its japanese. i don't know what it means, actually. it's a videogame song. -->
i don't know what it means, actually. it's a videogame song. -->
</words> </words>
</panel> </panel>
@ -1122,11 +1086,9 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
<words w=450 x=-15 no-bg> <words w=450 x=-15 no-bg>
This card is... alright. This card is... alright.
It's an English word on the front, French word on the back. It's an English word on the front, French word on the back.
<!-- <!-- TRANSLATOR NOTE:
TRANSLATOR NOTE:
If the language you're translating for is NOT French, If the language you're translating for is NOT French,
replace "English" with [your language] replace "English" with [your language] -->
-->
It's the standard for most language-learning flashcards: It's the standard for most language-learning flashcards:
</words> </words>
</panel> </panel>
@ -1172,7 +1134,7 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
But apps like Anki/Tinycards can! But apps like Anki/Tinycards can!
</words> </words>
<audio controls style="position: absolute; top: 105px; left: 280px; transform: scale(0.4) rotate(4deg);"> <audio controls style="position: absolute; top: 105px; left: 280px; transform: scale(0.4) rotate(4deg);">
<source src="audio/chat.mp3" type="audio/mpeg"> <source src="audio/chat.mp3" type="audio/mpeg"/>
</audio> </audio>
</panel> </panel>
@ -1285,13 +1247,8 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
YOU YOU
</words> </words>
</panel> </panel>
</div> </div>
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<!-- CHAPTER 3: GET STARTED TODAY! - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- CHAPTER 3: GET STARTED TODAY! - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
@ -1312,17 +1269,13 @@ If that's not possible, and your text doesn't fit in its box, you can modify att
</div> </div>
<div class="comic"> <div class="comic">
<panel w=500 h=350> <panel w=500 h=350>
<pic src="pics/end0.png" sx=0 sy=0></pic> <pic src="pics/end0.png" sx=0 sy=0></pic>
<words x=10 y=10 w=450 h=60> <words x=10 y=10 w=450 h=60>
To help you get started with Spaced Repetition <i>today</i>, To help you get started with Spaced Repetition <i>today</i>,
you need to answer four questions: you need to answer four questions:
</words> </words>
<!-- <!-- TRANSLATOR NOTE: Remember, if your translated word is too big, you can modify the CSS! (especially font-size) -->
TRANSLATOR NOTE:
Remember, if your translated word is too big, you can modify the CSS! (especially font-size)
-->
<words x=8 y=237 w=120 no-bg style="color:#fff; font-size:40px"> <words x=8 y=237 w=120 no-bg style="color:#fff; font-size:40px">
WHAT? WHAT?
</words> </words>
@ -1777,16 +1730,10 @@ Remember, if your translated word is too big, you can modify the CSS! (especiall
(Want to learn/play more? Further reading &amp; credits below!) (Want to learn/play more? Further reading &amp; credits below!)
<br> <br>
&darr; &darr; &darr; &darr; &darr; &darr; &darr; &darr; &darr; &darr;
</b>
</words> </words>
</panel> </panel>
</div> </div>
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<!-- CREDITS - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- CREDITS - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
@ -1795,9 +1742,7 @@ Remember, if your translated word is too big, you can modify the CSS! (especiall
<a name="bye"></a> <a name="bye"></a>
<div id="credits"> <div id="credits">
<div> <div>
<div style="font-size:30px; margin-bottom:0; overflow: hidden;"> <div style="font-size:30px; margin-bottom:0; overflow: hidden;">
<img src="pics/nicky_credits.png" width="100" height="100" style="display: block; float: left;" /> <img src="pics/nicky_credits.png" width="100" height="100" style="display: block; float: left;" />
<div style="display: block; position: relative; left: 14px; width: 390px; height: 130px; float: left;"> <div style="display: block; position: relative; left: 14px; width: 390px; height: 130px; float: left;">
@ -1977,23 +1922,13 @@ Remember, if your translated word is too big, you can modify the CSS! (especiall
<!-- Share buttons, text generated from labels --> <!-- Share buttons, text generated from labels -->
<div id="share_buttons"></div> <div id="share_buttons"></div>
</div>
</div> </div>
</div> <!-- TRANSLATOR NOTE:
<!--
TRANSLATOR NOTE:
HA HA YOU THOUGHT YOU WERE DONE?! HA HA YOU THOUGHT YOU WERE DONE?!
NOPE NOPE
WE'VE STILL GOT THE INTERFACE LABELS & FLASHCARDS TO TRANSLATE -->
WE'VE STILL GOT THE INTERFACE LABELS & FLASHCARDS TO TRANSLATE
-->
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
@ -2002,7 +1937,6 @@ WE'VE STILL GOT THE INTERFACE LABELS & FLASHCARDS TO TRANSLATE
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<div id="labels"> <div id="labels">
<!-- Chapter Links --> <!-- Chapter Links -->
<span id="label_chapter_links"> <span id="label_chapter_links">
<a href="#0">Intro</a> <a href="#0">Intro</a>
@ -2068,11 +2002,7 @@ WE'VE STILL GOT THE INTERFACE LABELS & FLASHCARDS TO TRANSLATE
</span> </span>
<!-- Leitner Calendar --> <!-- Leitner Calendar -->
<!-- <!-- TRANSLATOR NOTE: The exact three characters [N] is how the code knows where to put the number. When you translate, make sure the [N] is there if it was there in the original. -->
TRANSLATOR NOTE:
The exact three characters [N] is how the code knows where to put the number.
When you translate, make sure the [N] is there if it was there in the original.
-->
<span id="calendar_day"> <span id="calendar_day">
On Day [N]... On Day [N]...
</span> </span>
@ -2127,11 +2057,7 @@ When you translate, make sure the [N] is there if it was there in the original.
<!-- Typing Cards --> <!-- Typing Cards -->
<span id="type_question"> <span id="type_question">
Q: Q:
<!-- <!-- TRANSLATOR NOTE: "Q" short for Question. Dunno if other languages have similar one-letter abbreviations. If not, just type the full translated word for "Question" -->
TRANSLATOR NOTE: "Q" short for Question.
Dunno if other languages have similar one-letter abbreviations.
If not, just type the full translated word for "Question"
-->
</span> </span>
<span id="type_placeholder"> <span id="type_placeholder">
type your answer here type your answer here
@ -2192,15 +2118,14 @@ When you translate, make sure the [N] is there if it was there in the original.
</span> </span>
<span id="gift_app_leitner"> <span id="gift_app_leitner">
a video, by my dear friend Chris Walker, on how to craft your very own Leitner Box! a video, by my dear friend Chris Walker, on how to craft your very own Leitner Box!
<br><br> <br/><br/>
<iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/uvF1XuseZFE?rel=0" <iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/uvF1XuseZFE?rel=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen style="display:block; margin:0 auto"></iframe>
frameborder="0" allow="autoplay; encrypted-media" allowfullscreen <br/>
style="display:block; margin:0 auto"></iframe>
<br>
(And here's a similar tutorial, in IKEA form:) (And here's a similar tutorial, in IKEA form:)
<br><br> <br/><br/>
<a target="_blank" href="./pdf/leitner.pdf" style="display: block; text-align: center;"> <a target="_blank" href="./pdf/leitner.pdf" style="display: block; text-align: center;">
<img src="./pdf/thumbnail.png" width="450"/><br>click to download PDF</a> <img src="./pdf/thumbnail.png" width="450"/><br/>click to download PDF
</a>
</span> </span>
<span id="gift_app_anki"> <span id="gift_app_anki">
a link to a link to
@ -2251,16 +2176,7 @@ When you translate, make sure the [N] is there if it was there in the original.
an interactive comic on the art & science of memory an interactive comic on the art & science of memory
</span> </span>
<!-- TRANSLATOR NOTE: One more section to go! -->
<!--
TRANSLATOR NOTE:
One more section to go!
-->
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
@ -2268,12 +2184,7 @@ One more section to go!
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<!-- <!-- TRANSLATOR NOTE: The CSS for the flashcards is really touchy, so DO NOT MODIFY THE CSS. That means, try as much as possible to make your text shorter or the same length as the original text. Good luck! -->
TRANSLATOR NOTE:
The CSS for the flashcards is really touchy, so DO NOT MODIFY THE CSS.
That means, try as much as possible to make your text shorter or the same length as the original text.
Good luck!
-->
<!-- - - - - - - - - - - - --> <!-- - - - - - - - - - - - -->
<!-- INTRO - - - - - - - - --> <!-- INTRO - - - - - - - - -->
@ -2559,25 +2470,17 @@ Good luck!
<div class="fcard_center" style="height:100px"> <div class="fcard_center" style="height:100px">
<div style="font-size:120px; height:75px;"> <div style="font-size:120px; height:75px;">
cat cat
<!-- <!-- TRANSLATOR NOTE: If your language is NOT French, then change this to "cat" in YOUR language -->
TRANSLATOR NOTE:
If your language is NOT French, then change this to "cat" in YOUR language
-->
</div> </div>
<div> <div>
(english) (english)
<!-- <!-- TRANSLATOR NOTE: If your language is NOT French, then change this to YOUR language -->
TRANSLATOR NOTE:
If your language is NOT French, then change this to YOUR language
-->
</div> </div>
</div> </div>
</span> </span>
<span id="flashcard_cat_back"> <span id="flashcard_cat_back">
<div class="fcard_center" style="height:100px"> <div class="fcard_center" style="height:100px">
<!-- <!-- TRANSLATOR NOTE: DO NOT TRANSLATE. Leave as French! -->
TRANSLATOR NOTE: DO NOT TRANSLATE. Leave as French!
-->
<div style="font-size:120px; height:75px;"> <div style="font-size:120px; height:75px;">
chat chat
</div> </div>
@ -2594,7 +2497,7 @@ Good luck!
<div class="fcard_bg" src="pics/fcards_ch2.png" sx=400 sy=0></div> <div class="fcard_bg" src="pics/fcards_ch2.png" sx=400 sy=0></div>
<div class="fcard_center"> <div class="fcard_center">
<audio controls id="HACK_audio" style="position: absolute; top: 115px; left: 30px; transform: scale(0.5);"> <audio controls id="HACK_audio" style="position: absolute; top: 115px; left: 30px; transform: scale(0.5);">
<source gotosrc="../../audio/chat.mp3" type="audio/mpeg"> <source gotosrc="../../audio/chat.mp3" type="audio/mpeg"/>
</audio> </audio>
</div> </div>
</span> </span>
@ -2612,8 +2515,6 @@ Good luck!
</div> </div>
</span> </span>
<!-- - - - - - - - - - - - --> <!-- - - - - - - - - - - - -->
<!-- Chapter 3: Get Started --> <!-- Chapter 3: Get Started -->
<!-- - - - - - - - - - - - --> <!-- - - - - - - - - - - - -->
@ -2672,14 +2573,9 @@ Good luck!
THE END THE END
</div> </div>
</span> </span>
</div> </div>
<!-- <!-- TRANSLATOR NOTE:
TRANSLATOR NOTE:
Congrats! NOW you've translated everything! Congrats! NOW you've translated everything!
Again, from the deepest part of my heart, I want to sincerely thank you Again, from the deepest part of my heart, I want to sincerely thank you
@ -2691,14 +2587,10 @@ and add your translation there so this project "knows" your page exists.
And once that's done, send a Pull Request, and your translation will go live! And once that's done, send a Pull Request, and your translation will go live!
THANK YOU! <3 THANK YOU! <3
~ Nicky Case ~ Nicky Case -->
-->
</body>
</html>
<script src="js/howler.core.min.js"></script> <script src="js/howler.core.min.js"></script>
<script src="js/minpubsub.src.js"></script> <script src="js/minpubsub.src.js"></script>
<script src="js/comic.js"></script> <script src="js/comic.js"></script>
</body>
</html>