From ab5a231224bbc71e5dc954c3e1a772628755d8d5 Mon Sep 17 00:00:00 2001
From: kubgus <ja.gustafik@outlook.sk>
Date: Tue, 18 Jun 2024 23:16:41 +0200
Subject: [PATCH] Change padding to make page easier to read

---
 src/layouts/navbar-for-article.astro | 16 ++++++++++++++++
 src/pages/index.astro                |  6 +++---
 src/styles/article.css               |  2 +-
 src/styles/default-padding.css       |  8 +++++++-
 4 files changed, 27 insertions(+), 5 deletions(-)

diff --git a/src/layouts/navbar-for-article.astro b/src/layouts/navbar-for-article.astro
index 7514d0c..6365f6f 100644
--- a/src/layouts/navbar-for-article.astro
+++ b/src/layouts/navbar-for-article.astro
@@ -11,6 +11,22 @@ const dateString = new Date(frontmatter.date).toLocaleString("en-US", { month: "
 ---
 
 <style>
+    main {
+        padding-inline: 28vw;
+    }
+
+    @media (max-width: 1000px) {
+        main {
+            padding-inline: 10vw;
+        }
+    }
+
+    @media (max-width: 480px) {
+        main {
+            padding-inline: 3vw;
+        }
+    }
+
     .article-header {
         border-bottom: 1px solid var(--secondary-background-dark);
 
diff --git a/src/pages/index.astro b/src/pages/index.astro
index adc36ed..d0c2ef6 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -20,7 +20,7 @@ const title = "Jakub Gustafik";
 ---
 
 <style>
-@media (max-width: 768px) {
+@media (max-width: 1000px) {
     main {
         text-align: center;
     }
@@ -33,7 +33,7 @@ const title = "Jakub Gustafik";
     justify-content: space-between;
 }
 
-@media (max-width: 768px) {
+@media (max-width: 1000px) {
     #hero {
         flex-direction: column-reverse;
         align-items: center;
@@ -80,7 +80,7 @@ const title = "Jakub Gustafik";
     }
 }
 
-@media (max-width: 768px) {
+@media (max-width: 1000px) {
     #link-bar {
         justify-content: center;
         align-items: center;
diff --git a/src/styles/article.css b/src/styles/article.css
index 6f63854..36c7f38 100644
--- a/src/styles/article.css
+++ b/src/styles/article.css
@@ -14,4 +14,4 @@ pre.astro-code {
 blockquote {
     border-left: 0.25rem solid var(--primary-accent-dark);
     padding-left: 1rem;
-}
+}
\ No newline at end of file
diff --git a/src/styles/default-padding.css b/src/styles/default-padding.css
index 10431d2..5c226f7 100644
--- a/src/styles/default-padding.css
+++ b/src/styles/default-padding.css
@@ -4,7 +4,13 @@ main {
     justify-content: center;
     gap: 2.5rem;
 
-    padding: 6rem 13vw;
+    padding: 6rem 20vw;
+}
+
+@media (max-width: 1420px) {
+    main {
+        padding-inline: 10vw;
+    }
 }
 
 @media (max-width: 768px) {