fix(dashboard): explizite zwei-zeilen-layout für suchbox

This commit is contained in:
2026-05-31 17:09:24 +02:00
parent dab1b84a68
commit 680b3869bb
2 changed files with 36 additions and 20 deletions

View File

@@ -76,10 +76,21 @@ body {
/* ─── Search ──────────────────────────────────────────────────────────────── */ /* ─── Search ──────────────────────────────────────────────────────────────── */
.search-box { .search-box {
display: flex; display: flex;
flex-direction: column;
gap: 8px; gap: 8px;
padding: 10px 12px; padding: 10px 12px;
background: #141419; background: #141419;
flex-wrap: wrap; }
.search-row {
display: flex;
gap: 8px;
flex-direction: row;
}
.search-row:first-child {
width: 100%;
}
.search-row:last-child {
width: 100%;
} }
/* tab buttons styled via .tabs-bar */ /* tab buttons styled via .tabs-bar */
@@ -198,6 +209,7 @@ body {
.legend-dot.match{ background:#f7d154; } .legend-dot.match{ background:#f7d154; }
.graph-hint{ padding: 4px 12px 10px; } .graph-hint{ padding: 4px 12px 10px; }
#searchInput { #searchInput {
width: 100%;
flex: 1; flex: 1;
min-width: 0; min-width: 0;
background: #1e1e28; background: #1e1e28;
@@ -210,6 +222,8 @@ body {
} }
#searchInput:focus { border-color: #6c8af5; } #searchInput:focus { border-color: #6c8af5; }
#filterSelect { #filterSelect {
flex: 1;
min-width: 0;
background: #1e1e28; background: #1e1e28;
border: 1px solid #2a2a3a; border: 1px solid #2a2a3a;
border-radius: 10px; border-radius: 10px;
@@ -217,10 +231,11 @@ body {
color: #e8e8ee; color: #e8e8ee;
font-size: 0.85rem; font-size: 0.85rem;
outline: none; outline: none;
min-width: 0;
} }
#exportFormat { #exportFormat {
flex: 1;
min-width: 0;
background: #1e1e28; background: #1e1e28;
border: 1px solid #2a2a3a; border: 1px solid #2a2a3a;
border-radius: 10px; border-radius: 10px;
@@ -228,10 +243,11 @@ body {
color: #e8e8ee; color: #e8e8ee;
font-size: 0.85rem; font-size: 0.85rem;
outline: none; outline: none;
min-width: 0;
} }
.btn-export { .btn-export {
flex: 1;
min-width: 0;
background: #1e1e28; background: #1e1e28;
border: 1px solid #2a2a3a; border: 1px solid #2a2a3a;
border-radius: 10px; border-radius: 10px;
@@ -240,7 +256,6 @@ body {
font-weight: 700; font-weight: 700;
font-size: 0.85rem; font-size: 0.85rem;
cursor: pointer; cursor: pointer;
min-width: 0;
} }
.btn-export:active { transform: scale(0.98); } .btn-export:active { transform: scale(0.98); }
@@ -494,9 +509,6 @@ body {
.stat { min-width: 48px; } .stat { min-width: 48px; }
.stat-num { font-size: 1.15rem; } .stat-num { font-size: 1.15rem; }
.tabs-bar { top: 48px; } .tabs-bar { top: 48px; }
.search-box { flex-wrap: wrap; }
#searchInput { flex: 1 0 100%; min-width: 0; }
#filterSelect, #exportFormat, .btn-export { flex: 1 1 auto; min-width: 0; }
.modal { padding: 14px 10px; } .modal { padding: 14px 10px; }
.modal-content { padding: 16px 12px; } .modal-content { padding: 16px 12px; }
} }

View File

@@ -26,7 +26,10 @@
<!-- Search --> <!-- Search -->
<div class="search-box"> <div class="search-box">
<div class="search-row">
<input type="text" id="searchInput" placeholder="🔍 Suche..." /> <input type="text" id="searchInput" placeholder="🔍 Suche..." />
</div>
<div class="search-row">
<select id="filterSelect"> <select id="filterSelect">
<option value="all">Alle</option> <option value="all">Alle</option>
<option value="pending">Pending</option> <option value="pending">Pending</option>
@@ -40,6 +43,7 @@
</select> </select>
<button class="btn-export" onclick="exportCurrent()">Export</button> <button class="btn-export" onclick="exportCurrent()">Export</button>
</div> </div>
</div>
<!-- New Engram --> <!-- New Engram -->
<div class="new-engram"> <div class="new-engram">