Rechnung quer

belege.html

@@ -176,6 +176,7 @@ <h4>Vorlage</h4>
                                 <option value="template2">Modern</option>
                                 <option value="template3">Mutig</option>
                                 <option value="template4">Elegant</option>
+                                <option value="template5">Querformat</option>
                             </select>
                         </div>
                         <div><br>

index.html

@@ -12,34 +12,39 @@
   <main>
     <header>
       <h1>BwR-Helfer</h1>
-      <p style="text-align: justify;">
-
-        Hier erhalten Sie Unterstützung bei der Erstellung und dem Export von fachspezifischen Darstellungen für das
-        Fach BwR an der Realschule in Bayern.
-        Der Schwerpunkt liegt auf dem Export nach PNG, Office, HTML und für die Weiterverarbeitung in Moodle/mebis.
-      </p>
-    </header>
-    <section>
       <h2>Navigation</h2>
       <div class="box"><a href="buchen.html">Buchführung</a></div>
       <div class="box"><a href="bwl.html">Betriebswirtschaftslehre</a></div>
       <div class="box"><a href="belege.html">Belege</a></div>
+    </header>
+    <section>
+      <p style="text-align: justify;">
+        Hier erhalten Sie Unterstützung bei der Erstellung von fachspezifischen Darstellungen für das
+        Fach BwR an der Realschule in Bayern.
+        Der Schwerpunkt liegt auf dem Export nach PNG, Office, SVG, HTML und speziell für die Verwendung auf der mebis
+        Lernplattform.
+        <br>
+        Erstellen Sie mit wenigen Handgriffen Belege, T-Konten, Schemata und Geschäftsfälle:
+      </p>
+      <img src="media/pic/belege.png" style="width:100%;">
+    </section>
+    <section>
+      <h2>Exportformate</h2>
+      <ul>
+        <li><strong>PNG:</strong> Optimal für schnelle Verarbeitung in Office-Anwendungen und im Internet.</li>
+        <li><strong>Office:</strong> Kopie in der Zwischenablage zur Weiterverarbeitung in einer Textverarbeitung oder
+          Tabellenkalkulation.</li>
+        <li><strong>SVG:</strong> Eine Vektordatei, die nachträglich bearbeitet werden kann, beispielsweise mit
+          dem kostenlosen Programm Inkscape.</li>
+        <li><strong>HTML (für Profis):</strong> Geeignet für direktes Einbinden in HTML-Code, beispielsweise
+          inline in einem mebis/Moodlekurs mit der Möglichkeit zum Skripting.
+          Ein praktisches Beispiel dafür ist die Verwendung des aktuellen Jahres im Rechnungsdatum, ohne dass
+          Sie sich um die Aktualisierung der Belege kümmern müssen.
+          Hinweis: Von manchen Plattformen könnte Scripting in einer SVG nicht zugelassen sein oder in Zukunft
+          deaktiviert werden.</p>
+        </li>
+      </ul>
     </section>
-    <h2>Exportformate</h2>
-    <ul>
-      <li><strong>PNG:</strong> Optimal für schnelle Verarbeitung in Office-Anwendungen und im Internet.</li>
-      <li><strong>Office:</strong> Kopie in der Zwischenablage zur Weiterverarbeitung in einer Textverarbeitung oder
-        Tabellenkalkulation.</li>
-      <li><strong>SVG:</strong> Eine Vektordatei, die nachträglich bearbeitet werden kann, beispielsweise mit
-        dem kostenlosen Programm Inkscape.</li>
-      <li><strong>HTML (für Profis):</strong> Geeignet für direktes Einbinden in HTML-Code, beispielsweise
-        inline in einem mebis/Moodlekurs mit der Möglichkeit zum Skripting.
-        Ein praktisches Beispiel dafür ist die Verwendung des aktuellen Jahres im Rechnungsdatum, ohne dass
-        Sie sich um die Aktualisierung der Belege kümmern müssen.
-        Hinweis: Von manchen Plattformen könnte Scripting in einer SVG nicht zugelassen sein oder in Zukunft
-        deaktiviert werden.</p>
-      </li>
-    </ul>
   </main>
   <footer>
     <p>

js/belege.js

@@ -583,16 +583,37 @@ function applyOrderData() {
 
     // Platz machen wenn keine Bezugskosten
     const warenwertUstRechnungsbetrag = document.getElementById('warenwertUstRechnungsbetrag');
+    const warenwertUstRechnungsbetrag_quer = document.getElementById('warenwertUstRechnungsbetrag_quer');
     const gBezugskosten = document.getElementById('gBezugskosten');
 
-    // Hier überprüfen wir, ob bezugskostenInput gleich 0 ist
-    if (bezugskostenInput > 0) {
-        // Ändere den Transform-Wert, um die Y-Position um 20 zu verringern
-        warenwertUstRechnungsbetrag.setAttribute('transform', 'translate(0, 0)');
+    // Überprüfe, ob das Element vorhanden ist
+    if (warenwertUstRechnungsbetrag) {
+        // Hier überprüfen wir, ob bezugskostenInput gleich 0 ist
+        if (bezugskostenInput > 0) {
+            // Ändere den Transform-Wert, um die Y-Position um 20 zu verringern
+            warenwertUstRechnungsbetrag.setAttribute('transform', 'translate(0, 0)');
+        } else {
+            // Setze den Transform-Wert auf den ursprünglichen Wert oder einen anderen Wert nach Bedarf
+            warenwertUstRechnungsbetrag.setAttribute('transform', 'translate(0, -30)');
+            gBezugskosten.remove();
+        }
     } else {
-        // Setze den Transform-Wert auf den ursprünglichen Wert oder einen anderen Wert nach Bedarf
-        warenwertUstRechnungsbetrag.setAttribute('transform', 'translate(0, -30)');
-        gBezugskosten.remove()
+
+    }
+
+    // Überprüfe, ob das Element vorhanden ist
+    if (warenwertUstRechnungsbetrag_quer) {
+        // Hier überprüfen wir, ob bezugskostenInput gleich 0 ist
+        if (bezugskostenInput > 0) {
+            // Ändere den Transform-Wert, um die Y-Position um 20 zu verringern
+            warenwertUstRechnungsbetrag_quer.setAttribute('transform', 'translate(0, 0)');
+        } else {
+            // Setze den Transform-Wert auf den ursprünglichen Wert oder einen anderen Wert nach Bedarf
+            warenwertUstRechnungsbetrag_quer.setAttribute('transform', 'translate(200, 0)');
+            gBezugskosten.remove();
+        }
+    } else {
+
     }
 
     const inputLieferbedingung = document.getElementById("lieferbedingungInput");