From e56b92c0d9a9b8051dcfe11d78103f416533abf4 Mon Sep 17 00:00:00 2001
From: Erik Tiekstra <erik.tiekstra@arbetsformedlingen.se>
Date: Tue, 4 May 2021 14:28:47 +0200
Subject: [PATCH] Now using more digi-core components

---
 .../staff-list/staff-list.component.html      |  4 +--
 .../pages/staff/staff.component.scss          |  5 ---
 .../participants-list.component.html          |  4 +--
 .../src/app/pages/start/start.component.html  | 32 ++++++++-----------
 .../src/app/pages/start/start.component.scss  | 30 +++++++++--------
 apps/dafa-web/src/styles/styles.scss          |  2 +-
 6 files changed, 35 insertions(+), 42 deletions(-)

diff --git a/apps/dafa-web/src/app/pages/administration/pages/staff/components/staff-list/staff-list.component.html b/apps/dafa-web/src/app/pages/administration/pages/staff/components/staff-list/staff-list.component.html
index c06a88c..e0895ed 100644
--- a/apps/dafa-web/src/app/pages/administration/pages/staff/components/staff-list/staff-list.component.html
+++ b/apps/dafa-web/src/app/pages/administration/pages/staff/components/staff-list/staff-list.component.html
@@ -1,4 +1,4 @@
-<digi-ng-table>
+<digi-table af-variation="secondary">
   <table>
     <thead>
       <tr>
@@ -41,7 +41,7 @@
       </tr>
     </tbody>
   </table>
-</digi-ng-table>
+</digi-table>
 
 <digi-navigation-pagination
   *ngIf="staff.length > pagedStaff.length"
diff --git a/apps/dafa-web/src/app/pages/administration/pages/staff/staff.component.scss b/apps/dafa-web/src/app/pages/administration/pages/staff/staff.component.scss
index db127d6..f819d31 100644
--- a/apps/dafa-web/src/app/pages/administration/pages/staff/staff.component.scss
+++ b/apps/dafa-web/src/app/pages/administration/pages/staff/staff.component.scss
@@ -4,11 +4,6 @@
     margin-top: var(--digi--layout--gutter);
   }
 
