From 8758a6bbd9b2f0ee0cd23a6a5d19faeca0e9b43b Mon Sep 17 00:00:00 2001
From: Elliptic Ellipsis <elliptic.ellipsis@gmail.com>
Date: Sun, 12 Dec 2021 22:21:18 +0000
Subject: [PATCH] spacing hack

---
 .../game-progress.component.html              | 72 ++++++++++---------
 .../game-progress.component.scss              |  4 ++
 2 files changed, 41 insertions(+), 35 deletions(-)

diff --git a/src/app/games/game/game-progress/game-progress.component.html b/src/app/games/game/game-progress/game-progress.component.html
index 0c1080b..9fe6f30 100644
--- a/src/app/games/game/game-progress/game-progress.component.html
+++ b/src/app/games/game/game-progress/game-progress.component.html
@@ -1,35 +1,37 @@
-<n64-box [number]="1" heading="Project progress">
-  <strong class="key">Last updated</strong>
-  <strong class="value date">{{ lastUpdate }}</strong>
-  <br/>
-  <ng-container *ngFor="let chart of metrics; let i = index">
-    <hr>
-    <table>
-      <thead>
-        <th scope="col">  {{ (totals[i] | keyvalue)[0].key }}</th>
-        <ng-container *ngFor="let name of this.game.charts[i].line_names; let j = index">
-          <th scope="col" [ngClass]="{nonmatching: j === 0, matching: j === 1}">{{ name }}</th>
-        </ng-container>
-      </thead>
-      <tbody>
-        <tr>
-          <th scope="row">
-            <strong class="key">Total</strong>
-          </th>
-          <td *ngFor="let total of (totals[i] | keyvalue)[0].value; let j = index">
-            <strong [ngClass]="{nonmatching: j === 0, matching: j === 1}">{{ (total * 100).toFixed(2) }}%</strong>
-          </td>
-        </tr>
-        <tr *ngFor="let metric of chart | keyvalue: originalOrder">
-            <th scope="row" class="key">{{ metric.key }}</th>
-            <td *ngFor="let val of metric.value; let j = index">
-              <div [ngClass]="{nonmatching: j === 0, matching: j === 1}">{{ (val * 100).toFixed(2) }}%</div>
-            </td>
-        </tr>
-      </tbody>
-    </table>
-  </ng-container>
-</n64-box>
-<n64-box [simple]="true" *ngFor="let chart of game.charts">
-  <game-chart [datasets]="datasets" [metadata]="chart"></game-chart>
-</n64-box>
+<ng-container *ngFor="let chart of metrics; let i = index">
+  <div class="box-wrapper">
+    <n64-box [number]="i" heading="Project progress">
+      <strong class="key">Last updated</strong>
+      <strong class="value date">{{ lastUpdate }}</strong>
+      <br/>
+        <hr>
+        <table>
+          <thead>
+            <th scope="col">  {{ (totals[i] | keyvalue)[0].key }}</th>
+            <ng-container *ngFor="let name of game.charts[i].line_names; let j = index">
+              <th scope="col" [ngClass]="{nonmatching: j === 0, matching: j === 1}">{{ name }}</th>
+            </ng-container>
+          </thead>
+          <tbody>
+            <tr>
+              <th scope="row">
+                <strong class="key">Total</strong>
+              </th>
+              <td *ngFor="let total of (totals[i] | keyvalue)[0].value; let j = index">
+                <strong [ngClass]="{nonmatching: j === 0, matching: j === 1}">{{ (total * 100).toFixed(2) }}%</strong>
+              </td>
+            </tr>
+            <tr *ngFor="let metric of chart | keyvalue: originalOrder">
+                <th scope="row" class="key">{{ metric.key }}</th>
+                <td *ngFor="let val of metric.value; let j = index">
+                  <div [ngClass]="{nonmatching: j === 0, matching: j === 1}">{{ (val * 100).toFixed(2) }}%</div>
+                </td>
+            </tr>
+          </tbody>
+        </table>
+      </n64-box>
+      <n64-box [simple]="true">
+        <game-chart [datasets]="datasets" [metadata]="game.charts[i]"></game-chart>
+      </n64-box>
+  </div>
+</ng-container>
diff --git a/src/app/games/game/game-progress/game-progress.component.scss b/src/app/games/game/game-progress/game-progress.component.scss
index b2e73d1..3655b52 100644
--- a/src/app/games/game/game-progress/game-progress.component.scss
+++ b/src/app/games/game/game-progress/game-progress.component.scss
@@ -51,3 +51,7 @@ tbody td {
   text-align: right;
   white-space: nowrap;
 }
+
+.box-wrapper {
+  margin: 1rem 0rem;
+}