From 0a020b37901061ba27a24bc9616be7e7fa995384 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C3=A3o=20Dias?=
 <65513943+retrozinndev@users.noreply.github.com>
Date: Fri, 19 Apr 2024 23:37:23 +0000
Subject: [PATCH] :boom: fix: wrap socials ul content if overflows screen

---
 package-lock.json     |  2 +-
 src/pages/index.astro |  2 +-
 src/styles/global.css | 14 +++++++++-----
 3 files changed, 11 insertions(+), 7 deletions(-)
diff --git a/package-lock.json b/package-lock.json
index 9b6adae..332ad87 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,5 +1,5 @@
 {
-  "name": "retrozinndev.github.io",
+  "name": "retrozinn.dev",
   "version": "0.0.1",
   "lockfileVersion": 3,
   "requires": true,
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 55ab4d1..9766e4e 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -3,7 +3,7 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Document</title>
+    <title>retrozinndev</title>
 </head>
 <body>
     <script>
diff --git a/src/styles/global.css b/src/styles/global.css
index 470d11c..9cf7b87 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -22,6 +22,7 @@ html {
     flex-direction: row;
     justify-content: center;
     align-items: center;
+    width: 100vw;
     height: auto;
 }
 
@@ -58,8 +59,9 @@ body {
 }
 
 .container {
-    margin-left: 1em;
-    width: fit-content;
+    --margin-left: 1em;
+    margin-left: var(--margin-left);
+    width: calc(100vw - var(--margin-left));
 }
 
 h1 {
@@ -136,11 +138,13 @@ iframe {
 }
 
 .socials ul {
-    line-height: 32px;
+    max-width: calc(100vw - var(--margin-left));
+    line-height: 38px;
     font-size: 14px;
     display: flex;
     flex-direction: row;
     list-style-type: none;
+    flex-wrap: wrap;
 }
 
 .socials a.link  {
@@ -164,6 +168,6 @@ footer {
     border-bottom-right-radius: 0;
     font-size: 14px;
     text-align: center;
-    width: 100%;
-    height: 20px;
+    width: 100vw;
+    height: fit-content;
 }
\ No newline at end of file
