From 5cf9f4d6315782f46a63dbaeaba73d087799cc1e Mon Sep 17 00:00:00 2001
From: moebiusmania <moebiusmania@gmail.com>
Date: Sun, 7 Apr 2024 11:03:37 +0200
Subject: [PATCH] fix: some styles post Talwind removal

---
 components/Footer.server.vue | 10 ++++++----
 components/Header.vue        |  3 ++-
 components/PostPreview.vue   |  1 +
 globals.css                  | 14 +++++++++++++-
 pages/post/[slug].vue        |  2 ++
 5 files changed, 24 insertions(+), 6 deletions(-)

diff --git a/components/Footer.server.vue b/components/Footer.server.vue
index bdc5e4273..e6d02890c 100644
--- a/components/Footer.server.vue
+++ b/components/Footer.server.vue
@@ -10,7 +10,7 @@ const today: Date = new Date();
         &copy; 2010 - {{ today.getFullYear() }} — sviluppato con
         <a href="https://v3.nuxtjs.org/" rel="noopener noreferrer" target="_blank">Nuxt 3</a>
       </p>
-      <div>
+      <div class="social">
         <a href="https://github.com/moebiusmania" target="_blank" rel="noopener noreferrer">
           <svg role="img" fill="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
             viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
@@ -80,7 +80,7 @@ footer {
 
     &>p {
       display: flex;
-      margin-top: var(--sp-2);
+      margin: var(--sp-2) 0 0 0;
       font-size: 0.875rem;
       line-height: 1.25rem;
       color: var(--text-content-dark);
@@ -98,7 +98,7 @@ footer {
       }
     }
 
-    &>div {
+    &>.social {
       display: flex;
       margin-top: var(--sp-2);
       gap: 0.75rem;
@@ -113,7 +113,9 @@ footer {
         justify-content: flex-end;
       }
 
-      & a {
+      &>a {
+        color: var(--text-base-content) !important;
+
         & svg {
           width: 1.25rem;
           height: 1.25rem;
diff --git a/components/Header.vue b/components/Header.vue
index d29735aba..b54117e12 100644
--- a/components/Header.vue
+++ b/components/Header.vue
@@ -48,7 +48,7 @@ const isActive = (href: string, route: any) => ["navitem", { "router-link-active
 
 <style scoped>
 header {
-  color: #4B5563;
+  color: var(--text-base-content);
 
   &>div {
     display: flex;
@@ -101,6 +101,7 @@ header {
 
       &>a.navitem {
         margin-right: var(--sp-3);
+        color: var(--text-base-content);
 
         &:hover {
           color: var(--header-link-hover);
diff --git a/components/PostPreview.vue b/components/PostPreview.vue
index ef50722b8..3f0ba9507 100644
--- a/components/PostPreview.vue
+++ b/components/PostPreview.vue
@@ -81,6 +81,7 @@ li {
     }
 
     & h2 {
+      margin-top: 0;
       margin-bottom: var(--sp-1);
       color: var(--text-base-content)
     }
diff --git a/globals.css b/globals.css
index 7e6e65716..5ef4dd94d 100644
--- a/globals.css
+++ b/globals.css
@@ -71,6 +71,12 @@ h2 {
   line-height: 2rem;
 }
 
+a {
+  text-decoration: none;
+  color: var(--primary);
+}
+
+/* CONTENT SPECIFIC STYLES */
 .content {
   font-size: 1rem;
   line-height: 1.75;
@@ -105,6 +111,12 @@ h2 {
   }
 
   & a {
-    color: var(--primary)
+    color: var(--primary);
+  }
+
+  & img {
+    height: auto;
+    max-width: 100%;
+    display: block;
   }
 }
\ No newline at end of file
diff --git a/pages/post/[slug].vue b/pages/post/[slug].vue
index a04d7fec9..12c5f588c 100644
--- a/pages/post/[slug].vue
+++ b/pages/post/[slug].vue
@@ -76,6 +76,8 @@ div {
       text-align: center;
 
       &>h1 {
+        margin: var(--sp-2) 0;
+
         @media (min-width: 768px) {
           font-size: 3rem;
         }