From bdc9231ea39fe454edaa1f84de83e0feb19efde9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mateusz=20Gruszczy=C5=84ski?=
 <mateusz.gruszczynski@firma.interia.pl>
Date: Mon, 3 Nov 2025 12:51:01 +0100
Subject: [PATCH] new options

---
 static/css/edit.css | 30 ------------------------------
 templates/edit.html | 34 ++++++++++++----------------------
 2 files changed, 12 insertions(+), 52 deletions(-)

diff --git a/static/css/edit.css b/static/css/edit.css
index 9ae33eb..faff06e 100644
--- a/static/css/edit.css
+++ b/static/css/edit.css
@@ -35,36 +35,6 @@
     white-space: nowrap;
 }
 
-/* Alert styling */
-.alert {
-    border-radius: 6px;
-    border: 1px solid rgba(0, 0, 0, 0.15);
-}
-
-.alert-success {
-    background-color: #d4edda;
-    border-color: #c3e6cb;
-    color: #155724;
-}
-
-.alert-danger {
-    background-color: #f8d7da;
-    border-color: #f5c6cb;
-    color: #721c24;
-}
-
-.alert-warning {
-    background-color: #fff3cd;
-    border-color: #ffeaa7;
-    color: #856404;
-}
-
-.alert-info {
-    background-color: #d1ecf1;
-    border-color: #bee5eb;
-    color: #0c5460;
-}
-
 @media (max-width: 768px) {
     .CodeMirror {
         height: 300px !important;
diff --git a/templates/edit.html b/templates/edit.html
index 7c12de7..ef714a5 100644
--- a/templates/edit.html
+++ b/templates/edit.html
@@ -19,31 +19,22 @@
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.2/codemirror.min.css">
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.2/theme/material-darker.min.css">
 
-<!-- Alert Section -->
 {% if check_output %}
-<div class="alert alert-{{ check_level|default('info') }} alert-dismissible fade show mb-3" role="alert">
-    <div class="d-flex align-items-start">
-        <div>
-            <i class="bi bi-{% if check_level == 'success' %}check-circle-fill{% elif check_level == 'danger' %}exclamation-circle-fill{% elif check_level == 'warning' %}exclamation-triangle-fill{% else %}info-circle-fill{% endif %} me-2" style="font-size: 1.2rem;"></i>
-        </div>
-        <div class="flex-grow-1">
-            <strong>
-                {% if check_level == 'success' %}✓ Configuration Valid
-                {% elif check_level == 'danger' %}✗ Configuration Error
-                {% elif check_level == 'warning' %}⚠ Warning
-                {% else %}ℹ Info{% endif %}
-            </strong>
-            <div class="mt-2 small" style="font-family: monospace; background-color: rgba(0,0,0,0.15); padding: 10px; border-radius: 4px; max-height: 250px; overflow-y: auto; line-height: 1.4;">
-                {{ check_output|replace('\n', '<br>') }}
-            </div>
-        </div>
-        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
-    </div>
+<div class="alert alert-{{ check_level|default('info') }} alert-dismissible fade show" role="alert">
+    <i class="bi bi-{% if check_level == 'success' %}check-circle{% elif check_level == 'danger' %}exclamation-circle{% elif check_level == 'warning' %}exclamation-triangle{% else %}info-circle{% endif %} me-2"></i>
+    <strong>
+        {% if check_level == 'success' %}Configuration Saved
+        {% elif check_level == 'danger' %}Configuration Error
+        {% elif check_level == 'warning' %}Warning
+        {% else %}Information{% endif %}
+    </strong>
+    <div class="mt-2 small" style="font-family: monospace; background-color: rgba(0,0,0,0.1); padding: 10px; border-radius: 4px; max-height: 250px; overflow-y: auto; line-height: 1.4; white-space: pre-wrap; word-wrap: break-word;">{{ check_output }}</div>
+    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
 </div>
 {% endif %}
 
 <!-- Editor Section -->
-<div class="card shadow-sm">
+<div class="card shadow-sm mb-4">
     <div class="card-header bg-primary text-white d-flex justify-content-between align-items-center">
         <div>
             <h5 class="mb-0"><i class="bi bi-pencil-square me-2"></i>HAProxy Configuration Editor</h5>
@@ -60,6 +51,7 @@
                 <textarea id="haproxy_config" name="haproxy_config" style="display: none; width: 100%; border: none; font-family: monospace; font-size: 13px; resize: none; padding: 12px; min-height: 500px; background: #1e1e1e; color: #e8e8e8;"></textarea>
             </div>
             
+            <!-- Toolbar -->
             <div class="p-3 bg-dark d-flex justify-content-between align-items-center flex-wrap gap-2" style="border-top: 1px solid #444;">
                 <div class="d-flex gap-2">
                     <button type="submit" class="btn btn-success btn-sm" name="action" value="check">
@@ -82,12 +74,10 @@
     </div>
 </div>
 
-
 <!-- CodeMirror JS -->
 <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.2/codemirror.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.2/mode/nginx/nginx.min.js"></script>
 
 <!-- Editor JS -->
 <script src="{{ url_for('static', filename='js/editor.js') }}"></script>
-
 {% endblock %}