From 06043708ba5b6865390c74eb9f34b1abbd29d385 Mon Sep 17 00:00:00 2001
From: Leticia Dias <contatoleticiadia@gmail.com>
Date: Thu, 10 Jul 2025 11:06:01 -0300
Subject: [PATCH] fix: fixed layout issues for responsiveness on other pages

---
 src/components/posts/post/Post.tsx | 2 +-
 src/pages/About.tsx                | 8 ++++----
 src/pages/Knowledgers.tsx          | 4 ++--
 src/pages/Posts.tsx                | 2 +-
 src/pages/TechLab.tsx              | 4 ++--
 5 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/src/components/posts/post/Post.tsx b/src/components/posts/post/Post.tsx
index 8818351..d56f0f1 100644
--- a/src/components/posts/post/Post.tsx
+++ b/src/components/posts/post/Post.tsx
@@ -42,7 +42,7 @@ export function Post() {
   }
 
   return (
-    <div className="px-4 sm:px-6 lg:px-8 mt-12">
+    <div className="px-4 sm:px-6 lg:px-8 mt-12 w-full md:w-[46rem] lg:w-[62rem]">
       <div className="flex items-center">
         <div className="h-6 w-1 dark:bg-blue-300 bg-blue-500 mr-4"></div>
         <p className="font-bold text-sm sm:text-base dark:text-white text-[#62748E]">
diff --git a/src/pages/About.tsx b/src/pages/About.tsx
index f2fd884..00be242 100644
--- a/src/pages/About.tsx
+++ b/src/pages/About.tsx
@@ -21,8 +21,8 @@ export function About() {
   const { darkMode } = useContext(ThemeContext);
 
   return (
-    <div className="w-full px-4">
-      <div className="mt-16 flex flex-col items-center w-full">
+    <div className="px-4 screen-custom:w-[20rem] md:w-[47rem] lg:w-[62rem]">
+      <div className="mt-16 flex flex-col items-center">
         <h1 className="text-2xl font-bold text-center sm:text-3xl dark:text-white text-black">
           Sobre
         </h1>
@@ -45,13 +45,13 @@ export function About() {
           <img
             src={ImageLogoTechKnowledge}
             alt="Logo TechKnowledge"
-            className="ml-[-8px] w-40 sm:w-48 object-cover"
+            className="sm:w-48 object-cover"
           />
         ) : (
           <img
             src={ImageLogoTechknowledgeLight}
             alt="Logo TechKnowledge"
-            className="ml-[-8px] w-40 sm:w-48 object-cover"
+            className="sm:w-48 object-cover"
           />
         )}
 
diff --git a/src/pages/Knowledgers.tsx b/src/pages/Knowledgers.tsx
index fccfcc7..7e52e42 100644
--- a/src/pages/Knowledgers.tsx
+++ b/src/pages/Knowledgers.tsx
@@ -9,8 +9,8 @@ export function Knowledgers() {
   const { darkMode } = useContext(ThemeContext);
 
   return (
-    <div className="w-full flex flex-col items-center justify-center h-screen">
-      <div className="flex items-center justify-center lg:justify-start w-full">
+    <div className="flex flex-col items-center justify-center h-screen lg:w-[60rem] px-4">
+      <div className="flex items-center justify-center lg:justify-start w-full mt-10 md:mt-0">
         <p className="bg-[#93C5FD] w-[16rem] h-[2.5rem] rounded-full mb-8 flex items-center justify-center text-black font-bold text-lg">
           #Em Breve 2025
         </p>
diff --git a/src/pages/Posts.tsx b/src/pages/Posts.tsx
index a48678f..967309c 100644
--- a/src/pages/Posts.tsx
+++ b/src/pages/Posts.tsx
@@ -3,7 +3,7 @@ import { PostList } from "../components/posts/postlist/PostList";
 
 export function Posts() {
   return (
-    <div className="mt-16 flex flex-col items-center">
+    <div className="mt-16 flex flex-col items-center md:w-[44rem] lg:w-[60rem]">
       <h1 className="text-3xl font-bold dark:text-white text-black">Posts</h1>
       <p className="mt-4 w-[20rem] md:w-[38rem] text-center dark:text-white text-[#62748E]">
         Aqui você pode conferir nossos conteúdos sobre desenvolvimento web,
diff --git a/src/pages/TechLab.tsx b/src/pages/TechLab.tsx
index a49066f..b8e97da 100644
--- a/src/pages/TechLab.tsx
+++ b/src/pages/TechLab.tsx
@@ -9,8 +9,8 @@ export function TechLab() {
   const { darkMode } = useContext(ThemeContext);
 
   return (
-    <div className="w-full flex flex-col items-center justify-center h-screen">
-      <div className="flex items-center justify-center lg:justify-start w-full">
+    <div className="flex flex-col items-center justify-center h-screen lg:w-[60rem] px-4">
+      <div className="flex items-center justify-center lg:justify-start w-full mt-10 md:mt-0">
         <p className="bg-[#93C5FD] w-[16rem] h-[2.5rem] rounded-full mb-8 flex items-center justify-center text-black font-bold text-lg">
           #Em Breve 2025
         </p>