refactor: Improve code organization and styles

Author: EdwardR0507

src/app/[lang]/about/ga/page.tsx

@@ -47,7 +47,12 @@ export const Header = ({ lang }: { lang: Locale }) => {
   return (
     <header className="relative z-50 top-0 w-full ">
       <div className="w-full h-full flex justify-between items-center p-4">
-        <CustomLink lang={lang} href="/" className="grow-0 text-4xl">
+        <CustomLink
+          lang={lang}
+          href="/"
+          className="grow-0 text-4xl"
+          aria-label="Home page"
+        >
           👋
         </CustomLink>
         <div className="flex grow justify-center gap-6">
@@ -70,7 +75,13 @@ export const Header = ({ lang }: { lang: Locale }) => {
                 {theme === "dark" ? <LightMode /> : <DarkMode />}
               </i>
             </div>
-            <Link href={getNewHref("en")} passHref replace>
+
+            <Link
+              href={getNewHref("en")}
+              passHref
+              replace
+              aria-label="Change language"
+            >
               <i className="cursor-pointer">
                 <WorldIcon />
               </i>

src/components/molecules/header/header.tsx

@@ -74,7 +74,7 @@ export const ProjectCard = ({
                      group-hover:-translate-x-3
                      group-hover:translate-y-3
                      group-hover:-rotate-2
-                     opacity-0 bg-opacity-80 backdrop-blur-sm transition-opacity group-hover:opacity-100"
+                     opacity-0 bg-opacity-80 transition-opacity group-hover:opacity-100"
         >
           <div className="flex gap-4 mt-28 ml-20">
             <ProjectButtons repo={repo} website={website} />

src/components/molecules/project-card.tsx

@@ -36,7 +36,7 @@ export const ExperienceSection = ({ dictionary }: ExperienceSectionProps) => {
                     {position}
                     {isCurrent && (
                       <Badge
-                        text="Latest"
+                        text={dictionary.LATEST}
                         className="text-sm font-medium mr-2 px-2.5 py-0.5 rounded dark:bg-blue-200 dark:text-blue-800 ml-3"
                       />
                     )}
@@ -52,7 +52,7 @@ export const ExperienceSection = ({ dictionary }: ExperienceSectionProps) => {
                     </Link>
                   </h4>
                 </div>
-                <time className="block mb-2 text-sm font-normal leading-none text-white dark:text-white/70">
+                <time className="block mb-2 text-sm font-normal leading-none text-black/70 dark:text-white/70">
                   {startDate} - {endDate}
                 </time>
                 <ul className="pb-4 text-base font-normal text-black-800 dark:text-black-200">

src/components/organisms/experience-section.tsx

@@ -29,7 +29,7 @@ export const PersonalInfoSection = ({
               {dictionary.SOFT_SKILLS.LIST.map((skill) => (
                 <li
                   key={skill}
-                  className="bg-black/[0.7] text-sm tracking-wider text-white rounded-full dark:text-white/70 dark:bg-white/10 flex items-center px-4 py-2"
+                  className="bg-black/10 text-sm tracking-wider text-black/70 rounded-full dark:text-white/70 dark:bg-white/10 flex items-center px-4 py-2"
                 >
                   {skill}
                 </li>

src/components/organisms/personal-info-section.tsx

@@ -37,7 +37,7 @@ export const StackSection = ({ title, skills }: StackSectionProps) => {
       <ul className="grid grid-cols-2 gap-6 sm:grid-cols-3 md:grid-cols-4">
         {skills.map((skill, index) => (
           <motion.li
-            className="bg-black/10 rounded-xl px-5 py-3 dark:bg-white/10 dark:text-white/80"
+            className="bg-black/10 rounded-xl dark:bg-white/10 dark:text-white/80"
             key={index}
             variants={fadeInAnimationVariants}
             initial="initial"

src/components/organisms/stack-section.tsx

@@ -50,7 +50,8 @@
             "Developed mobile applications using the Flutter framework."
           ]
         }
-      }
+      },
+      "LATEST": "Latest"
     }
   },
   "STACK": {

src/lib/lang/en.json

@@ -50,7 +50,8 @@
             "Desarrollé aplicaciones móviles utilizando el framework de Flutter."
           ]
         }
-      }
+      },
+      "LATEST": "Reciente"
     }
   },