From a15a7ba576521f70c9a242e2d61de5beaeed2863 Mon Sep 17 00:00:00 2001 From: vikingowl Date: Sat, 27 Nov 2021 19:01:08 +0100 Subject: [PATCH] code cleanup --- aromacalc/aromacalc.js | 11 ++- aromacalc/index.html | 174 +++++++++++++++++++++-------------------- aromacalc/style.css | 35 +++++++++ index.html | 21 +++-- 4 files changed, 144 insertions(+), 97 deletions(-) create mode 100644 aromacalc/style.css diff --git a/aromacalc/aromacalc.js b/aromacalc/aromacalc.js index 3c95ef4..f97079b 100644 --- a/aromacalc/aromacalc.js +++ b/aromacalc/aromacalc.js @@ -1,7 +1,10 @@ -let buttoncalc = document.getElementById("calculate") -buttoncalc.addEventListener("click", calculate) +// let buttoncalc = document.getElementById("calculate") +// buttoncalc.addEventListener("click", calculate) -function calculate(){ +const calcForm = document.getElementById('calculator') // const ist hier besser als let, da immutable +calcForm.addEventListener('submit', calculate) + +function calculate(e){ let aromaamount = document.getElementById("aromaamount").value let aromaconc = document.getElementById("aromaconc").value / 100 let vg = document.getElementById("vg").value @@ -30,4 +33,6 @@ function calculate(){ document.getElementById("amountvg").value = amountvg document.getElementById("amountpg").value = amountpg } + + e.preventDefault() // https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault } diff --git a/aromacalc/index.html b/aromacalc/index.html index 9800665..7cc0e9f 100644 --- a/aromacalc/index.html +++ b/aromacalc/index.html @@ -1,87 +1,89 @@ - - - - -

Aroma Calculator



- - - -
- - - - - - - - - - - - - - - - - - - - - - - - - - -
Mischrechner
-
- - - - - - - - - - - - - - - - - - -
Nikotinshot
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + Aroma Calculator + + + +

Aroma Calculator

+ +
+
+

Mischrechner

+ + + + + + + + + + + + + + + + + + +
+ +
+

Nikotinshot

+ + + + + + + + + + + + +
+ +
+ + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/aromacalc/style.css b/aromacalc/style.css new file mode 100644 index 0000000..ab5d133 --- /dev/null +++ b/aromacalc/style.css @@ -0,0 +1,35 @@ +.mischrechner, +.nikotinshot { + width: 380px; +} + +form { + display: flex; + flex-wrap: wrap; +} + +h3 { + text-align: center; +} + +label { + display: inline-block; + width: 180px; + text-align: right; + line-height: 2rem; +} + +input { + width: 180px; +} + +.break { + flex-basis: 100%; + height: 0; +} + +button { + flex-wrap: wrap; + margin-top: 2rem; + margin-left: 1rem; +} \ No newline at end of file diff --git a/index.html b/index.html index 8d58434..323ec84 100644 --- a/index.html +++ b/index.html @@ -1,8 +1,13 @@ - - - - - Aroma Calc - - - + + + + + + + Document + + +Aroma Calc + + \ No newline at end of file