From 37d05e3ec72b3fe1cc71d0bc31371649f911c3e6 Mon Sep 17 00:00:00 2001
From: Ayo Ayco <ramon.aycojr@gmail.com>
Date: Tue, 3 Sep 2024 21:52:25 +0200
Subject: [PATCH] style: vertically center app home (#111)

* style: app-wrapper positioning to vertical center when on home
* refactor: undo unneeded change
* refactor: remove app.css
---
 src/components/Jumbotron.astro |  2 +-
 src/layouts/Layout.astro       | 20 ++++++++++++++++++--
 src/styles/app.css             |  7 -------
 3 files changed, 19 insertions(+), 10 deletions(-)
 delete mode 100644 src/styles/app.css

diff --git a/src/components/Jumbotron.astro b/src/components/Jumbotron.astro
index e7e40f4..e5bc4f2 100644
--- a/src/components/Jumbotron.astro
+++ b/src/components/Jumbotron.astro
@@ -19,7 +19,7 @@
 
     svg {
       border: 0px;
-      width: 280px;
+      width: 300px;
       max-width: 100%;
     }
 
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 84cf4d3..93eaecf 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -1,6 +1,5 @@
 ---
 import { ArticleData } from "@extractus/article-extractor";
-import "../styles/app.css";
 import "../styles/reset.css";
 import '../styles/variables.css';
 
@@ -70,8 +69,25 @@ const appTitle = article?.title ? `${article.title} | Cozy` : 'Cozy';
     max-width: 650px;
     margin: 0 auto;
     padding: 0.5rem;
-    padding-bottom: 2rem;
+    padding-bottom: 5em;
+
+    position: relative;
+    top: 50%;
+    transform: translateY(-50%);
+    -webkit-transform: translateY(-50%);
+
+    &:has(#router-outlet #post) {
+      position: default;
+      top: 0;
+      transform: none;
+      -webkit-transform: none;
+
+      #jumbotron {
+          display: none;
+      }
+    }
   }
+
   #main-content {
     * {
       margin: 1rem 0 0;
diff --git a/src/styles/app.css b/src/styles/app.css
deleted file mode 100644
index 68c0347..0000000
--- a/src/styles/app.css
+++ /dev/null
@@ -1,7 +0,0 @@
-#app-wrapper {
-    &:has(#router-outlet #post) {
-        #jumbotron {
-            display: none;
-        }
-    }
-}
\ No newline at end of file