From 1264d136bed35d2cba937d7801fcc98320410567 Mon Sep 17 00:00:00 2001
From: RodrigoEC <rodrigo.cavalcanti@ccc.ufcg.edu.br>
Date: Tue, 10 Sep 2024 09:24:38 -0300
Subject: [PATCH] Update sizes on home page

---
 components/Home/Testimonials.tsx     |  4 ++--
 islands/Home/Header.tsx              | 22 +++++++++++-----------
 islands/NRF/ShowcaseEditorTabbed.tsx |  4 ++--
 sections/Home/Results.tsx            |  6 +++---
 4 files changed, 18 insertions(+), 18 deletions(-)

diff --git a/components/Home/Testimonials.tsx b/components/Home/Testimonials.tsx
index 8a012a84..4ee46e24 100644
--- a/components/Home/Testimonials.tsx
+++ b/components/Home/Testimonials.tsx
@@ -143,7 +143,7 @@ export default function Testimonials({
       <div class="flex flex-col items-center gap-4">
         {title && (
           <h2
-            class="font-albert-sans text-3xl lg:text-4xl font-medium text-white text-center"
+            class="font-albert-sans text-3xl lg:text-5xl font-medium text-white text-center"
             dangerouslySetInnerHTML={{
               __html: title,
             }}
@@ -152,7 +152,7 @@ export default function Testimonials({
         )}
 
         {subtitle && (
-          <p class="font-albert-sans text-xl font-medium text-white text-center opacity-70">
+          <p class="font-albert-sans text-lg md:text-xl lg:text-2xl font-medium text-white text-center opacity-70">
             {subtitle}
           </p>
         )}
diff --git a/islands/Home/Header.tsx b/islands/Home/Header.tsx
index cf7f02a2..e30f3497 100644
--- a/islands/Home/Header.tsx
+++ b/islands/Home/Header.tsx
@@ -56,7 +56,7 @@ function MobileMenuDropdown({ icon, nested, title }: ColumnMenu) {
           />
           <div class="pb-[24px] flex items-center gap-2 text-white cursor-pointer hover:text-[#02F67C] transition duration-200 ease-in-out">
             <Icon id={icon} size={25} />
-            <p class="font-bold text-[16px]">{title}</p>
+            <p class="font-bold text-[13px]">{title}</p>
             <Icon
               id={"ChevronDown"}
               width={15}
@@ -71,7 +71,7 @@ function MobileMenuDropdown({ icon, nested, title }: ColumnMenu) {
                 <a
                   href={item.href}
                   target={item?.targetBlank ? "_blank" : "_self"}
-                  class="block px-[24px]  font-normal text-[16px] leading-[19.36px] text-white hover:text-[#02F67C] transition duration-200 ease-in-out"
+                  class="block px-[24px]  font-normal text-[13px] leading-[19.36px] text-white hover:text-[#02F67C] transition duration-200 ease-in-out"
                 >
                   {item.label}
                 </a>
@@ -99,7 +99,7 @@ function MobileMenuLink({ href, label, targetBlank, columns }: MenuLink) {
                   <a
                     href={item.href}
                     target={item?.targetBlank ? "_blank" : "_self"}
-                    class="block pr-[24px]  font-normal text-[16px] leading-[19.36px] text-white hover:text-[#02F67C] transition duration-200 ease-in-out"
+                    class="block pr-[24px]  font-normal text-[13px] leading-[19.36px] text-white hover:text-[#02F67C] transition duration-200 ease-in-out"
                   >
                     {item.label}
                   </a>
@@ -117,7 +117,7 @@ function MobileMenuLink({ href, label, targetBlank, columns }: MenuLink) {
       <a
         href={href}
         target={targetBlank ? "_blank" : "_self"}
-        class="block pr-[24px]  font-normal text-[16px] leading-[19.36px] text-white"
+        class="block pr-[24px]  font-normal text-[13px] leading-[19.36px] text-white"
       >
         {label}
       </a>
@@ -145,7 +145,7 @@ function MenuLink({ href, label, targetBlank, columns, ...props }: MenuLink) {
       <a
         target={targetBlank ? "_blank" : "_self"}
         href={href}
-        class="flex items-center h-full self-center font-normal text-[16px] bg-clip-text bg-linear-white-green bg-position-100 justify-center"
+        class="flex items-center h-full self-center font-normal text-[13px] bg-clip-text bg-linear-white-green bg-position-100 justify-center"
         style="background-size: 200%;"
       >
         {label}
@@ -247,7 +247,7 @@ export default function Header({ menuLinks, ...props }: Props) {
             <a
               id="bt-click-signup"
               href={props.demo?.url}
-              class="flex items-center hover:shadow-[0_0_40px_0_rgba(2,246,124,0.3)] md:w-auto transition-all duration-300 ease-out border-[#02F67C] border-2 text-base text-[#0A2121] bg-[#02F67C] md:hover:bg-[#2FD180] font-medium text-[16px] max-h-[37px] px-4 py-2 rounded-lg md:transition md:ease-in-out md:duration-300"
+              class="flex items-center hover:shadow-[0_0_40px_0_rgba(2,246,124,0.3)] md:w-auto transition-all duration-300 ease-out border-[#02F67C] border-2 text-base text-[#0A2121] bg-[#02F67C] md:hover:bg-[#2FD180] font-medium text-[13px] max-h-[37px] px-4 py-2 rounded-lg md:transition md:ease-in-out md:duration-300"
             >
               {props.demo?.label}
             </a>
@@ -314,7 +314,7 @@ export default function Header({ menuLinks, ...props }: Props) {
                     <a
                       href={props.sign.url}
                       id="bt-click-signup"
-                      class="flex items-center text-[#b6b6b6] md:hover:text-[#fff] font-medium text-[16px] px-4 py-2 transition ease-in-out duration-300"
+                      class="flex items-center text-[#b6b6b6] md:hover:text-[#fff] font-medium text-[13px] px-4 py-2 transition ease-in-out duration-300"
                     >
                       {props.sign.label}
                     </a>
@@ -323,7 +323,7 @@ export default function Header({ menuLinks, ...props }: Props) {
                     <a
                       target={"_blank"}
                       href={props.gitUrl}
-                      class="flex items-center gap-2 opacity-80 text-white hover:text-[#02F67C] text-[16px] transition ease-in duration-200 justify-center"
+                      class="flex items-center gap-2 opacity-80 text-white hover:text-[#02F67C] text-[13px] transition ease-in duration-200 justify-center"
                       style="background-size: 200%;"
                     >
                       <svg
@@ -354,7 +354,7 @@ export default function Header({ menuLinks, ...props }: Props) {
             /* <li>
             <a
               href={props.login.url}
-              class="flex gap-2 items-center text-[#02F67C] bg-[#113032] md:hover:text-[#fff] border-[#113032] border hover:bg-transparent font-medium text-[16px] max-h-[37px] px-4 py-2 rounded-full md:transition md:ease-in-out md:duration-300"
+              class="flex gap-2 items-center text-[#02F67C] bg-[#113032] md:hover:text-[#fff] border-[#113032] border hover:bg-transparent font-medium text-[13px] max-h-[37px] px-4 py-2 rounded-full md:transition md:ease-in-out md:duration-300"
             >
               {props.login.label}
               <svg
@@ -382,7 +382,7 @@ export default function Header({ menuLinks, ...props }: Props) {
             <a
               href={props.sign.url}
               id="bt-click-signup"
-              class="flex items-center text-[#b6b6b6] md:hover:text-[#fff] font-medium text-[16px] px-4 py-2 transition ease-in-out duration-300"
+              class="flex items-center text-[#b6b6b6] md:hover:text-[#fff] font-medium text-[13px] px-4 py-2 transition ease-in-out duration-300"
             >
               {props.sign.label}
             </a>
@@ -391,7 +391,7 @@ export default function Header({ menuLinks, ...props }: Props) {
             <a
               href={props.demo?.url}
               id="bt-click-signup"
-              class="flex items-center hover:shadow-[0_0_40px_0_rgba(2,246,124,0.3)] md:w-auto transition-all duration-300 ease-out border-[#02F67C] border-2 text-base text-[#0A2121] bg-[#02F67C] md:hover:bg-[#2FD180] font-medium text-[16px] max-h-[37px] px-4 py-2 rounded-lg md:transition md:ease-in-out md:duration-300"
+              class="flex items-center hover:shadow-[0_0_40px_0_rgba(2,246,124,0.3)] md:w-auto transition-all duration-300 ease-out border-[#02F67C] border-2 text-base text-[#0A2121] bg-[#02F67C] md:hover:bg-[#2FD180] font-medium text-[13px] max-h-[37px] px-4 py-2 rounded-lg md:transition md:ease-in-out md:duration-300"
             >
               {props.demo?.label}
             </a>
diff --git a/islands/NRF/ShowcaseEditorTabbed.tsx b/islands/NRF/ShowcaseEditorTabbed.tsx
index 06999506..04ec3e1e 100644
--- a/islands/NRF/ShowcaseEditorTabbed.tsx
+++ b/islands/NRF/ShowcaseEditorTabbed.tsx
@@ -195,7 +195,7 @@ export const ShowcaseEditorTabbed = ({
             tabs.map((tab, index) => (
               <div
                 key={index}
-                class={`flex justify-center items-center w-[1000px] ${
+                class={`flex justify-center items-center w-[900px] ${
                   index !== selectedTab.value ? "hidden" : ""
                 }`}
               >
@@ -205,7 +205,7 @@ export const ShowcaseEditorTabbed = ({
                   width={600}
                   height={400}
                   preload={index === 0 ? true : false}
-                  class="w-[1000px]"
+                  class="w-[900px]"
                 />
               </div>
             ))}
diff --git a/sections/Home/Results.tsx b/sections/Home/Results.tsx
index cdf4b0fe..6c2e8b02 100644
--- a/sections/Home/Results.tsx
+++ b/sections/Home/Results.tsx
@@ -46,7 +46,7 @@ export default function Results({
   ],
 }: Props) {
   return (
-    <div class="lg:mx-auto lg:max-w-[1440px] relative z-10 p-6 md:p-10 flex flex-col gap-12 justify-center items-center bg-[#070D0D] border-[#0B1612] rounded-lg">
+    <div class="lg:mx-auto lg:max-w-[1440px] relative z-10 p-6 md:p-10 flex flex-col gap-16 lg:gap-20 justify-center items-center bg-[#070D0D] border-[#0B1612] rounded-lg">
       {title &&
         (
           <h2
@@ -61,7 +61,7 @@ export default function Results({
         {results.map((result) => (
           <div class="flex flex-col gap-4 flex-1 mb-4 lg:mb-0">
             <h3
-              class="font-albert-sans text-[80px] text-left font-medium text-white leading-none"
+              class="font-albert-sans text-[72px] text-left font-medium text-white leading-none"
               dangerouslySetInnerHTML={{
                 __html: result.title,
               }}
@@ -69,7 +69,7 @@ export default function Results({
             </h3>
             <hr class="border-[#C9CFCF]" />
             <div
-              class="font-albert-sans text-sm lg:text-base text-left text-white"
+              class="font-albert-sans text-[20px] text-left text-white"
               dangerouslySetInnerHTML={{
                 __html: result.description,
               }}