From 93eb1a035449db149efa29542a3f035612260560 Mon Sep 17 00:00:00 2001
From: vv01f <vv01f@users.noreply.github.com>
Date: Wed, 29 Mar 2023 16:13:41 +0200
Subject: [PATCH 1/8] add accesskeys for easier use without mouse

---
 kole.html | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)
diff --git a/kole.html b/kole.html
index e24e8e5..a6437b4 100644
--- a/kole.html
+++ b/kole.html
@@ -3,19 +3,20 @@
 <head>
 <style>
 	input[type='number']{text-align:right;}
+	input[readonly='readonly']{background-color:#eee;}
 </style>
 </head>
 <body>
    <h1>Rechner zwischen Brutto-Netto-Kole</h1>
 	<table>
-		<tr><td>Eingangsgröße:</td><td><input type="radio" name="b" value="e" id="bb" class="bb" checked="checked"/><label for="bb">Brutto</label><input type="radio" name="b" value="b" id="bn" class="bb"/><label for="bn">Netto</label><input type="radio" name="b" value="k" id="bk" class="bb"/><label for="bk">KoLe</label></td></tr>
-		<tr><td>Brutto</td><td><input type="number" step="0.01" id="e" value="100.00"/>&thinsp;€</td></tr>
+		<tr><td>Eingangsgröße:</td><td><input accesskey="b" type="radio" name="b" value="e" id="bb" class="bb" checked="checked"/><label for="bb"><u>B</u>rutto</label><input accesskey="n" type="radio" name="b" value="b" id="bn" class="bb"/><label for="bn"><u>N</u>etto</label><input accesskey="k" type="radio" name="b" value="k" id="bk" class="bb"/><label for="bk"><u>K</u>oLe</label></td></tr>
+		<tr><td>Br<u>u</u>tto</td><td><input accesskey="u" type="number" step="0.01" id="e" value="100.00"/>&thinsp;€</td></tr>
 		<tr><td>Umsatzsteuersatz</td><td><input type="number" step="0.01" id="u" value="19.00"/>&thinsp;%</td></tr>
-		<tr><td>Umsatzsteuer</td><td><input type="number" step="0.01" id="us" value="0.00"/>&thinsp;€</td></tr>
-		<tr><td>Netto</td><td><input type="number" step="0.01" id="n" value="0.00"/>&thinsp;€</td></tr>
+		<tr><td>Umsatzsteuer</td><td><input readonly="readonly" type="number" step="0.01" id="us" value="0.00"/>&thinsp;€</td></tr>
+		<tr><td>N<u>e</u>tto</td><td><input accesskey="e" type="number" step="0.01" id="n" value="0.00"/>&thinsp;€</td></tr>
 		<tr><td>Entropieumlagesatz</td><td><input type="number" step="0.01" id="z" value="23.00"/>&thinsp;%</td></tr>
-		<tr><td>Entropieumlage</td><td><input type="number" step="0.01" id="eu" value="23.00"/>&thinsp;€</td></tr>
-		<tr><td>KoLe</td><td><input type="number" step="0.01" id="k" value="0.00"/>&thinsp;€</td></tr>
+		<tr><td>Entropieumlage</td><td><input readonly="readonly" type="number" step="0.01" id="eu" value="23.00"/>&thinsp;€</td></tr>
+		<tr><td>K<u>o</u>Le</td><td><input accesskey="o" type="number" step="0.01" id="k" value="0.00"/>&thinsp;€</td></tr>
 		<tr><td>&nbsp;</td><td><input value="Berechnen" id="b" type="button"/></td></tr>
 	</table>
 	<script>
@@ -54,7 +55,6 @@
 		});
 		e.addEventListener('change', function(){bb.checked = true;});
 		n.addEventListener('change', function(){bn.checked = true;});
-		k.addEventListener('change', function(){bk.checked = true;});
 		s.click();
 	</script>
 </body>

From edefca1e8a00a0549a490c9767dc718152947b68 Mon Sep 17 00:00:00 2001
From: vv01f <vv01f@users.noreply.github.com>
Date: Wed, 29 Mar 2023 17:59:11 +0200
Subject: [PATCH 2/8] + add accesskey for submit + add some css + add noscript
 text to show for js blockers

