new options

This commit is contained in:
Mateusz Gruszczyński
2025-11-03 12:51:01 +01:00
parent 3763a60adf
commit bdc9231ea3
2 changed files with 12 additions and 52 deletions

View File

@@ -35,36 +35,6 @@
white-space: nowrap; 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) { @media (max-width: 768px) {
.CodeMirror { .CodeMirror {
height: 300px !important; height: 300px !important;

View File

@@ -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/codemirror.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.2/theme/material-darker.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 %} {% if check_output %}
<div class="alert alert-{{ check_level|default('info') }} alert-dismissible fade show mb-3" role="alert"> <div class="alert alert-{{ check_level|default('info') }} alert-dismissible fade show" role="alert">
<div class="d-flex align-items-start"> <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>
<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> <strong>
{% if check_level == 'success' %}Configuration Valid {% if check_level == 'success' %}Configuration Saved
{% elif check_level == 'danger' %}Configuration Error {% elif check_level == 'danger' %}Configuration Error
{% elif check_level == 'warning' %}Warning {% elif check_level == 'warning' %}Warning
{% else %} Info{% endif %} {% else %}Information{% endif %}
</strong> </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;"> <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>
{{ check_output|replace('\n', '<br>') }}
</div>
</div>
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button> <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
</div> </div>
{% endif %} {% endif %}
<!-- Editor Section --> <!-- 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 class="card-header bg-primary text-white d-flex justify-content-between align-items-center">
<div> <div>
<h5 class="mb-0"><i class="bi bi-pencil-square me-2"></i>HAProxy Configuration Editor</h5> <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> <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> </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="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"> <div class="d-flex gap-2">
<button type="submit" class="btn btn-success btn-sm" name="action" value="check"> <button type="submit" class="btn btn-success btn-sm" name="action" value="check">
@@ -82,12 +74,10 @@
</div> </div>
</div> </div>
<!-- CodeMirror JS --> <!-- 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/codemirror.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.2/mode/nginx/nginx.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.2/mode/nginx/nginx.min.js"></script>
<!-- Editor JS --> <!-- Editor JS -->
<script src="{{ url_for('static', filename='js/editor.js') }}"></script> <script src="{{ url_for('static', filename='js/editor.js') }}"></script>
{% endblock %} {% endblock %}