fix(dashboard): explizite zwei-zeilen-layout für suchbox
This commit is contained in:
@@ -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; }
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -26,19 +26,23 @@
|
|||||||
|
|
||||||
<!-- Search -->
|
<!-- Search -->
|
||||||
<div class="search-box">
|
<div class="search-box">
|
||||||
<input type="text" id="searchInput" placeholder="🔍 Suche..." />
|
<div class="search-row">
|
||||||
<select id="filterSelect">
|
<input type="text" id="searchInput" placeholder="🔍 Suche..." />
|
||||||
<option value="all">Alle</option>
|
</div>
|
||||||
<option value="pending">Pending</option>
|
<div class="search-row">
|
||||||
<option value="confirmed">Confirmed</option>
|
<select id="filterSelect">
|
||||||
<option value="rejected">Rejected</option>
|
<option value="all">Alle</option>
|
||||||
<option value="errors">Errors</option>
|
<option value="pending">Pending</option>
|
||||||
</select>
|
<option value="confirmed">Confirmed</option>
|
||||||
<select id="exportFormat" title="Export format">
|
<option value="rejected">Rejected</option>
|
||||||
<option value="jsonl">JSONL</option>
|
<option value="errors">Errors</option>
|
||||||
<option value="csv">CSV</option>
|
</select>
|
||||||
</select>
|
<select id="exportFormat" title="Export format">
|
||||||
<button class="btn-export" onclick="exportCurrent()">Export</button>
|
<option value="jsonl">JSONL</option>
|
||||||
|
<option value="csv">CSV</option>
|
||||||
|
</select>
|
||||||
|
<button class="btn-export" onclick="exportCurrent()">Export</button>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- New Engram -->
|
<!-- New Engram -->
|
||||||
|
|||||||
Reference in New Issue
Block a user