---
 kole.html | 49 +++++++++++++++++++++++++++++++++++++++++++++----
 1 file changed, 45 insertions(+), 4 deletions(-)

diff --git a/kole.html b/kole.html
index a6437b4..1dbd71e 100644
--- a/kole.html
+++ b/kole.html
@@ -1,13 +1,52 @@
 <!DOCTYPE html>
 <html>
 <head>
+	<title>Rechner zwischen Brutto-Netto-Kole</title>
+	<link rel="stylesheet" href="https://wtf-eg.de/css/style.css?h=56fa462e"/>
 <style>
+<!--
+	@media only screen {
+	}
+	@media only screen and (max-width: 600px){
+		body #wrap { font-size: 2.1em; }
+	}
+	@media only screen and (min-width: 768px){
+		label { display:inline-block;width: 12ex; }
+		body #wrap { font-size: 1.2em; width: 80%; }
+	}
+-->
+<!--
+	body { font-family: sans-serif; }
+-->
+	#wrap {
+		display: inline-block;
+	}
+	fieldset{
+		margin: 0 auto;
+		max-width: 50ex;
+		padding: 2ex;
+	}
+	legend{
+		margin-bottom: 0px;
+	}
+	label{ width: auto !important; }
 	input[type='number']{text-align:right;}
 	input[readonly='readonly']{background-color:#eee;}
+	h1{
+		font-size: 2em;
+		text-align: center;
+		margin: 1ex auto 2ex auto;
+	}
 </style>
 </head>
 <body>
-   <h1>Rechner zwischen Brutto-Netto-Kole</h1>
+	<div id="#wrap">
+	<h1>Rechner zwischen Brutto-Netto-Kole</h1>
+	<noscript>
+		Dieser Rechner ist auf JavaScript angewiesen!
+	</noscript>
+	<fieldset>
+		<legend></legend>
 	<table>
 		<tr><td>Eingangsgröße:</td><td><input accesskey="b" type="radio" name="b" value="e" id="bb" class="bb" checked="checked"/><label for="bb"><u>B</u>rutto</label><input accesskey="n" type="radio" name="b" value="b" id="bn" class="bb"/><label for="bn"><u>N</u>etto</label><input accesskey="k" type="radio" name="b" value="k" id="bk" class="bb"/><label for="bk"><u>K</u>oLe</label></td></tr>
 		<tr><td>Br<u>u</u>tto</td><td><input accesskey="u" type="number" step="0.01" id="e" value="100.00"/>&thinsp;€</td></tr>
@@ -17,8 +56,9 @@
 		<tr><td>Entropieumlagesatz</td><td><input type="number" step="0.01" id="z" value="23.00"/>&thinsp;%</td></tr>
 		<tr><td>Entropieumlage</td><td><input readonly="readonly" type="number" step="0.01" id="eu" value="23.00"/>&thinsp;€</td></tr>
 		<tr><td>K<u>o</u>Le</td><td><input accesskey="o" type="number" step="0.01" id="k" value="0.00"/>&thinsp;€</td></tr>
-		<tr><td>&nbsp;</td><td><input value="Berechnen" id="b" type="button"/></td></tr>
+		<tr><td>&nbsp;</td><td><button accesskey="c" id="b" type="button">Bere<u>c</u>hnen</button></td></tr>
 	</table>
+	</fieldset>
 	<script>
 		var e=document.getElementById('e');
 		var u=document.getElementById('u');
@@ -50,12 +90,13 @@
 				e.value = roundCents( getFormFloat(n) * ( 1 + getFormFloat(u) / 100 ) );
 				k.value = roundCents( getFormFloat(n) * ( 1 - getFormFloat(z) / 100 ) );
 			}
-         us.value = roundCents(e.value * getFormFloat(u) / 100 );
-         eu.value = roundCents(n.value * getFormFloat(z) / 100 );
+			us.value = roundCents(e.value * getFormFloat(u) / 100 );
+			eu.value = roundCents(n.value * getFormFloat(z) / 100 );
 		});
 		e.addEventListener('change', function(){bb.checked = true;});
 		n.addEventListener('change', function(){bn.checked = true;});
 		s.click();
 	</script>
