prepared history

src/app/app.component.html

@@ -90,15 +90,33 @@
       </div>
       <div class="form-group mb-4">
         <label class="form-control-label">
-          Aufspleißen
+          Lienienanzahl
         </label>
         <input type="number" class="form-control" formControlName="spread" min="0" max="40">
       </div>
       <div class="dropdown-divider mb-4"></div>
       <button type="submit" class="btn btn-lg btn-primary btn-block" [disabled]="configForm.invalid">Aktualisieren</button>
     </form>
+
     <div class="dropdown-divider"></div>
+
     <button class="btn btn-secondary btn-block" (click)="exportSvg()">Download</button>
+
+    <div class="dropdown-divider"></div>
+
+    <button class="btn btn-secondary btn-block" (click)="toggleList()">Chronik <span class="badge badge-light">{{ list.length }}</span></button>
+
+    <ul *ngIf="showList" class="list-group list-group-flush mt-4">
+      <li *ngFor="let item of list" class="list-group-item d-flex justify-content-between align-items-center" (click)="restoreGraph(item)">
+        {{ item.date | date:'dd.MM.y · HH:mm:ss' }} Uhr
+        <span class="badge badge-primary badge-pill">
+          {{ item.config.nodes }} Knoten
+        </span>
+        <span class="badge badge-primary badge-pill">
+          {{ item.config.spread }} Linien
+        </span>
+      </li>
+    </ul>
   </div>
 </aside>