adebaumann/vgui-cicd
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Design suggestion from AI. Not very useable

Browse Source
This commit is contained in:
Adrian A. Baumann
2025-11-05 10:16:56 +01:00
parent 0cd09d0878
commit 32917113f2
14 changed files with 3257 additions and 269 deletions
Download Patch File Download Diff File Expand all files Collapse all files

161
pages/templates/search.html
View File

@@ -1,28 +1,139 @@
{% extends "base.html" %}
{% block title %}Suche{% endblock %}
{% block breadcrumb_items %}
<li class="breadcrumb-item active" aria-current="page">Suche</li>
{% endblock %}
{% block content %}
<h1 class="mb-4">Suche</h1>
{% if error_message %}
<div class="alert alert-danger">
<strong>Fehler:</strong> {{ error_message }}
</div>
{% endif %}
<!-- Search form -->
<form action="." method="post">
{% csrf_token %}
<!-- Search field -->
<div class="mb-3">
<label for="query" class="form-label">Suchbegriff</label>
<input type="text"
class="form-control"
id="query"
name="q"
placeholder="Suchbegriff eingeben …"
value="{{ search_term|default:'' }}"
required
maxlength="200">
<div class="row">
<div class="col-lg-4">
<!-- Search Form -->
<div class="card search-form sticky-top" style="top: 1rem;">
<div class="card-header">
<h5 class="mb-0">🔍 Suche</h5>
</div>
<button type="submit" class="btn btn-primary">Suchen</button>
</form>
{% endblock %}
<div class="card-body">
<form action="/search/" method="post" id="search-form">
{% csrf_token %}
<!-- Main Search Field -->
<div class="mb-3">
<label for="query" class="form-label">Suchbegriff</label>
<div class="input-group">
<input type="text"
class="form-control"
id="query"
name="q"
placeholder="Suchbegriff eingeben …"
value="{{ search_term|default:'' }}"
required
maxlength="200">
<button class="btn btn-primary" type="submit">
Suchen
</button>
</div>
</div>
<button class="btn btn-outline btn-sm w-100" onclick="history.back()">
← Zurück zur Suche
</button>
</form>
</div>
</div>
</div>
<div class="col-lg-8">
<!-- Search Results -->
{% if search_term %}
<div class="search-results">
<div class="d-flex justify-content-between align-items-center mb-4">
<h2>Suchresultate für "{{ search_term }}"</h2>
<span class="badge bg-primary">
{% if resultat.geltungsbereich %}
{{ resultat.geltungsbereich|length }}
{% endif %}
{% if resultat.all %}
{% for standard, vorgaben in resultat.all.items %}
{{ vorgaben|length }}
{% endfor %}
{% endif %}
Ergebnisse
</span>
</div>
<!-- No Results -->
{% if not resultat.geltungsbereich and not resultat.all %}
<div class="text-center py-5">
<div class="mb-3">
<span style="font-size: 3rem;">🔍</span>
</div>
<h3 class="text-muted">Keine Resultate für "{{ search_term }}"</h3>
<p class="text-muted mb-4">
Es wurden keine Ergebnisse gefunden. Versuchen Sie es mit anderen Suchbegriffen.
</p>
<button class="btn btn-primary" onclick="history.back()">
← Zurück zur Suche
</button>
</div>
{% endif %}
</div>
{% else %}
<!-- Initial Search State -->
<div class="text-center py-5">
<div class="mb-4">
<span style="font-size: 4rem;">🔍</span>
</div>
<h2>Willkommen bei der Suche</h2>
<p class="text-muted mb-4">
Geben Sie einen Suchbegriff ein, um Standards, Vorgaben und Geltungsbereiche zu durchsuchen.
</p>
<!-- Quick Search Examples -->
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header">
<h6 class="mb-0">Beispielsuchen</h6>
</div>
<div class="card-body">
<div class="row g-2">
<div class="col-md-4">
<button class="btn btn-outline btn-sm w-100 quick-search" data-term="Passwort">
🔐 Passwort
</button>
</div>
<div class="col-md-4">
<button class="btn btn-outline btn-sm w-100 quick-search" data-term="Netzwerk">
🌐 Netzwerk
</button>
</div>
<div class="col-md-4">
<button class="btn btn-outline btn-sm w-100 quick-search" data-term="Verschlüsselung">
🔒 Verschlüsselung
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% endif %}
</div>
</div>
<!-- JavaScript for quick search -->
<script>
document.addEventListener('DOMContentLoaded', function() {
// Quick search buttons
const quickSearchButtons = document.querySelectorAll('.quick-search');
quickSearchButtons.forEach(button => {
button.addEventListener('click', function() {
const term = this.dataset.term;
document.getElementById('query').value = term;
document.getElementById('search-form').submit();
});
});
});
</script>
{% endblock %}