+	</div>
 </body>
 </html>

From 7fbab5327b59a1eb1b353beb3c6faad9817cda72 Mon Sep 17 00:00:00 2001
From: vv01f <vv01f@users.noreply.github.com>
Date: Wed, 29 Mar 2023 18:10:19 +0200
Subject: [PATCH 3/8] fix typo

---
 kole.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/kole.html b/kole.html
index 1dbd71e..0c5eaa1 100644
--- a/kole.html
+++ b/kole.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
 <head>
-	<title>Rechner zwischen Brutto-Netto-Kole</title>
+	<title>Rechner zwischen Brutto-Netto-KoLe</title>
 	<link rel="stylesheet" href="https://wtf-eg.de/css/style.css?h=56fa462e"/>
 <style>
 <!--
@@ -41,7 +41,7 @@
 </head>
 <body>
 	<div id="#wrap">
-	<h1>Rechner zwischen Brutto-Netto-Kole</h1>
+	<h1>Rechner zwischen Brutto-Netto-KoLe</h1>
 	<noscript>
 		Dieser Rechner ist auf JavaScript angewiesen!
 	</noscript>

From bf712137e23cabc16e948b2d6d237cf3784245b0 Mon Sep 17 00:00:00 2001
From: vv01f <vv01f@users.noreply.github.com>
Date: Wed, 29 Mar 2023 18:14:06 +0200
Subject: [PATCH 4/8] replace Math.round with .toFixed

---
 kole.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/kole.html b/kole.html
index 0c5eaa1..90866ad 100644
--- a/kole.html
+++ b/kole.html
@@ -76,7 +76,7 @@
 			return parseFloat(f.value);
 		}
 		function roundCents(f){
-			return Math.round( f * 100 ) / 100;
+			return f.toFixed(2);
 		}
 
 		s.addEventListener('click', function(){

From 6f76920e3fa1ee5beda02369d7b511e6db3be659 Mon Sep 17 00:00:00 2001
From: vv01f <vv01f@users.noreply.github.com>
Date: Wed, 29 Mar 2023 19:00:35 +0200
Subject: [PATCH 5/8] replace table for possibly better mobile view

---
 kole.html | 80 ++++++++++++++++++++++++++++++++++++++++++-------------
 1 file changed, 61 insertions(+), 19 deletions(-)

diff --git a/kole.html b/kole.html
index 90866ad..31dc57c 100644
--- a/kole.html
+++ b/kole.html
@@ -7,21 +7,27 @@
 <!--
 	@media only screen {
 	}
+-->
 	@media only screen and (max-width: 600px){
 		body #wrap { font-size: 2.1em; }
+		input[type='number'],input+label { display: block;}
 	}
 	@media only screen and (min-width: 768px){
-		label { display:inline-block;width: 12ex; }
-		body #wrap { font-size: 1.2em; width: 80%; }
+		label {
+			display:inline-block;
+			width: 12ex;
+		}
+		body #wrap {
+			font-size: 1.2em;
+		}
 	}
--->
 <!--
 	body { font-family: sans-serif; }
 -->
 	#wrap {
 		display: inline-block;
 	}
