From a15169dc209cdccee9724255725d7cd8062f7acf Mon Sep 17 00:00:00 2001
From: SDaian <scuarissid@gmail.com>
Date: Mon, 11 Jul 2022 13:13:46 +0200
Subject: [PATCH 1/7] [angular-ngrx-scss] - Gists panel improvements

---
 .../src/app/home/home.component.scss           |  8 +++++++-
 .../top-repositories.component.scss            | 12 +++++++++---
 .../home/user-gists/user-gists.component.html  | 18 ++++++++++++------
 .../home/user-gists/user-gists.component.scss  |  4 ++++
 4 files changed, 32 insertions(+), 10 deletions(-)

diff --git a/angular-ngrx-scss/src/app/home/home.component.scss b/angular-ngrx-scss/src/app/home/home.component.scss
index 45dba192e..6b24be019 100644
--- a/angular-ngrx-scss/src/app/home/home.component.scss
+++ b/angular-ngrx-scss/src/app/home/home.component.scss
@@ -15,13 +15,19 @@
 
 .main {
   display: grid;
-  grid-template-columns: 24rem 1fr;
+  grid-template-columns: 1fr;
   grid-row: 2 / 3;
   grid-column: 1 / 3;
   background: variables.$gray100;
+  @media (min-width: 768px) {
+    grid-template-columns: 24rem 1fr;
+  }
 }
 
 aside {
   background: variables.$white;
   padding: 2rem;
+  @media (max-width: 768px) {
+    order: 2;
+  }
 }
