feat: update home page style

Author: lc-soft

app/assets/views/home.xml

@@ -1,19 +1,21 @@
 <?xml version="1.0" encoding="UTF-8" ?>
 <lcui-app>
   <ui>
-    <w class="v-home__cards container d-flex justify-content-center">
-      <router-link class="v-home__card" to="/welcome">
-        <icon class="v-home__card-icon text-pink" name="emoticon-cool-outline" />
-        <text class="v-home__card-title">Welcome!</text>
-      </router-link>
-      <router-link class="v-home__card" to="/file">
-        <icon class="v-home__card-icon text-orange" name="folder-search" />
-        <text class="v-home__card-title">File</text>
-      </router-link>
-      <router-link class="v-home__card" to="/help">
-        <icon class="v-home__card-icon text-blue" name="help-box" />
-        <text class="v-home__card-title">About</text>
-      </router-link>
-    </w>
+    <w class=" container">
+      <w class="v-home__cards d-flex justify-content-center align-items-center">
+        <router-link class="v-home__card" to="/welcome">
+          <icon class="v-home__card-icon text-pink" name="emoticon-cool-outline" />
+          <text class="v-home__card-title">Welcome!</text>
+        </router-link>
+        <router-link class="v-home__card" to="/file">
+          <icon class="v-home__card-icon text-orange" name="folder-search" />
+          <text class="v-home__card-title">File</text>
+        </router-link>
+        <router-link class="v-home__card" to="/help">
+          <icon class="v-home__card-icon text-blue" name="help-box" />
+          <text class="v-home__card-title">About</text>
+        </router-link>
+      </w>
+      </w>
   </ui>
 </lcui-app>

src/ui/stylesheets/components/_frame-tab.scss

@@ -67,6 +67,7 @@
   position: relative;
   margin-right: -1px;
   padding: 8px;
+  display: flex;
   border-top-left-radius: 8px;
   border-top-right-radius: 8px;
 

src/ui/stylesheets/views/_home.scss

@@ -1,5 +1,14 @@
 .v-home {
+  display: flex;
+  height: 100%;
+  padding-bottom: 60px;
+  align-items: center;
 
+  .container {
+    display: flex;
+    justify-content: center;
+    max-width: $home-card-width * 4;
+  }
 }
 
 .v-home__card-icon {
@@ -18,6 +27,7 @@
   display: block;
   text-align: center;
   line-height: $home-card-title-line-height;
+  margin-bottom: $home-card-spacing / 2;
 }
 
 .v-home__card {