improve example page

This commit is contained in:
Daniella / Tove 2022-07-07 14:13:51 +02:00
parent 1228c17d0c
commit c1b8e59da6
2 changed files with 37 additions and 24 deletions

View file

@ -11,12 +11,11 @@
<br/> <br/>
<br/> <br/>
<div class=content>
<h2>Get:</h2> <h2>Get:</h2>
<form onsubmit="try{document.getElementById('value').value = data[document.getElementById('name').value].toString()}catch(e){} ; return false;"> <form onsubmit="try{document.getElementById('value').value = data[document.getElementById('name').value].toString()}catch(e){} ; return false;">
<input type="text" id="name"> = <input type="text" id="name"> =
<input readonly type="text" id="value"> <input readonly type="text" id="value">
<input type="submit" value="Get!"> <input class=button type="submit" value="Get!">
</form> </form>
@ -24,19 +23,18 @@
<form method="post"> <form method="post">
<input type="text" name="name"> = <input type="text" name="name"> =
<input type="text" name="value"> <input type="text" name="value">
<input type="submit" value="Set!"> <input class=button type="submit" value="Set!">
</form> </form>
<h2>Client-side set:</h2> <h2>Client-side set:</h2>
<form onsubmit="try{data[document.getElementById('sname').value] = document.getElementById('svalue').value}catch(e){} ; return false;"> <form onsubmit="try{data[document.getElementById('sname').value] = document.getElementById('svalue').value}catch(e){} ; return false;">
<input type="text" id="sname"> = <input type="text" id="sname"> =
<input type="text" id="svalue"> <input type="text" id="svalue">
<input type="submit" value="Set!"> <input class=button type="submit" value="Set!">
<button onclick="data.save()" type="button">Save!</button> <button onclick="data.save()" type="button">Save!</button>
</form> </form>
<h2>Your fingerprint</h2> <h2>Your fingerprint</h2>
<div id="fingerprint"></div> <div id="fingerprint"></div>
</div>
</body> </body>
</html> </html>

View file

@ -2,9 +2,24 @@ center {
text-align: center; text-align: center;
} }
.content { body {
font-family: sans-serif;
background-color: #222828;
color: #cdd;
margin: auto; margin: auto;
display: block; display: block;
max-width: 700px; max-width: 700px;
padding: 20px;
word-wrap: break-word; word-wrap: break-word;
text-align: justify;
}
input,button {
background-color: #222828;
color: #cdd;
border: 2px dashed #cdd;
}
input.button,button {
border: 1px solid #cdd;
} }