style(demo): small layout improvements

DerStimmler · May 31, 2024 · 2413d98 · 2413d98
1 parent 6abd683
commit 2413d98
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 4 deletions.
diff --git a/demo/src/app/app.component.html b/demo/src/app/app.component.html
@@ -10,7 +10,9 @@ <h1 class="font-bold">ngx-easy-view-transitions</h1>
         height="48"
         ngSrc="assets/images/github-mark.svg"
         width="48"
-    /></a>
+        class="min-w-8 md:min-w-12"
+      />
+    </a>
   </div>
   <nav class="flex gap-4 md:gap-8 items-center">
     <a

diff --git a/demo/src/app/colors/colors-list.component.html b/demo/src/app/colors/colors-list.component.html
@@ -1,12 +1,11 @@
 <div
-  class="grid gap-16"
-  style="grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr))"
+  class="grid gap-16 grid-cols-[repeat(auto-fill,minmax(4rem,1fr))] md:grid-cols-[repeat(auto-fill,minmax(8rem,1fr))]"
 >
   @for (color of colors; track color.name) {
   <a [routerLink]="color.name">
     <div class="flex flex-col items-center">
       <div
-        class="h-32 aspect-square rounded-2xl"
+        class="h-24 md:h-32 aspect-square rounded-2xl"
         [style.backgroundColor]="color.hex"
         [transitionName]="color.name + '-img'"
       ></div>