Initial commit

templates/bugreport.html

@@ -0,0 +1,53 @@
+{% extends "base.html" %}
+
+{% block title %}Bug rapporteren{% endblock %}
+{% block page_title %}🐞 Bug rapporteren{% endblock %}
+{% block header_class %}header--bug{% endblock %}
+{% block main_class %}medium{% endblock %}
+{% block loader_text %}Bugreport verwerken...{% endblock %}
+
+{% block extra_css %}
+<style>
+    .info-box { margin-top: 14px; padding: 14px; border: 2px dashed var(--bug); border-radius: var(--radius); background: var(--success-bg); }
+    .info-box ul { padding-left: 20px; margin: 6px 0 0; }
+</style>
+{% endblock %}
+
+{% block content %}
+<div class="split">
+    <div class="card">
+        <h2 class="card-title">Fout of bug rapporteren</h2>
+
+        <form method="POST" action="{{ url_for('bugreport.bugreport_submit') }}" onsubmit="showLoader()">
+            <div class="field">
+                <label for="tijdstip">Tijdstip van de fout</label>
+                <input type="datetime-local" id="tijdstip" name="tijdstip" required>
+            </div>
+            <div class="field">
+                <label for="omschrijving">Omschrijving van de bug</label>
+                <textarea id="omschrijving" name="omschrijving" required placeholder="Wat ging er precies mis? Welke stappen heb je ondernomen?"></textarea>
+            </div>
+            <div class="field">
+                <label for="foutcode">Foutcode <span class="muted">(indien beschikbaar)</span></label>
+                <textarea id="foutcode" name="foutcode" placeholder="Bijv. Error 404, NullPointerException of een tekstuele foutmelding..."></textarea>
+            </div>
+            <button class="btn-block btn-lg btn-success" type="submit">Rapport indienen</button>
+        </form>
+    </div>
+
+    <div class="card">
+        <h2 class="card-title">ℹ️ Informatie</h2>
+        <p>Heeft de applicatie een probleem of werkt er iets niet naar behoren? Meld het direct aan het supportteam.</p>
+        <div class="info-box">
+            <strong>Automatische gegevens</strong>
+            <ul>
+                <li><strong>Gebruiker:</strong> wordt automatisch gekoppeld aan jouw account.</li>
+                <li><strong>Status:</strong> staat standaard op <span class="badge badge-info">Nieuw</span>.</li>
+            </ul>
+        </div>
+        <p class="small muted" style="margin-top: 14px;">
+            Probeer de omschrijving zo nauwkeurig mogelijk in te vullen, zodat we het probleem snel kunnen reproduceren en oplossen.
+        </p>
+    </div>
+</div>
+{% endblock %}