From 8217c1c4fd357320076e901c4d9429f3c8ff83ca Mon Sep 17 00:00:00 2001
From: Alex <alexey.dred@gmail.com>
Date: Wed, 25 Mar 2020 14:41:46 +0300
Subject: [PATCH] fix(starter-page): responsive layout

---
 src/app/themes-screen/starter.component.html |  2 +-
 src/app/themes-screen/starter.component.scss | 11 ++++-------
 2 files changed, 5 insertions(+), 8 deletions(-)

diff --git a/src/app/themes-screen/starter.component.html b/src/app/themes-screen/starter.component.html
index 1dc27dcc..ca2fd2af 100644
--- a/src/app/themes-screen/starter.component.html
+++ b/src/app/themes-screen/starter.component.html
@@ -43,7 +43,7 @@
                  alt="{{theme.name}} Theme"/>
           </nb-card-body>
         </nb-card>
-      </ng-container>
+    </ng-container>
   </nb-layout-column>
 
   <nb-layout-footer fixed>
diff --git a/src/app/themes-screen/starter.component.scss b/src/app/themes-screen/starter.component.scss
index 0e3781f0..0114c88a 100644
--- a/src/app/themes-screen/starter.component.scss
+++ b/src/app/themes-screen/starter.component.scss
@@ -6,6 +6,8 @@
   img {
     width: 100%;
     object-fit: contain;
+    height: auto;
+    vertical-align: top;
   }
 
   h4 {
@@ -17,8 +19,10 @@
 
   nb-layout-column {
     display: flex;
+    align-items: flex-start;
     flex-wrap: wrap;
     justify-content: space-between;
+    align-content: flex-start;
   }
 
   nb-card {
@@ -29,7 +33,6 @@
 
   nb-card-body {
     padding: 0;
-    height: auto;
   }
 
   nb-layout-header {
@@ -141,15 +144,9 @@
   }
 
   @include media-breakpoint-down(xl) {
-    h4 {
-      margin: 0;
-    }
   }
 
   @include media-breakpoint-down(lg) {
-    h4 {
-      margin-bottom: 36px;
-    }
 
     nb-card-header {
       padding: 12px 20px;