64 lines
1.9 KiB
HTML
64 lines
1.9 KiB
HTML
<html>
|
|
|
|
<body>
|
|
<div>
|
|
<h1>
|
|
FeBaFix Rechner
|
|
</h1>
|
|
<form id="windowsill-calculator" class="count-calculator">
|
|
<label class="field">
|
|
Stärke der Fensterbank
|
|
<select name="" id="windowsill-type-input">
|
|
<option value="16">
|
|
15-17mm
|
|
</option>
|
|
<option value="18">
|
|
18-21mm
|
|
</option>
|
|
<option value="custom">
|
|
Sondegröße (bitte angeben)
|
|
</option>
|
|
</select>
|
|
</label>
|
|
<label id="windowsill-strength-input-container" style="display: none;" class="field">
|
|
Sondergröße der Fensterbank
|
|
<input name="windowsill-strength" type="number" id="windowsill-strength-input" max="1000" />
|
|
</label>
|
|
<label class="field">
|
|
Summe zu montierender Fensterbänke in Meter
|
|
<input name="length" type="number" id="length-input" min="0" />
|
|
</label>
|
|
<h3>Ergebnis</h3>
|
|
<label class="field">
|
|
Stückzahl:
|
|
<output id="count-output">Erwarte Eingabe...</output>
|
|
</label>
|
|
<label class="field">
|
|
Art:
|
|
<output id="windowsill-type-output">Erwarte Eingabe...</output>
|
|
</label>
|
|
</form>
|
|
</div>
|
|
<style>
|
|
html {
|
|
font-family: Arial, Helvetica, sans-serif;
|
|
}
|
|
|
|
.count-calculator {
|
|
max-width: 500px;
|
|
display: flex;
|
|
gap: 2rem;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.count-calculator .field {
|
|
display: flex;
|
|
gap: 0.5rem;
|
|
flex-direction: column;
|
|
}
|
|
</style>
|
|
<script src="./main.js" defer async>
|
|
</script>
|
|
</body>
|
|
|
|
</html> |