diff --git a/angular-ngrx-scss/src/app/home/top-repositories/top-repositories.component.scss b/angular-ngrx-scss/src/app/home/top-repositories/top-repositories.component.scss
index 5919b2917..bbf8b9e4f 100644
--- a/angular-ngrx-scss/src/app/home/top-repositories/top-repositories.component.scss
+++ b/angular-ngrx-scss/src/app/home/top-repositories/top-repositories.component.scss
@@ -1,7 +1,10 @@
 @use '../../shared/styles/variables';
 
 .top-repositories-container {
-  padding: 3rem;
+  padding: 1.5rem;
+  @media (min-width: 768px) {
+    padding: 3rem;
+  }
   h2 {
     font-size: 18px;
     line-height: 28px;
@@ -14,9 +17,12 @@
     border-width: 1px;
   }
   .repo-section {
-    padding: 2rem 0;
-    padding-left: 2rem;
+    padding: 1rem;
     border-bottom: 1px solid variables.$gray300;
+    @media (min-width: 768px) {
+      padding: 2rem 0;
+      padding-left: 2rem;
+    }
   }
   .view-all-link {
     padding: 1.25rem;
diff --git a/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html b/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html
index be7e700d4..24e5976cd 100644
--- a/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html
+++ b/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html
@@ -1,14 +1,20 @@
 <div class="container">
   <h3>Gists</h3>
   <ng-container *ngIf="userGists$ | async as gists">
-    <ng-container *ngIf="gists.length > 0">
-      <div class="list-container">
+    <ng-container *ngIf="gists.length > 0; else noGists">
+      <ul>
         <ng-container *ngFor="let gist of gists">
-          <a class="link" [href]="gist.url" target="_blank">{{
-            gist.fileName
-          }}</a>
+          <li>
+            <a class="link" [href]="gist.url" target="_blank">{{
+              gist.fileName
+            }}</a>
+          </li>
         </ng-container>
-      </div>
+      </ul>
     </ng-container>
   </ng-container>
 </div>
+
+<ng-template #noGists>
+  <p>User does not have any gists</p>
+</ng-template>
diff --git a/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.scss b/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.scss
index 2d777c505..8e28dd556 100644
--- a/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.scss
+++ b/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.scss
@@ -4,6 +4,10 @@
   padding: 2rem 0;
   border-top: 1px solid variables.$gray300;
   border-bottom: 1px solid variables.$gray300;
+  ul {
+    list-style: none;
+    padding: 0;
+  }
   h3 {
     font-weight: 600;
   }

From a7bf329bd247f22dab1ced516194dc91f9ceca55 Mon Sep 17 00:00:00 2001
From: SDaian <scuarissid@gmail.com>
Date: Tue, 12 Jul 2022 16:42:26 +0200
Subject: [PATCH 2/7] Fix comments

---
 angular-ngrx-scss/src/app/home/home.component.scss  |  4 ++--
 .../top-repositories.component.scss                 |  7 +++----
 .../app/home/user-gists/user-gists.component.html   | 13 +++++--------
 3 files changed, 10 insertions(+), 14 deletions(-)

diff --git a/angular-ngrx-scss/src/app/home/home.component.scss b/angular-ngrx-scss/src/app/home/home.component.scss
index 6b24be019..7934b247b 100644
--- a/angular-ngrx-scss/src/app/home/home.component.scss
+++ b/angular-ngrx-scss/src/app/home/home.component.scss
@@ -19,7 +19,7 @@
   grid-row: 2 / 3;
   grid-column: 1 / 3;
   background: variables.$gray100;
-  @media (min-width: 768px) {
+  @media (min-width: variables.$md) {
     grid-template-columns: 24rem 1fr;
   }
 }
@@ -27,7 +27,7 @@
 aside {
   background: variables.$white;
   padding: 2rem;
-  @media (max-width: 768px) {
+  @media (max-width: Variables.$md) {
     order: 2;
   }
 }
diff --git a/angular-ngrx-scss/src/app/home/top-repositories/top-repositories.component.scss b/angular-ngrx-scss/src/app/home/top-repositories/top-repositories.component.scss
index bbf8b9e4f..63ae8103a 100644
--- a/angular-ngrx-scss/src/app/home/top-repositories/top-repositories.component.scss
+++ b/angular-ngrx-scss/src/app/home/top-repositories/top-repositories.component.scss
@@ -2,7 +2,7 @@
 
 .top-repositories-container {
   padding: 1.5rem;
-  @media (min-width: 768px) {
+  @media (min-width: variables.$md) {
     padding: 3rem;
   }
   h2 {
@@ -19,9 +19,8 @@
   .repo-section {
     padding: 1rem;
     border-bottom: 1px solid variables.$gray300;
-    @media (min-width: 768px) {
-      padding: 2rem 0;
-      padding-left: 2rem;
+    @media (min-width: variables.$md) {
+      padding: 2rem 0 2rem 2rem;
     }
   }
   .view-all-link {
diff --git a/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html b/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html
index 24e5976cd..2f71130ed 100644
--- a/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html
+++ b/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html
@@ -1,15 +1,12 @@
 <div class="container">
   <h3>Gists</h3>
   <ng-container *ngIf="userGists$ | async as gists">
-    <ng-container *ngIf="gists.length > 0; else noGists">
+    <ng-container *ngIf="(gists?.length); else noGists">
       <ul>
-        <ng-container *ngFor="let gist of gists">
-          <li>
-            <a class="link" [href]="gist.url" target="_blank">{{
-              gist.fileName
-            }}</a>
-          </li>
-        </ng-container>
+        <li *ngFor="let gist of gists">
+          <a class="link" [href]="gist.url" target="_blank">
+            {{gist.fileName}}</a>
+        </li>
       </ul>
     </ng-container>
   </ng-container>

From b65fa4961b160b4fdbc8325e3fd3bf7197455578 Mon Sep 17 00:00:00 2001
From: SDaian <scuarissid@gmail.com>
Date: Tue, 12 Jul 2022 16:46:41 +0200
Subject: [PATCH 3/7] Fix typo on scss file

---
 angular-ngrx-scss/src/app/home/home.component.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/angular-ngrx-scss/src/app/home/home.component.scss b/angular-ngrx-scss/src/app/home/home.component.scss
index 7934b247b..5609d728b 100644
--- a/angular-ngrx-scss/src/app/home/home.component.scss
+++ b/angular-ngrx-scss/src/app/home/home.component.scss
@@ -27,7 +27,7 @@
 aside {
   background: variables.$white;
   padding: 2rem;
-  @media (max-width: Variables.$md) {
+  @media (max-width: variables.$md) {
     order: 2;
   }
 }

From 31852475df2354e40ae92781ab33d7087ee9f05a Mon Sep 17 00:00:00 2001
From: SDaian <scuarissid@gmail.com>
Date: Tue, 12 Jul 2022 16:48:41 +0200
Subject: [PATCH 4/7] Format check

---
 .../src/app/home/user-gists/user-gists.component.html        | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html b/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html
index 2f71130ed..792c5b46f 100644
--- a/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html
+++ b/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html
@@ -1,11 +1,12 @@
 <div class="container">
   <h3>Gists</h3>
   <ng-container *ngIf="userGists$ | async as gists">
-    <ng-container *ngIf="(gists?.length); else noGists">
+    <ng-container *ngIf="gists?.length; else noGists">
       <ul>
         <li *ngFor="let gist of gists">
           <a class="link" [href]="gist.url" target="_blank">
-            {{gist.fileName}}</a>
+            {{ gist.fileName }}</a
+          >
         </li>
       </ul>
     </ng-container>

From b431dee8d22281b4b0e88fd4c9aeb19e60a0b857 Mon Sep 17 00:00:00 2001
From: SDaian <scuarissid@gmail.com>
Date: Tue, 12 Jul 2022 16:56:01 +0200
Subject: [PATCH 5/7] Remove innecesary container

---
 .../src/app/home/user-gists/user-gists.component.html         | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html b/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html
index 792c5b46f..ea58340b6 100644
--- a/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html
+++ b/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html
@@ -1,15 +1,13 @@
 <div class="container">
   <h3>Gists</h3>
   <ng-container *ngIf="userGists$ | async as gists">
-    <ng-container *ngIf="gists?.length; else noGists">
-      <ul>
+      <ul *ngIf="gists?.length; else noGists">
         <li *ngFor="let gist of gists">
           <a class="link" [href]="gist.url" target="_blank">
             {{ gist.fileName }}</a
           >
         </li>
       </ul>
-    </ng-container>
   </ng-container>
 </div>
 

From 228a37406bad4f77daa5ee7c955a872d3a7bb8fc Mon Sep 17 00:00:00 2001
From: SDaian <scuarissid@gmail.com>
Date: Tue, 12 Jul 2022 16:57:55 +0200
Subject: [PATCH 6/7] format check fix

---
 .../app/home/user-gists/user-gists.component.html  | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html b/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html
index ea58340b6..1773770cf 100644
--- a/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html
+++ b/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html
@@ -1,13 +1,13 @@
 <div class="container">
   <h3>Gists</h3>
   <ng-container *ngIf="userGists$ | async as gists">
-      <ul *ngIf="gists?.length; else noGists">
-        <li *ngFor="let gist of gists">
-          <a class="link" [href]="gist.url" target="_blank">
-            {{ gist.fileName }}</a
-          >
-        </li>
-      </ul>
+    <ul *ngIf="gists?.length; else noGists">
+      <li *ngFor="let gist of gists">
+        <a class="link" [href]="gist.url" target="_blank">
+          {{ gist.fileName }}</a
+        >
+      </li>
+    </ul>
   </ng-container>
 </div>
 

From 1b7799747ee2d5a004823013f604632ecd76bf8a Mon Sep 17 00:00:00 2001
From: SDaian <scuarissid@gmail.com>
Date: Tue, 12 Jul 2022 17:03:37 +0200
Subject: [PATCH 7/7] Fix format check

---
 .../src/app/home/user-gists/user-gists.component.html         | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html b/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html
index 1773770cf..ccf1d2dba 100644
--- a/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html
+++ b/angular-ngrx-scss/src/app/home/user-gists/user-gists.component.html
@@ -4,8 +4,8 @@ <h3>Gists</h3>
     <ul *ngIf="gists?.length; else noGists">
       <li *ngFor="let gist of gists">
         <a class="link" [href]="gist.url" target="_blank">
-          {{ gist.fileName }}</a
-        >
+          {{ gist.fileName }}
+        </a>
       </li>
     </ul>
   </ng-container>