-	fieldset{
+	div fieldset{
 		margin: 0 auto;
 		max-width: 50ex;
 		padding: 2ex;
@@ -29,7 +35,15 @@
 	legend{
 		margin-bottom: 0px;
 	}
-	label{ width: auto !important; }
+	.radiogroup > legend{
+		min-width: 20ex;
+		display: inline-block;
+		float: left;
+	}
+	.radiogroup > label{
+		display: inline;
+	}
+	label{ min-width: 20ex; }
 	input[type='number']{text-align:right;}
 	input[readonly='readonly']{background-color:#eee;}
 	h1{
@@ -45,20 +59,48 @@
 	<noscript>
 		Dieser Rechner ist auf JavaScript angewiesen!
 	</noscript>
-	<fieldset>
-		<legend></legend>
-	<table>
-		<tr><td>Eingangsgröße:</td><td><input accesskey="b" type="radio" name="b" value="e" id="bb" class="bb" checked="checked"/><label for="bb"><u>B</u>rutto</label><input accesskey="n" type="radio" name="b" value="b" id="bn" class="bb"/><label for="bn"><u>N</u>etto</label><input accesskey="k" type="radio" name="b" value="k" id="bk" class="bb"/><label for="bk"><u>K</u>oLe</label></td></tr>
-		<tr><td>Br<u>u</u>tto</td><td><input accesskey="u" type="number" step="0.01" id="e" value="100.00"/>&thinsp;€</td></tr>
-		<tr><td>Umsatzsteuersatz</td><td><input type="number" step="0.01" id="u" value="19.00"/>&thinsp;%</td></tr>
-		<tr><td>Umsatzsteuer</td><td><input readonly="readonly" type="number" step="0.01" id="us" value="0.00"/>&thinsp;€</td></tr>
-		<tr><td>N<u>e</u>tto</td><td><input accesskey="e" type="number" step="0.01" id="n" value="0.00"/>&thinsp;€</td></tr>
-		<tr><td>Entropieumlagesatz</td><td><input type="number" step="0.01" id="z" value="23.00"/>&thinsp;%</td></tr>
-		<tr><td>Entropieumlage</td><td><input readonly="readonly" type="number" step="0.01" id="eu" value="23.00"/>&thinsp;€</td></tr>
-		<tr><td>K<u>o</u>Le</td><td><input accesskey="o" type="number" step="0.01" id="k" value="0.00"/>&thinsp;€</td></tr>
-		<tr><td>&nbsp;</td><td><button accesskey="c" id="b" type="button">Bere<u>c</u>hnen</button></td></tr>
-	</table>
-	</fieldset>
+<fieldset>
+	<legend></legend>
+	<section class="radiogroup">
+		<legend>Eingangsgröße</legend>
+		<input accesskey="b" type="radio" name="b" value="e" id="bb" class="bb" checked="checked"/><label for="bb"><u>B</u>rutto</label><input accesskey="n" type="radio" name="b" value="b" id="bn" class="bb"/><label for="bn"><u>N</u>etto</label><input accesskey="k" type="radio" name="b" value="k" id="bk" class="bb"/><label for="bk"><u>K</u>oLe</label>
+	</section>
+	<section>
+		<div>
+		<label for="e">Br<u>u</u>tto</label>
+		<input accesskey="u" type="number" step="0.01" id="e" value="100.00"/>&thinsp;€
+		</div>
+		<div>
+		<label for="u">Umsatzsteuersatz</label>
+		<input type="number" step="0.01" id="u" value="19.00"/>&thinsp;%
+		</div>
+		<div>
+		<label for="us">Umsatzsteuer</label>
+		<input readonly="readonly" type="number" step="0.01" id="us" value="0.00"/>&thinsp;€
+		</div>
+		<div>
+		<label for="n">N<u>e</u>tto</label>
+		<input accesskey="e" type="number" step="0.01" id="n" value="0.00"/>&thinsp;€
+		</div>
+		<div>
+		<label for="z">Entropieumlagesatz</label>
+		<input type="number" step="0.01" id="z" value="23.00"/>&thinsp;%
+		</div>
+		<div>
+		<label for="eu">Entropieumlage</label>
+		<input readonly="readonly" type="number" step="0.01" id="eu" value="23.00"/>&thinsp;€
+		</div>
+		<div>
+		<label for="k">K<u>o</u>Le</label>
+		<input accesskey="o" type="number" step="0.01" id="k" value="0.00"/>&thinsp;€
+		</div>
+	</section>
+	<section>
+		<button accesskey="c" id="b" type="button">Bere<u>c</u>hnen</button>
+	</section>
+
+</fieldset>
+
 	<script>
 		var e=document.getElementById('e');
 		var u=document.getElementById('u');

From 9e5472f7517f54ba38e304110ae953dc2901d0f3 Mon Sep 17 00:00:00 2001
From: vv01f <vv01f@users.noreply.github.com>
Date: Sat, 1 Apr 2023 11:00:07 +0200
Subject: [PATCH 6/8] how to use offline

---
 README.md | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 26f8d62..ff0269c 100644
--- a/README.md
+++ b/README.md
@@ -1,3 +1,9 @@
 # simplekolecalc
 
-Sehr einfacher Rechner um Einnahmen und Betrag der Richtung KoLe-Konto fließen kann abzuschätzen.
\ No newline at end of file
+Sehr einfacher Rechner um Einnahmen und Betrag der Richtung KoLe-Konto fließen kann abzuschätzen.
+
+## Offline Nutzen
+
+Solange die Datei nicht auf einem Webserver online liegt, lässt sie sich auf dem eigenen Rechner direkt offline nutzen.
+
+Dazu schlicht im Repository die rohe [kole.html](https://git.wtf-eg.de/vv01f/simplekolecalc/raw/branch/main/kole.html) aufrufen, auf dem eigenen Gerät speichern und im Browser öffnen. 

From af46b9d400446be7cc8cfbb57d49d9316aaa0b64 Mon Sep 17 00:00:00 2001
From: vv01f <vv01f@users.noreply.github.com>
Date: Sat, 1 Apr 2023 11:07:44 +0200
Subject: [PATCH 7/8] contributors

---
 README.md | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/README.md b/README.md
index ff0269c..0eb3c60 100644
--- a/README.md
+++ b/README.md
@@ -7,3 +7,17 @@ Sehr einfacher Rechner um Einnahmen und Betrag der Richtung KoLe-Konto fließen
 Solange die Datei nicht auf einem Webserver online liegt, lässt sie sich auf dem eigenen Rechner direkt offline nutzen.
 
 Dazu schlicht im Repository die rohe [kole.html](https://git.wtf-eg.de/vv01f/simplekolecalc/raw/branch/main/kole.html) aufrufen, auf dem eigenen Gerät speichern und im Browser öffnen. 
+
+
+## Verbesserungen
+
+Sehr willkommen sind Beiträge über Pullrequests oder Diskussionen in den Issues. Wenn das Gitea nicht so sehr lieht, gerne auch [im Foren-Thread](https://forum.wtf-eg.de/t/brutto-nette-rechner-fuer-geno-interna/919) oder eine Nachricht im Forum an Beteiligte schreiben.
+
+
+## Beitragende
+
+Entwurf von [vv01f] nach Ideen und Beiträgen von [frlan] und [siehm].
+
+[frlan]: https://forum.wtf-eg.de/u/frlan "frlan"
+[siehm]: https://forum.wtf-eg.de/u/siehm "siehm"
+[vv01f]: https://forum.wtf-eg.de/u/vv01f "vv01f"

From dba18241e0ca93136b002bcfa6f6a47523f6fc6a Mon Sep 17 00:00:00 2001
From: vv01f <vv01f@users.noreply.github.com>
Date: Sat, 1 Apr 2023 11:09:09 +0200
Subject: [PATCH 8/8] add disclaimer

---
 README.md | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/README.md b/README.md
index 0eb3c60..f7d9cf0 100644
--- a/README.md
+++ b/README.md
@@ -2,6 +2,11 @@
 
 Sehr einfacher Rechner um Einnahmen und Betrag der Richtung KoLe-Konto fließen kann abzuschätzen.
 
+## Disclaimer
+
+Keine Garantie auf Korrektheit.
+Die tatsächlichen Beträge können insbesondere weiteren Abgaben und Steuern unterliegen.
+
 ## Offline Nutzen
 
 Solange die Datei nicht auf einem Webserver online liegt, lässt sie sich auf dem eigenen Rechner direkt offline nutzen.

Eingangsgröße:	BruttoNettoKoLe
Brutto	€
Eingangsgröße:	BruttoNettoKoLe
Brutto	€
Umsatzsteuersatz	%
Umsatzsteuer	€
Netto	€
Umsatzsteuer	€
Netto	€
Entropieumlagesatz	%
Entropieumlage	€
KoLe	€
Entropieumlage	€
KoLe	€