Add more info in html
This commit is contained in:
parent
a3118bb780
commit
4114cce429
2 changed files with 26 additions and 3 deletions
2
CNAME
2
CNAME
|
@ -1 +1 @@
|
||||||
doses.augendre.info
|
doses.augendre.info
|
||||||
|
|
27
index.html
27
index.html
|
@ -8,11 +8,20 @@
|
||||||
html {
|
html {
|
||||||
font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
margin-top: 3em;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1>Doses converter</h1>
|
<h1>Doses converter</h1>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
Given an alcohol proof in percent, compute the number of alcohol doses in a volume
|
||||||
|
or the volume for a number of doses.
|
||||||
|
</p>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
<label for="proof">Proof (%)</label>
|
<label for="proof">Proof (%)</label>
|
||||||
<input type="number" id="proof" value="40">
|
<input type="number" id="proof" value="40">
|
||||||
|
@ -21,15 +30,29 @@
|
||||||
<p>
|
<p>
|
||||||
<label for="volume">Volume (cl)</label>
|
<label for="volume">Volume (cl)</label>
|
||||||
<input type="number" id="volume" value="10">
|
<input type="number" id="volume" value="10">
|
||||||
<button id="compute-volume">Compute</button>
|
<button id="compute-volume"
|
||||||
|
title="Compute the volume given the proof and the number of doses">
|
||||||
|
Compute
|
||||||
|
</button>
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
<label for="dose">Dose</label>
|
<label for="dose">Dose</label>
|
||||||
<input type="number" id="dose" value="3.2">
|
<input type="number" id="dose" value="3.2">
|
||||||
<button id="compute-dose">Compute</button>
|
<button id="compute-dose"
|
||||||
|
title="Compute the number of doses given the proof and the volume">
|
||||||
|
Compute
|
||||||
|
</button>
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<p>
|
||||||
|
Checkout the code on <a href="https://github.com/Crocmagnon/doses">GitHub</a>.<br>
|
||||||
|
This piece of code is released in the public domain. See the <a href="https://github.com/Crocmagnon/doses/blob/master/LICENSE">license</a> for
|
||||||
|
more details.
|
||||||
|
</p>
|
||||||
|
</footer>
|
||||||
|
|
||||||
<script src="main.js" defer></script>
|
<script src="main.js" defer></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
Loading…
Reference in a new issue