From 8681ac60cc5b1c599be2ddc46f23b9a157a921e7 Mon Sep 17 00:00:00 2001
From: Yuri Zamyatin <yuri@yrz.am>
Date: Sun, 8 Dec 2024 20:14:08 +0000
Subject: [PATCH] section buttons layou

---
 assets/css/home-layout.scss | 35 ++++++++++++++++++++++++-----------
 1 file changed, 24 insertions(+), 11 deletions(-)

diff --git a/assets/css/home-layout.scss b/assets/css/home-layout.scss
index b12bd38..b602a68 100644
--- a/assets/css/home-layout.scss
+++ b/assets/css/home-layout.scss
@@ -91,30 +91,27 @@
   flex-wrap: wrap;
   gap: 0.5rem;
   .section-item {
+    flex: 1;
     white-space: nowrap;
     text-decoration: none;
     box-shadow: 0 0 0.25rem rgba(0,0,0,0.5);
+    border-radius: 1rem;
+    border: 1px solid $color-fg-op-m;
     &:hover {
       border: 1px solid $color-fg-accent;
     }
-    display: block;
-    flex: 1 0 30%;
-    border: 1px solid $color-fg-op-m;
-    border-radius: 1rem;
-    text-align: center;
-    padding: 1rem;
+    display: flex;
+    justify-content: center;
+    align-items: center;
     .icon {
       height: 2.5rem;
       width: 2.5rem;
-      vertical-align: middle;
       color: $color-fg-op-m;
     }
     .label {
       font-size: 1.3rem;
       font-weight: bold;
       color: $color-fg-dark;
-      vertical-align: middle;
-      margin: 0 0 0 0.75rem;
     }
   }
 }
@@ -133,6 +130,18 @@
       flex-basis: 100%;
     }
   }
+  .home-layout-container .content.home .section-list {
+    .section-item {
+      flex-wrap: wrap;
+      padding: 0.75rem;
+      .icon {
+        flex-basis: 100%;
+      }
+      .label {
+        margin: 0.25rem 0 0 0;
+      }
+    }
+  }
 }
 @mixin media--home-content-about_vert_middle {
   .home-layout-container {
@@ -143,8 +152,12 @@
     }
   }
   .home-layout-container .content.home .section-list {
-    .section-item .label {
-      font-size: 1.6rem;
+    .section-item {
+      padding: 1rem;
+      .label {
+        margin: 0 0 0 0.75rem;
+        font-size: 1.6rem;
+      }
     }
   }
 }