From ee662577e09b388ba3ef767e45ed7d7ec5665adb Mon Sep 17 00:00:00 2001
From: "Samuel M. Bednarz" <samuelmorkbednarz@gmail.com>
Date: Wed, 18 Dec 2024 00:25:43 +0100
Subject: [PATCH] Refactor layout styles: adjust width for mobile
 responsiveness and update typography alignment for improved readability

---
 apps/hub/app/layouts/default.vue       | 8 +++-----
 packages/nobel/styles/_typography.scss | 2 ++
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/apps/hub/app/layouts/default.vue b/apps/hub/app/layouts/default.vue
index eecd424..963ded1 100644
--- a/apps/hub/app/layouts/default.vue
+++ b/apps/hub/app/layouts/default.vue
@@ -76,15 +76,13 @@ onKeyStroke('Escape', () => {
   max-width: 1900px;
   gap: var(--space-4);
 
-  transform: translateY(0px) translateX(0px);
-
-  width: 100dvw;
-  overflow: hidden;
   min-height: 100vh;
   padding-bottom: var(--space-5);
   background-color: var(--base-20);
 
-  transition: var(--slow);
+  @media (max-width: 800px) {
+    width: 100dvw;
+  }
 }
 
 .layout .content-layer .vignet {
diff --git a/packages/nobel/styles/_typography.scss b/packages/nobel/styles/_typography.scss
index fa94e75..8a78ce9 100644
--- a/packages/nobel/styles/_typography.scss
+++ b/packages/nobel/styles/_typography.scss
@@ -43,6 +43,7 @@ button {
   word-break: break-all;
   white-space: pre-wrap;
   text-transform: capitalize;
+  text-align: center;
 }
 
 h1.display,
@@ -54,6 +55,7 @@ h1.display,
 
 h1,
 .h1 {
+  text-align: left;
   font-size: var(--h1-size);
   line-height: var(--h1-size);
   font-variation-settings: var(--font-bold);