-  &__link {
-    display: inline-flex;
-    align-items: center;
-    gap: var(--digi--layout--gutter--s);
-  }
   &__search-wrapper {
     display: flex;
     max-width: var(--digi--typography--text--max-width);
diff --git a/apps/dafa-web/src/app/pages/participants/components/participants-list/participants-list.component.html b/apps/dafa-web/src/app/pages/participants/components/participants-list/participants-list.component.html
index 4f68955..f660dec 100644
--- a/apps/dafa-web/src/app/pages/participants/components/participants-list/participants-list.component.html
+++ b/apps/dafa-web/src/app/pages/participants/components/participants-list/participants-list.component.html
@@ -1,4 +1,4 @@
-<digi-ng-table>
+<digi-table af-variation="secondary">
   <table>
     <thead>
       <tr>
@@ -69,7 +69,7 @@
       </tr>
     </tbody>
   </table>
-</digi-ng-table>
+</digi-table>
 
 <digi-navigation-pagination
   *ngIf="participants.length > pagedParticipants.length"
diff --git a/apps/dafa-web/src/app/pages/start/start.component.html b/apps/dafa-web/src/app/pages/start/start.component.html
index 267e532..40b0705 100644
--- a/apps/dafa-web/src/app/pages/start/start.component.html
+++ b/apps/dafa-web/src/app/pages/start/start.component.html
@@ -1,10 +1,10 @@
 <section class="start">
   <digi-typography>
-    <h1>Välkommen till DAFA 2.0</h1>
+    <h1>Välkommen till Mina Sidor FA</h1>
     <p>Här finner du de senaste nyheterna om uppdateringar, notiser och mer.</p>
   </digi-typography>
   <div class="start__wrapper">
-    <div class="start__main">
+    <div class="start__notifications">
       <digi-info-card af-heading="Notiser" af-heading-level="h1" af-type="info" af-link-text="Deltagare">
         <p>
           Det har kommit in nya avrop med deltagare, länken nedan tar dig till fliken Nya deltagare. Du finner den också
@@ -15,25 +15,19 @@
       </digi-info-card>
     </div>
 
-    <div class="start__sidebar">
-      <digi-ng-notification-alert afVariation="info" afSize="l" afHeading="Viktig information" afHeadingLevel="h3">
+    <div class="start__alerts">
+      <digi-notification-alert af-variation="info" af-heading="Viktig information" af-heading-level="h3">
         <p>Large alert! Check the knobs section and play around!</p>
-      </digi-ng-notification-alert>
-      <div class="start__sidebar-alert">
-        <digi-ng-notification-alert
-          afVariation="success"
-          afSize="l"
-          afCloseable="true"
-          afHeading="Allt gick bra"
-          afHeadingLevel="h3"
-        >
-          <p>Dina skickade tilldelningar har nått fram till handledare som godkänt och arbetat vidare med deltagarna</p>
-        </digi-ng-notification-alert>
-      </div>
+      </digi-notification-alert>
+      <digi-notification-alert af-variation="success" af-heading="Allt gick bra" af-heading-level="h3">
+        <p>Dina skickade tilldelningar har nått fram till handledare som godkänt och arbetat vidare med deltagarna</p>
+      </digi-notification-alert>
     </div>
-    <div class="start__footer">
-      <digi-info-card af-heading="Statistik" af-heading-level="h1" af-type="info">
-        <p><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /></p>
+    <div class="start__statistics">
+      <digi-info-card af-heading="Statistik" af-heading-level="h2" af-type="info">
+        Lorem ipsum dolor sit amet consectetur adipisicing elit. Asperiores dolores debitis enim. Voluptatum debitis
+        necessitatibus, distinctio expedita officiis maiores eum sapiente molestiae eveniet soluta dolores non, porro
+        quo vitae tenetur?
       </digi-info-card>
     </div>
   </div>
diff --git a/apps/dafa-web/src/app/pages/start/start.component.scss b/apps/dafa-web/src/app/pages/start/start.component.scss
index bf22016..b039413 100644
--- a/apps/dafa-web/src/app/pages/start/start.component.scss
+++ b/apps/dafa-web/src/app/pages/start/start.component.scss
@@ -1,24 +1,28 @@
 @import 'variables/gutters';
 .start {
   &__wrapper {
+    margin-top: $digi--layout--gutter--l;
     display: grid;
     grid-template-rows: auto;
     grid-template-areas:
-      'header header '
-      'main  sidebar'
-      'footer footer ';
-    grid-gap: var(--digi--layout--gutter);
+      'header header'
+      'notifications alerts'
+      'statistics statistics ';
+    gap: $digi--layout--gutter--l;
   }
-  &__main {
-    grid-area: main;
+
+  &__notifications {
+    grid-area: notifications;
   }
-  &__sidebar {
-    grid-area: sidebar;
+
+  &__alerts {
+    grid-area: alerts;
+    display: flex;
+    flex-direction: column;
+    gap: var(--digi--layout--gutter);
   }
-  &__sidebar-alert {
-    margin-top: var(--digi--layout--gutter);
-  }
-  &__footer {
-    grid-area: footer;
+
+  &__statistics {
+    grid-area: statistics;
   }
 }
diff --git a/apps/dafa-web/src/styles/styles.scss b/apps/dafa-web/src/styles/styles.scss
index c61dac8..1c35aab 100644
--- a/apps/dafa-web/src/styles/styles.scss
+++ b/apps/dafa-web/src/styles/styles.scss
@@ -1,4 +1,4 @@
-@import '~@digi/styles/src/digi';
+@import '@digi/core/dist/digi/digi.css';
 @import 'mixins/a11y';
 @import 'mixins/icon';