From 815d2e9a5d1dd9dcbc6a0297265a7a4842223cde Mon Sep 17 00:00:00 2001
From: Niggl <info@nicolai-ort.com>
Date: Tue, 30 Jun 2020 14:10:03 +0200
Subject: [PATCH] Sprint Table now w/ 100% fancy sorting

---
 .../sprint-table/sprint-table.component.html  | 38 ++++++++++---------
 1 file changed, 21 insertions(+), 17 deletions(-)

diff --git a/src/app/sprint-table/sprint-table.component.html b/src/app/sprint-table/sprint-table.component.html
index e824be9..b0c66c3 100644
--- a/src/app/sprint-table/sprint-table.component.html
+++ b/src/app/sprint-table/sprint-table.component.html
@@ -10,31 +10,35 @@
       <tr>
         <th (click)="sortById()" class="sortable">
           <span>ID</span>
-          <span *ngIf="sortBy === 'id'" class="pl-3">
-            <span *ngIf="sortDescending"><i class="fa fa-sort-up"></i></span>
-            <span *ngIf="sortDescending === false"><i class="fa fa-sort-down"></i></span>
-          </span>
+          <span>
+            <span *ngIf="sortBy != 'id'"><i class="fa fa-sort fa-lg"></i></span>
+            <span *ngIf="sortDescending && sortBy === 'id'"><i class="fa fa-sort-up fa-lg"></i></span>
+            <span *ngIf="sortDescending === false && sortBy === 'id'"><i class="fa fa-sort-down fa-lg"></i></span>
+        </span>
         </th>
         <th (click)="sortByTitle()" class="sortable">
           <span>Titel</span>
-          <span *ngIf="sortBy === 'title'" class="pl-3">
-            <span *ngIf="sortDescending"><i class="fa fa-sort-up"></i></span>
-            <span *ngIf="sortDescending === false"><i class="fa fa-sort-down"></i></span>
-          </span>
+          <span>
+            <span *ngIf="sortBy != 'title'"><i class="fa fa-sort fa-lg"></i></span>
+            <span *ngIf="sortDescending && sortBy === 'title'"><i class="fa fa-sort-up fa-lg"></i></span>
+            <span *ngIf="sortDescending === false && sortBy === 'title'"><i class="fa fa-sort-down fa-lg"></i></span>
+        </span>
         </th>
         <th (click)="sortByStartDate()" class="sortable">
             <span>Start</span>
-            <span *ngIf="sortBy === 'startDate'" class="pl-3">
-              <span *ngIf="sortDescending"><i class="fa fa-sort-up"></i></span>
-              <span *ngIf="sortDescending === false"><i class="fa fa-sort-down"></i></span>
-            </span>
+            <span>
+              <span *ngIf="sortBy != 'startDate'"><i class="fa fa-sort fa-lg"></i></span>
+              <span *ngIf="sortDescending && sortBy === 'startDate'"><i class="fa fa-sort-up fa-lg"></i></span>
+              <span *ngIf="sortDescending === false && sortBy === 'startDate'"><i class="fa fa-sort-down fa-lg"></i></span>
+          </span>
           </th>
-          <th (click)="sortByEndDate()" class="endDate">
+          <th (click)="sortByEndDate()" class="sortable">
             <span>End</span>
-            <span *ngIf="sortBy === 'endDate'" class="pl-3">
-              <span *ngIf="sortDescending"><i class="fa fa-sort-up"></i></span>
-              <span *ngIf="sortDescending === false"><i class="fa fa-sort-down"></i></span>
-            </span>
+            <span>
+              <span *ngIf="sortBy != 'endDate'"><i class="fa fa-sort fa-lg"></i></span>
+              <span *ngIf="sortDescending && sortBy === 'endDate'"><i class="fa fa-sort-up fa-lg"></i></span>
+              <span *ngIf="sortDescending === false && sortBy === 'endDate'"><i class="fa fa-sort-down fa-lg"></i></span>
+          </span>
           </th>
         <th></th>
       </tr>