Fix sizes and gap in staff page

mtocommunity · Sep 23, 2024 · e6eeede · e6eeede
1 parent 7ced24b
commit e6eeede
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 7 deletions.
diff --git a/src/components/general/molecule/social/index.tsx b/src/components/general/molecule/social/index.tsx
@@ -6,6 +6,7 @@ import {
   faTwitch,
   faTiktok,
   faXTwitter,
+  faGithub,
 } from "@fortawesome/free-brands-svg-icons";
 
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@@ -51,6 +52,13 @@ function Social() {
       <a href="https://x.com/mtocommunity" className="icon" target="_blank">
         <FontAwesomeIcon icon={faXTwitter} />
       </a>
+      <a
+        href="https://github.com/mtocommunity"
+        className="icon"
+        target="_blank"
+      >
+        <FontAwesomeIcon icon={faGithub} />
+      </a>
     </div>
   );
 }

diff --git a/src/components/landing/organism/aboutus/index.astro b/src/components/landing/organism/aboutus/index.astro
@@ -9,15 +9,15 @@ import { faUsers } from "@fortawesome/free-solid-svg-icons";
   id="about-us"
 >
   <div
-    class="flex flex-col h-max gap-14 lg:justify-center lg:flex-row-reverse xl:pt-32 2xl:pt-64 lg:gap-48"
+    class="flex flex-col h-max gap-14 lg:justify-center lg:p-16 lg:flex-row-reverse xl:pt-32 2xl:pt-64 lg:gap-48"
   >
     <div class="mt-10 text-white mx-auto z-50 lg:mx-0 lg:w-1/2 2xl:w-1/3">
       <h2
         class="font-bold text-5xl text-center lg:text-right lg:text-6xl 2xl:text-7xl"
       >
         About Us
       </h2>
-      <h3 class="mt-4 ext-center text-base lg:text-xl 2xl:text-2xl lg:text-right">
+      <h3 class="mt-4 text-center text-base lg:text-xl 2xl:text-2xl lg:text-right">
         ¿Por qué <span class="font-bold">Many To One</span>?
       </h3>
       <p
@@ -36,7 +36,7 @@ import { faUsers } from "@fortawesome/free-solid-svg-icons";
         <FontAwesomeIcon icon={faUsers} />
       </div>
       <div class="flex flex-col text-white items-center">
-        <span class="font-main_sans lg:text-3xl 2xl:text-4xl font-bold"
+        <span class="font-main_sans lg:text-2xl 2xl:text-4xl font-bold"
           >{"< Many To One />"}</span
         >
         <span class="lg:text-lg 2xl:text-2xl">Community</span>

diff --git a/src/components/landing/organism/home/index.astro b/src/components/landing/organism/home/index.astro
@@ -42,7 +42,7 @@ import { faDiscord } from "@fortawesome/free-brands-svg-icons";
   </div>
   <div class="hidden lg:flex justify-between">
     <!-- Social / discord -->
-    <dir class="w-[40%] text-white pl-60 text-3xl 2xl:w-[30%]">
+    <dir class="w-1/2 text-white pl-60 text-3xl xl:w-2/5">
       <Social />
     </dir>
     <a

diff --git a/src/pages/staff/index.astro b/src/pages/staff/index.astro
@@ -25,7 +25,7 @@ import Layout from "../../layouts/landing/index.astro";
           Líderes de la Comunidad
         </p>
         <div
-          class="flex flex-wrap justify-center gap-8 px-8 justify-items-center lg:gap-16 mb-10"
+          class="flex flex-wrap justify-center gap-8 px-8 justify-items-center lg:gap-x-16 mb-10"
         >
           <LeaderCard
             photo="https://cdn.mtocommunity.com/staff-jorge-contreras-delgado.jpg"
@@ -54,7 +54,7 @@ import Layout from "../../layouts/landing/index.astro";
           Líderes de Equipos
         </p>
         <div
-          class="lg:py-6 flex flex-wrap gap-16 px-8 justify-items-center justify-center lg:gap-32 xl:gap-48"
+          class="lg:py-6 flex flex-wrap gap-y-8 gap-x-16 px-8 justify-items-center justify-center lg:gap-x-16 xl:gap-x-32"
         >
           <LeaderCard
             photo="https://cdn.mtocommunity.com/staff-juan-romero.jpg"
@@ -113,7 +113,7 @@ import Layout from "../../layouts/landing/index.astro";
           Social Media Team
         </p>
         <div
-          class="lg:py-6 flex flex-wrap gap-16 px-8 justify-items-center justify-center lg:gap-32 xl:gap-48"
+          class="lg:py-6 flex flex-wrap gap-y-8 gap-x-16 px-8 justify-items-center justify-center lg:gap-x-32 xl:gap-x-32"
         >
           <LeaderCard
             photo="https://cdn.mtocommunity.com/staff-matamitas.jpg"