Small style improvements to analysis UI

ooni · Nov 21, 2023 · 829a17b · 829a17b
1 parent 6f628df
commit 829a17b
Showing 1 changed file with 20 additions and 10 deletions.
diff --git a/oonidata/dataviz/templates/analysis.html b/oonidata/dataviz/templates/analysis.html
@@ -176,12 +176,15 @@ <h2 class="font-bold">Analysis transcript</h2>
 {% endfor %}
 
 
-<h2 class="font-bold text-2xl">Analysis output</h2>
+<h2 class="font-bold text-2xl py-6">Analysis output</h2>
 
 {% for wa in web_analysis %}
-<h2 class="font-bold text-xl py-4">Analysis #{{loop.index}}</h2>
+   <div class="card bg-base-100 shadow-xl my-3">
+        <div class="card-body">
+            <h2 class="card-title">Analysis #{{loop.index}}</h2>
+
 <div class="overflow-x-auto">
-    <table class="table">
+    <table class="table table-xs">
         <thead>
             <tr>
             <th>key</th>
@@ -190,21 +193,25 @@ <h2 class="font-bold text-xl py-4">Analysis #{{loop.index}}</h2>
         </thead>
         <tbody>
             {% for key, value in wa.items() %}
-            <tr>
+            <tr class="hover">
             <td>{{key}}</td>
             <td>{{value}}</td>
             </tr>
             {% endfor %}
         </tbody>
     </table>
 </div>
+</div>
+</div>
 {% endfor %}
 
-<h2 class="font-bold text-2xl">Web Observations</h2>
+<h2 class="font-bold text-2xl py-6">Web Observations</h2>
 {% for wo in web_observations %}
-<h2 class="font-bold text-xl py-4">Observation #{{loop.index}}</h2>
+   <div class="card bg-base-100 shadow-xl my-3">
+        <div class="card-body">
+            <h2 class="card-title">Observation #{{loop.index}}</h2>
 <div class="overflow-x-auto">
-    <table class="table">
+    <table class="table table-xs">
         <thead>
             <tr>
             <th>key</th>
@@ -213,18 +220,21 @@ <h2 class="font-bold text-xl py-4">Observation #{{loop.index}}</h2>
         </thead>
         <tbody>
             {% for key, value in wo.items() %}
-            <tr>
+            <tr class="hover">
             <td>{{key}}</td>
             <td>{{value}}</td>
             </tr>
             {% endfor %}
         </tbody>
     </table>
 </div>
+</div>
+</div>
 {% endfor %}
 
+<h2 class="py-6 text-l font-bold">Experiment results raw</h2>
 <div class="overflow-x-auto">
-    <table class="table">
+    <table class="table table-xs">
         <thead>
             <tr>
             <th>key</th>
@@ -233,7 +243,7 @@ <h2 class="font-bold text-xl py-4">Observation #{{loop.index}}</h2>
         </thead>
         <tbody>
             {% for key, value in website_experiment_result.items() %}
-            <tr>
+            <tr class="hover">
             <td>{{key}}</td>
             <td>{{value}}</td>
             </tr>