feat: add intro section in home

LaercioSR · Aug 27, 2024 · a60f881 · a60f881
1 parent 1950216
commit a60f881
Show file tree

Hide file tree

Showing 11 changed files with 146 additions and 218 deletions.
diff --git a/src/app/assets/icons/mail-logo.svg → src/app/assets/icons/email-logo.svg b/src/app/assets/icons/mail-logo.svg → src/app/assets/icons/email-logo.svg
diff --git a/src/app/assets/logo.svg b/src/app/assets/logo.svg
diff --git a/src/app/components/ButtonCustom/styles.module.css b/src/app/components/ButtonCustom/styles.module.css
@@ -27,6 +27,7 @@
 
 .global-button svg > path {
   fill: var(--primary);
+  transition: all 0.3s ease-in-out;
 }
 
 .global-button:hover svg > path {

diff --git a/src/app/components/BuyMeACoffee/styles.module.css b/src/app/components/BuyMeACoffee/styles.module.css
@@ -3,7 +3,8 @@
   justify-content: center;
   align-items: center;
   gap: 0.25rem;
-  transition: color 0.2s ease-in-out;
+  transition: all 0.3s ease-in-out;
+  width: 100%;
 }
 
 .buy_me_a_coffee-wrapper:hover {
@@ -26,5 +27,5 @@
 
 .buy_me_a_coffee-wrapper svg path {
   fill: var(--primary);
-  transition: fill 0.2s ease-in-out;
+  transition: all 0.3s ease-in-out;
 }
diff --git a/src/app/components/Header/styles.module.css b/src/app/components/Header/styles.module.css
@@ -3,6 +3,7 @@
   justify-content: center;
   align-items: center;
   width: 100%;
+  background-color: var(--home);
 }
 
 .nav-wrapper {
@@ -23,7 +24,6 @@
   display: flex;
   justify-content: flex-start;
   align-items: center;
-  width: 100%;
   gap: 1rem;
 }
 

diff --git a/src/app/components/Typography/styles.module.css b/src/app/components/Typography/styles.module.css
@@ -1,53 +1,89 @@
 .headline1 {
-  font-size: 3rem;
+  font-size: 2.5rem;
   font-weight: 700;
   line-height: 120%;
+
+  @media (min-width: 768px) {
+    font-size: 3rem;
+  }
 }
 
 .headline2 {
-  font-size: 2.5rem;
+  font-size: 2rem;
   font-weight: 700;
   line-height: 120%;
+
+  @media (min-width: 768px) {
+    font-size: 2.5rem;
+  }
 }
 
 .headline3 {
-  font-size: 2rem;
+  font-size: 1.75rem;
   font-weight: 700;
   line-height: 120%;
+
+  @media (min-width: 768px) {
+    font-size: 2rem;
+  }
 }
 
 .headline4 {
-  font-size: 1.5rem;
+  font-size: 1.25rem;
   font-weight: 700;
   line-height: 120%;
+
+  @media (min-width: 768px) {
+    font-size: 1.5rem;
+  }
 }
 
 .body1 {
-  font-size: 1rem;
+  font-size: 0.875rem;
   font-weight: 700;
   line-height: 120%;
+
+  @media (min-width: 768px) {
+    font-size: 1rem;
+  }
 }
 
 .body2 {
-  font-size: 1rem;
+  font-size: 0.875rem;
   font-weight: 400;
   line-height: 120%;
+
+  @media (min-width: 768px) {
+    font-size: 1rem;
+  }
 }
 
 .body3 {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
   font-weight: 400;
   line-height: 120%;
+
+  @media (min-width: 768px) {
+    font-size: 0.875rem;
+  }
 }
 
 .caption1 {
-  font-size: 0.75rem;
+  font-size: 0.5rem;
   font-weight: 700;
   line-height: 120%;
+
+  @media (min-width: 768px) {
+    font-size: 0.75rem;
+  }
 }
 
 .caption2 {
-  font-size: 0.75rem;
+  font-size: 0.5rem;
   font-weight: 400;
   line-height: 120%;
+
+  @media (min-width: 768px) {
+    font-size: 0.75rem;
+  }
 }
diff --git a/src/app/i18n/locales/en.json b/src/app/i18n/locales/en.json
@@ -7,6 +7,9 @@
       "label": "Portuguese"
     }
   },
+  "profile": {
+    "role": "Software Engineer"
+  },
   "components": {
     "buyMeACoffee": {
       "label": "Buy me a coffee"

diff --git a/src/app/i18n/locales/pt.json b/src/app/i18n/locales/pt.json
@@ -7,6 +7,9 @@
       "label": "Português"
     }
   },
+  "profile": {
+    "role": "Desenvolvedor de Software"
+  },
   "components": {
     "buyMeACoffee": {
       "label": "Buy me a coffee"