Merge v2.0 into main

luisaramicar11 · Nov 2, 2024 · 4c71ecf · 4c71ecf
1 parent 52d708d
commit 4c71ecf
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 20 deletions.
diff --git a/src/app/user/discover/page.tsx b/src/app/user/discover/page.tsx
@@ -51,7 +51,7 @@ const DivContainer = styled.div`
   height: 100%;
 
   & div {
-    padding: 1rem 0;
+    padding: 0.5rem 0;
 
     & hr {
       padding: 0;
@@ -213,7 +213,7 @@ const Discover = () => {
             <Button type={"button"} label={"Restaurar"} onClick={handleFilterReset}>
               <RiArrowGoBackFill />
             </Button>
-            <Button type={"button"} label={"A-Z"} onClick={handleShowAlphabeticalOrder}>
+            <Button type={"button"} label={"Trabajos"} onClick={handleShowAlphabeticalOrder}>
               <FaArrowDownAZ />
             </Button>
             <Button type={"button"} label={"Top"} onClick={handleShowTopUsers}>

diff --git a/src/components/cards/CardDiscover.tsx b/src/components/cards/CardDiscover.tsx
@@ -17,22 +17,22 @@ interface IDiscoverCardProps {
 const CardContainer = styled.div`
   display: flex;
   width: 100%;
-  height: 19rem;
+  height: 16rem;
   max-width: 500px;
   overflow: hidden;
   gap: 1rem;
 `;
 
 // Estilo para la columna de la imagen
 const ImageColumn = styled.div`
-  width: 55%;
-  min-height: 16rem;
-  max-height: 19rem;
+  min-width: 40%;
+  min-height: 14rem;
+  max-height: 16rem;
 `;
 
 // Estilo para la columna de la información
 const InfoColumn = styled.div`
-  width: 60%;
+  width: 50%;
   height: auto;
   padding: 0;
   padding-left: 1rem;
@@ -44,7 +44,7 @@ const InfoColumn = styled.div`
 
 
 // Estilo para el nombre
-const ImageCard = styled.div<{ urlImage?: string }>`
+const ImageCard = styled.article<{ urlImage?: string }>`
   background-image: url(${(props) => props.urlImage || 'https://i.pinimg.com/736x/0d/64/98/0d64989794b1a4c9d89bff571d3d5842.jpg'});
   background-size: cover;
   background-position: center;
@@ -102,21 +102,23 @@ const Card: React.FC<IDiscoverCardProps> = ({
       </ImageColumn>
       <InfoColumn>
         <Name>{fullName}</Name>
-        <JobTitle>{createdAt ? `${createdAt} · ${jobTitle}` : jobTitle}</JobTitle>
+        <JobTitle>{createdAt ? `${createdAt.slice(0,7)} · ${jobTitle}` : jobTitle}</JobTitle>
         <StarsContainer>
-          {[...Array(5)].map((_, index) => {
-            const rating = Math.floor(qualification); 
-            return (
-              <Star key={index}>
-                {index < rating ? "★" : "☆"}{" "}
-                {/* Muestra estrellas llenas o vacías */}
-              </Star>
-            );
-          })}
+          {qualification !== -1 ?
+            [...Array(5)].map((_, index) => {
+              const rating = Math.floor(qualification);
+              return (
+                <Star key={index}>
+                  {index < rating ? "★" : "☆"}{" "}
+                  {/* Muestra estrellas llenas o vacías */}
+                </Star>
+              );
+            }) :
+            <></>}
         </StarsContainer>
 
         <Skills>
-          <SkillTagTiny skillsArray={abilities} />
+          <SkillTagTiny skillsArray={abilities.slice(0, 3)} />
         </Skills>
       </InfoColumn>
     </CardContainer>

diff --git a/src/components/containers/AllUsersContainer/TopUsers.tsx b/src/components/containers/AllUsersContainer/TopUsers.tsx
@@ -12,6 +12,14 @@ const CardListContainer = styled.div`
   flex-direction: column;
   width: 100%;
   margin: 0 auto;
+
+  & article {
+    height: 6rem;
+  }
+
+  & div{
+    height: 8rem;
+  }
 `;
 
 // Estilos para los botones de paginación
@@ -75,7 +83,7 @@ const TopUsers: React.FC<ITopUsersCardsProps> = ({ users }) => {
                 id={user.id}
                 fullName={user.name}
                 jobTitle={user.category}
-                qualification={0}
+                qualification={-1}
                 abilities={[]}
                 urlImage={user.urlImage}
                 createdAt={user.createdAt}