feat: improve text lisiiblity, line height and fix box-shadow unconst…

…ancy
BaptisteLacroix · Sep 25, 2024 · 41f390e · 41f390e
1 parent 9649184
commit 41f390e
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 5 deletions.
diff --git a/src/index.css b/src/index.css
@@ -2,6 +2,13 @@
 @tailwind components;
 @tailwind utilities;
 
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+    line-height: 1.5;
+}
+
 
 html {
     background-image: url('/public/home-shape.svg');
@@ -20,4 +27,4 @@ html {
     50% {
         opacity: 0;
     }
-}
+}
diff --git a/src/modules/FormationComponent.tsx b/src/modules/FormationComponent.tsx
@@ -6,7 +6,7 @@ import {DownloadCVComponent} from "./DownloadCVComponent.tsx";
 
 export const FormationComponent: React.FC = () => {
     return (
-        <div className="flex flex-col lg:flex-row justify-center items-start lg:items-center p-6 sm:items-center">
+        <div className="min-h-[100vh] flex flex-col lg:flex-row justify-center items-start lg:items-center p-6 sm:items-center">
             <div className="w-1/4"></div>
             <div className="w-full sm:w-3/4 lg:w-2/3 p-4 dark:bg-transparent">
                 <Card className="w-full lg dark:border-1 dark:border-amber-50 rounded-lg ml-0 sm:m-4 p-4">

diff --git a/src/modules/Home.tsx b/src/modules/Home.tsx
@@ -128,7 +128,7 @@ export const Home = () => {
                                         </CardBody>
                                     </Card>
 
-                                    <Card className="w-full shadow-none dark:border-amber-50 dark:border-1 mt-2 sm:m-2">
+                                    <Card className="w-full shadow-md dark:border-amber-50 dark:border-1 mt-2 sm:m-2">
                                         <CardHeader>
                                             <h1 className="font-semibold text-3xl">
                                                 <TypingAnimation/>

diff --git a/src/modules/PortfolioComponent.tsx b/src/modules/PortfolioComponent.tsx
@@ -19,7 +19,7 @@ import {useInView} from "react-intersection-observer";
 
 export const PortfolioComponent = () => {
     return (
-        <div className="container mx-auto p-8 min-h-[90vh] text-center">
+        <div className="container mx-auto p-8 min-h-[100vh] text-center">
             <div className="flex flex-col items-center my-12">
                 <h2 className="text-3xl font-semibold text-gray-900 mb-4 dark:text-blue-400">Personal and Educational
                     Projects</h2>

diff --git a/src/modules/SkillsSection.tsx b/src/modules/SkillsSection.tsx
@@ -64,7 +64,7 @@ const SkillsSection: React.FC = () => {
     };
 
     return (
-        <div className="min-h-[90vh]">
+        <div className="min-h-[100vh] flex items-center justify-center">
             <div className="flex flex-col items-center my-12">
                 <h2 className="text-3xl font-semibold text-gray-900 mb-4 dark:text-blue-400">Stacks and languages</h2>
                 <p className="text-gray-600 mb-8 text-center max-w-lg dark:text-white">