Updated README and .css to create more pleasent dev feel

This commit is contained in:
sergiusz 2020-12-07 16:02:26 +01:00
parent c782cda3a3
commit b19cc92dce
5 changed files with 29 additions and 11 deletions

View File

@ -14,7 +14,7 @@ As I've started learning Latin from Lingua Latina Per Se Illustrata I've encourt
# TODO # TODO
- [x] text to html parser to swiftly migrate the cloze Pensa - [x] text to html parser to swiftly migrate the cloze Pensa
- [ ] dictionairy interface - [ ] dictionairy interface
- [ ] - [ ] sync performing Pensa with doneth.at
# Development # Development

View File

@ -1,3 +1,19 @@
body {
margin: 10vw;
}
h1 {
font-size: 5vw;
}
h2 {
font-size: 3vw;
}
#pensum_content {
font-size: 2vw;
}
input[type="text"] { input[type="text"] {
-webkit-appearance: none; -webkit-appearance: none;
border: none; border: none;

View File

@ -2,11 +2,12 @@
<html lang="la"> <html lang="la">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Familia Romana Pensum A</title> <title>{{pensum_title}}</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/LLPSI.css') }}"> <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/LLPSI.css') }}">
<script type="text/javascript"> <script type="text/javascript">
function adjust_size() { function adjust_size() {
const pensum = document.querySelector('#Pensum'); const pensum = document.querySelector('#pensum_content');
const inputs = pensum.querySelectorAll('input'); const inputs = pensum.querySelectorAll('input');
inputs.forEach((input) => { inputs.forEach((input) => {
if (input.type=="text") { if (input.type=="text") {
@ -54,7 +55,7 @@
function validate() { function validate() {
const pensum = document.querySelector('#Pensum'); const pensum = document.querySelector('#pensum_content');
const inputs = pensum.querySelectorAll('input'); const inputs = pensum.querySelectorAll('input');
inputs.forEach((input) => { inputs.forEach((input) => {
@ -76,12 +77,11 @@
} }
function show_answers() { function show_answers() {
const pensum = document.querySelector('#Pensum'); const pensum = document.querySelector('#pensum_content');
const inputs = pensum.querySelectorAll('input'); const inputs = pensum.querySelectorAll('input');
inputs.forEach((input) => { inputs.forEach((input) => {
if (input.type=="text") { if (input.type=="text") {
// input.setAttribute("value", input.dataset.expected);
input.value = input.dataset.expected; input.value = input.dataset.expected;
input.removeAttribute("class"); input.removeAttribute("class");
} }
@ -93,10 +93,10 @@
<h1><a href="/llpsi">Lingua Latina Per Se Illustrata</a></h1> <h1><a href="/llpsi">Lingua Latina Per Se Illustrata</a></h1>
<h2>{{pensum_title}}</h2> <h2>{{pensum_title}}</h2>
Quantitās: <input type="checkbox" id="vowel_length"> Quantitās: <input type="checkbox" id="vowel_length">
<div id="Pensum"> <div id="pensum_content">
{{pensum_content|safe}} <p>{{pensum_content|safe}}</p>
<br> <br>
<button onclick="return validate();">Mitte</button><button onclick="return show_answers();">Responsa</button> <button title="Check answers" onclick="return validate();">Mitte</button><button title="Show correct answers" onclick="return show_answers();">Responsa</button>
</div> </div>
<script type="text/javascript">adjust_size();</script> <script type="text/javascript">adjust_size();</script>
</body> </body>

View File

@ -4,6 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Lingua Latina Per Se Illustrata</title> <title>Lingua Latina Per Se Illustrata</title>
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/LLPSI.css') }}">
</head> </head>
<body> <body>
<h1>Lingua Latina Per Se Illustrata</h1> <h1>Lingua Latina Per Se Illustrata</h1>

View File

@ -7,7 +7,8 @@ for filename in sys.argv[1:]:
# Replace _string_ with html # Replace _string_ with html
html_head = '<input type="text" data-expected="' html_head = '<input type="text" data-expected="'
# html_tail = '" required/>' # html_mid = '" style="width: '
# html_tail = 'em"/>'
html_tail = '"/>' html_tail = '"/>'
content = re.sub(r'_([a-zA-Z\-]+)_', html_head+r'\1'+html_tail, content) content = re.sub(r'_([a-zA-Z\-]+)_', html_head+r'\1'+html_tail, content)