diff --git a/webui/html/assets/css/app.css b/webui/html/assets/css/app.css
index 5daae73..718d0f8 100644
--- a/webui/html/assets/css/app.css
+++ b/webui/html/assets/css/app.css
@@ -50,10 +50,6 @@
--legend-row-bg: rgba(255,255,255,0.03);
--legend-row-border-hover: rgba(255,255,255,0.25);
--legend-row-bg-hover: rgba(255,255,255,0.06);
- --badge-green-bg: #2ecc71;
- --badge-green-text: #ffffff;
- --badge-yellow-bg: #f1c40f;
- --badge-yellow-text: #111111;
--table-zebra: rgba(96,165,250,.03);
--sticky-head-bg: rgba(17,26,46,.96);
--state-info-bg: rgba(96,165,250,.08);
@@ -121,10 +117,6 @@
--legend-row-bg: rgba(226,236,252,.9);
--legend-row-border-hover: rgba(100,116,139,.46);
--legend-row-bg-hover: rgba(210,224,248,.9);
- --badge-green-bg: #166534;
- --badge-green-text: #f8fafc;
- --badge-yellow-bg: #b45309;
- --badge-yellow-text: #fffbeb;
--table-zebra: rgba(15,23,42,.03);
--sticky-head-bg: rgba(255,255,255,.97);
--state-info-bg: rgba(37,99,235,.08);
@@ -275,15 +267,6 @@ header{
.btn.icon span {
pointer-events: none;
}
-.pill{
- display:inline-flex; align-items:center; gap:8px;
- padding:6px 10px;
- border-radius:999px;
- border:1px solid var(--card-border);
- color: var(--muted);
- font-size:12px;
-}
-.pill .b{color: var(--text); font-weight:600}
table{
width:100%;
border-collapse: collapse;
@@ -670,14 +653,6 @@ pre{
border-left: 1px dashed var(--soft-line);
}
-/* File rows inside folders (werkt ook met inline styles die je nu al hebt) */
-.file-folder-files > div{
- border-radius: 10px;
-}
-
-.file-folder-files > div:hover{
- background: var(--hover-bg);
-}
.file-entry{
display:flex;
align-items:center;
@@ -741,27 +716,6 @@ pre{
from{opacity:.0; transform: translateY(3px)}
to{opacity:1; transform: translateY(0)}
}
-.data-table {
- width: 100%;
- border-collapse: collapse;
-}
-
-.data-table th,
-.data-table td {
- padding: 8px;
- border-bottom: 1px solid var(--soft-line);
- text-align: left;
-}
-
-.badge-green {
- background: var(--badge-green-bg);
- color: var(--badge-green-text);
-}
-
-.badge-yellow {
- background: var(--badge-yellow-bg);
- color: var(--badge-yellow-text);
-}
.sortable {
cursor: pointer;
user-select: none;
@@ -834,19 +788,31 @@ pre{
border: 1px solid var(--map-border);
background: var(--map-bg);
border-radius: 14px;
- max-width: 360px;
+ max-width: none;
+ display:flex;
+ align-items:center;
+ gap:12px;
+ flex-wrap:wrap;
}
.mapLegend .legendTitle{
- font-weight: 700;
- margin-bottom: 8px;
+ margin: 0;
+ margin-right: 6px;
+ font-weight: 800;
}
.mapLegend .legendRow{
- display:flex;
+ display:inline-flex;
align-items:center;
- gap: 10px;
- margin: 6px 0;
+ gap:8px;
+ margin: 0;
+ padding:6px 10px;
+ border:1px solid var(--legend-row-border);
+ border-radius:20px;
+ background:var(--legend-row-bg);
+ font-size:13px;
+ white-space:nowrap;
+ transition:all .15s ease;
}
.mapLegend .legendSwatch{
@@ -876,6 +842,10 @@ pre{
.mapLegend .legendSwatch.net{ background: var(--map-node-net); }
.mapLegend .legendSwatch.ctr{ background: var(--map-node-ctr); }
+.mapLegend .legendRow:hover{
+ border-color:var(--legend-row-border-hover);
+ background:var(--legend-row-bg-hover);
+}
/* ===== Netwerken kaart (D3) ===== */
.mapHost svg { width: 100%; height: 100%; display:block; }
@@ -957,82 +927,6 @@ pre{
.mapSplit{ grid-template-columns: 1fr; }
}
-/* ===== Legenda horizontaal ===== */
-.mapLegend{
- display:flex;
- align-items:center;
- gap:18px;
- flex-wrap:wrap;
-}
-
-.mapLegend .legendTitle{
- font-weight:600;
- margin-right:10px;
-}
-
-.mapLegend .legendRow{
- display:flex;
- align-items:center;
- gap:6px;
-}
-
-/* ===== Legenda horizontaal + compact (override) ===== */
-.mapLegend{
- display:flex !important;
- flex-direction: row;
- align-items: center;
- gap: 14px;
- flex-wrap: wrap;
- max-width: none; /* was 360px */
- padding: 10px 12px;
-}
-
-.mapLegend .legendTitle{
- margin: 0;
- font-weight: 800;
-}
-
-.mapLegend .legendRow{
- margin: 0; /* haalt verticale spacing weg */
- display:flex;
- align-items:center;
- gap: 8px;
- white-space: nowrap; /* voorkomt rare afbreking */
-}
-
-/* ===== Legenda badge stijl ===== */
-
-.mapLegend{
- display:flex;
- align-items:center;
- gap:12px;
- flex-wrap:wrap;
-}
-
-.mapLegend .legendTitle{
- font-weight:800;
- margin-right:6px;
-}
-
-.mapLegend .legendRow{
- display:inline-flex;
- align-items:center;
- gap:8px;
- padding:6px 10px;
- border:1px solid var(--legend-row-border);
- border-radius:20px;
- background:var(--legend-row-bg);
- font-size:13px;
- white-space:nowrap;
- transition:all .15s ease;
-}
-
-.mapLegend .legendRow:hover{
- border-color:var(--legend-row-border-hover);
- background:var(--legend-row-bg-hover);
-}
-
-
/* Files tree: actions only on hover */
.file-folder-row .file-folder-actions{
opacity: 0;