From 758a66fb7d152a50c4f0f4645b56beba8fc6dd1c Mon Sep 17 00:00:00 2001
From: GivFNZ <givfnz@p0ntus.com>
Date: Fri, 21 Feb 2025 20:09:20 -0300
Subject: [PATCH] ref: improve responsive

---
 src/components/Avatar/avatar.ts |  4 ++++
 src/pages/home/styles.ts        |  4 ++++
 src/pages/projects/styles.ts    | 10 ++++++++++
 src/pages/skills/styles.ts      |  8 ++++++++
 4 files changed, 26 insertions(+)

diff --git a/src/components/Avatar/avatar.ts b/src/components/Avatar/avatar.ts
index cd9720f..d7d885f 100644
--- a/src/components/Avatar/avatar.ts
+++ b/src/components/Avatar/avatar.ts
@@ -4,6 +4,10 @@ export const Avatar = styled.img`
 border-radius: 50%;
 width: 5rem;
 height: 5rem;
+@media(max-width: 480px){
+    width: 10rem;
+    height: 10rem;
+}
 `
 export const AvatarHeader = styled.img`
 border-radius: 50%;
diff --git a/src/pages/home/styles.ts b/src/pages/home/styles.ts
index be2f958..bb5da4c 100644
--- a/src/pages/home/styles.ts
+++ b/src/pages/home/styles.ts
@@ -26,4 +26,8 @@ gap: 1rem;
 span{
   font-size: 2.3rem;
 }
+@media (max-width: 448px) {
+  display: block;
+  font-size: 1rem;
+}
 `
\ No newline at end of file
diff --git a/src/pages/projects/styles.ts b/src/pages/projects/styles.ts
index f076681..0332a58 100644
--- a/src/pages/projects/styles.ts
+++ b/src/pages/projects/styles.ts
@@ -10,6 +10,9 @@ export const ProjectGrid = styled.div`
   grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
   gap: 2rem;
   width: 100%;
+  @media(max-width: 512px){
+    display: block;
+  }
 `;
 
 export const ProjectCard = styled.a`
@@ -25,11 +28,18 @@ export const ProjectCard = styled.a`
   &:hover {
     transform: translateY(-5px);
   }
+  @media(max-width: 512px){
+    display: block;
+    margin-bottom: 1rem;
+  }
 `;
 
 export const ProjectName = styled.h2`
   font-size: 1.5rem;
   margin-bottom: 0.5rem;
+  @media(max-width: 512px){
+    font-size: 1.3rem;
+  }
 `;
 
 export const ProjectDescription = styled.p`
diff --git a/src/pages/skills/styles.ts b/src/pages/skills/styles.ts
index ef318f6..091d91b 100644
--- a/src/pages/skills/styles.ts
+++ b/src/pages/skills/styles.ts
@@ -2,9 +2,17 @@ import styled from "styled-components";
 
 export const SkillsContainer = styled.div`
 display: flex;
+flex-direction: row;
 margin-top: 1rem;
+align-items: center;
 p {
     margin-left: 0.3rem;
     margin-right: 2.5rem;
 }
+@media(max-width: 1090px){
+    flex-direction: column;
+    p{
+        margin: 0 0 1rem 0;
+    }
+}
 `
\ No newline at end of file