Merge branch 'issue-304/correction-on-the-about-page' into 'develop'

Issue #304: FIX Correction of the slides on the about page

See merge request !284

src/app/components/About.js

@@ -354,7 +354,7 @@ export default function AboutComponent() {
     return (
       <a href={link} className="block">
         <div className="flex mt-2 flex-row items-center w-full">
-          <div className="relative border border-white w-[calc(20vw+8px)] max-xl:w-[248px] h-[550px] max-xl:h-[420px] max-md:h-[332px] overflow-hidden rounded-lg ">
+          <div className="relative border border-white 2xl:w-[calc(20vw+8px)] max-xl:w-[248px] xl:w-[calc(18vw+23px)] h-[32vw] max-xl:h-[420px] max-md:h-[332px] overflow-hidden rounded-lg ">
             <Image
               className="object-cover object-[60%_75%]"
               alt={name}
@@ -362,7 +362,7 @@ export default function AboutComponent() {
               fill
             />
             <div className="absolute bottom-0 left-0 w-full h-1/3 bg-gradient-to-t from-black to-transparent">
-              <span className="absolute bottom-0 left-0 w-full bg-transparent bg-opacity-60 font-bold text-white text-xl max-lg:text-base pl-4 pb-8 max-md:pb-6">
+              <span className="absolute bottom-0 left-0 w-full bg-transparent bg-opacity-60 font-bold text-white text-xl max-xl:text-base pl-4 pb-8 max-md:pb-6">
                 {description}
               </span>
             </div>
@@ -429,12 +429,7 @@ export default function AboutComponent() {
         <div className="flex col-span-2">
           <div className="flex flex-col px-3 w-full">
             <Slides />
-            <div className="flex flex-col w-full text-center items-center rounded-lg bg-white-HC-dark outline outline-1 outline-ice-HC-white ">
-              <div>
-                <Title />
-              </div>
-            </div>
-            <div className="flex flex-col mt-12 text-center items-center rounded-lg bg-white-HC-dark outline outline-1 outline-ice-HC-white ">              
+            <div className="flex flex-col text-center items-center rounded-lg bg-white-HC-dark outline outline-1 outline-ice-HC-white ">              
               <MecredStats />              
             </div>
             <div className="flex flex-col text-center items-center mt-12 rounded-lg bg-white-HC-dark max-sm:hidden outline outline-1 outline-ice-HC-white">

src/app/components/Title.js

@@ -4,8 +4,8 @@ export default function Title() {
       <h1 className="text-3xl max-lg:text-xl font-bold text-darkGray-HC-white my-10 text-center">
         MEC RED - A Rede Social da Educação
       </h1>
-      <h1 className="text-xl lg:px-44 max-lg:text-base text-darkGray-HC-white text-balance mb-5 justify-center text-center">
-        Aqui você pode se conectar com pessoas interessadas na área da educação,
+      <h1 className="text-xl max-lg:text-base text-darkGray-HC-white  mb-5 justify-center text-center max-w-4xl mx-auto">
+        Aqui você pode se conectar com pessoas interessadas na área da educação,<br/>
         acessar e compartilhar recursos Educacionais Digitais (REDs)!
       </h1>
     </div>

src/app/components/needLoginModal.js

@@ -19,7 +19,7 @@ export default function NeedLoginModal({ open, setOpen }) {
         }}
       >
         <div>
-          <div className="flex flex-col rounded-lg bg-white-HC-dark  p-3">
+          <div className="flex flex-col rounded-lg bg-white-HC-dark  p-3 outline outline-1 outline-ice-HC-white">
             <div className="text-xl text-darkGray-HC-white font-bold ">Entrar</div>
             <div className="p-3">
               <div className="text-base text-darkGray-HC-white">
@@ -28,7 +28,7 @@ export default function NeedLoginModal({ open, setOpen }) {
               <div className="flex flex-wrap justify-center gap-1 items-stretch">
                 <Button
                   variant="contained"
-                  className="bg-turquoise-HC-white hover:bg-darkTurquoise-HC-dark disabled:bg-red mt-3 text-white-HC-dark-underline hover:text-turquoise-HC-white shadow-none rounded normal-case text-base font-bold flex-shrink-0 flex-grow outline outline-1 outline-ice-HC-white"
+                  className="bg-turquoise-HC-white hover:bg-darkTurquoise-HC-dark disabled:bg-red-HC-white mt-3 text-white-HC-dark-underline hover:text-white-HC-underline shadow-none rounded normal-case text-base font-bold flex-shrink-0 flex-grow outline outline-1 outline-ice-HC-white"
                   onClick={loginBarrier}
                 >
                   Ir para página de Login