Procházet zdrojové kódy

dashboard: equal-width columns for entities/keywords, taller frequency charts

- Removed card-wide from entity and keyword Top columns so all three
  columns (list, chart, detail) are equal width
- Added chart-wrap-tall class (400px) for the frequency bar charts so
  they have room to breathe in the narrower columns
Lukas Goldschmidt před 1 týdnem
rodič
revize
5be0cc0cf6
2 změnil soubory, kde provedl 5 přidání a 4 odebrání
  1. 4 4
      dashboard/index.html
  2. 1 0
      dashboard/style.css

+ 4 - 4
dashboard/index.html

@@ -124,13 +124,13 @@
 <!-- ENTITIES VIEW -->
 <div id="view-entities" class="view">
   <div class="grid grid-3">
-    <div class="card card-wide">
+    <div class="card">
       <h3>🔗 Top Entities <small class="muted">(24h mentions)</small></h3>
       <div id="entity-list"><div class="loading">Loading…</div></div>
     </div>
     <div class="card">
       <h3>📊 Entity Frequency</h3>
-      <div class="chart-wrap"><canvas id="chart-entities"></canvas></div>
+      <div class="chart-wrap chart-wrap-tall"><canvas id="chart-entities"></canvas></div>
     </div>
     <div class="card">
       <h3>ℹ️ Entity Detail</h3>
@@ -142,13 +142,13 @@
 <!-- KEYWORDS VIEW -->
 <div id="view-keywords" class="view">
   <div class="grid grid-3">
-    <div class="card card-wide">
+    <div class="card">
       <h3>🏷️ Top Keywords <small class="muted">(24h occurrences, excluding entities)</small></h3>
       <div id="keyword-list"><div class="loading">Loading…</div></div>
     </div>
     <div class="card">
       <h3>📊 Keyword Frequency</h3>
-      <div class="chart-wrap"><canvas id="chart-keywords"></canvas></div>
+      <div class="chart-wrap chart-wrap-tall"><canvas id="chart-keywords"></canvas></div>
     </div>
     <div class="card">
       <h3>ℹ️ Keyword Detail</h3>

+ 1 - 0
dashboard/style.css

@@ -191,6 +191,7 @@ tr:hover td { background: rgba(91,138,245,.05); }
 
 /* ── Chart containers ─────────────────────────────── */
 .chart-wrap { position: relative; height: 280px; }
+.chart-wrap-tall { position: relative; height: 400px; }
 
 /* ── Feed status ──────────────────────────────────── */
 .feed-item { display: flex; justify-content: space-between; align-items: center; padding: .4rem 0; font-size: .82rem; border-bottom: 1px solid rgba(42,46,58,.4); }