Agregar solucion para errores en UI

PyConColombia · May 19, 2024 · ed9a450 · ed9a450
1 parent 0715ea4
commit ed9a450
Show file tree

Hide file tree

Showing 12 changed files with 103 additions and 341 deletions.
diff --git a/public/images/speaker/ana-lopez.jpg b/public/images/speaker/ana-lopez.jpg
diff --git a/public/images/speaker/carlos-castaneda.jpeg b/public/images/speaker/carlos-castaneda.jpeg
diff --git a/public/images/speaker/elizabeth-fuentes.jpeg b/public/images/speaker/elizabeth-fuentes.jpeg
diff --git a/public/images/speaker/felipe-granda.jpeg b/public/images/speaker/felipe-granda.jpeg
diff --git a/public/images/speaker/jose-alcocer.jpeg b/public/images/speaker/jose-alcocer.jpeg
diff --git a/public/images/speaker/luis-mahecha.jpeg b/public/images/speaker/luis-mahecha.jpeg
diff --git a/public/images/speaker/mauricio-repetto.jpg b/public/images/speaker/mauricio-repetto.jpg
diff --git a/src/app/[lang]/talks/components/Card.js b/src/app/[lang]/talks/components/Card.js
@@ -36,7 +36,7 @@ const Card = ({ talkData, index, lang, langMapping }) => {
 
           return (
             <Link
-              key={`${talkData.id}-${speaker.id}`}
+              key={`${talkData.id}-${speakerData.id}`}
               href={`/${lang}/${speakerData.type}s/${speakerData.id}`}>
               <Image
                 className={`img-keynote img-speaker-talk ${colorBorderSpeaker[(index + 1) % colorBorderSpeaker.length]}`}

diff --git a/src/app/[lang]/talks/components/Talks.js b/src/app/[lang]/talks/components/Talks.js
@@ -28,7 +28,7 @@ const Talks = ({ lang, talksList, defaultTag, allTags }) => {
   return (
     <section id="keynotes">
       <div className="keynotes-bg">
-        <Title content={i18nDictionary?.sections?.talks} />
+        <Title content={i18nDictionary?.sections?.talks} counter={talks.length} />
         <Container>
           <Row className="justify-content-center">
             <Col xs={12} md={4}>

diff --git a/src/app/[lang]/talks/components/Title.js b/src/app/[lang]/talks/components/Title.js
@@ -4,7 +4,7 @@ import Container from 'react-bootstrap/Container';
 import Row from 'react-bootstrap/Row';
 import Col from 'react-bootstrap/Col';
 
-const Title = ({ content }) => {
+const Title = ({ content, counter }) => {
   return (
     <div className="welcome">
       <div className="welcome-bg">
@@ -13,7 +13,9 @@ const Title = ({ content }) => {
             <Col xs={10} md={6}>
               <div className="title-container">
                 <h2 className="title">
-                  <span className="bold">{content?.title}</span>
+                  <span className="bold">
+                    {content?.title} ({counter})
+                  </span>
                 </h2>
               </div>
             </Col>

diff --git a/src/data/talks.json b/src/data/talks.json
diff --git a/src/styles/partials/_talk.sass b/src/styles/partials/_talk.sass
@@ -35,13 +35,25 @@
         &.business-analytics
             background-image: linear-gradient(to bottom right, #7986cb, #3949ab, #1a237e)
             color: variables.$white
+        &.computer-vision
+            background-image: linear-gradient(to bottom right, #e1bee7, #ce93d8, #ba68c8)
+            color: variables.$third-text-color
+        &.devops
+            background-image: linear-gradient(to bottom right, #e0f7fa, #b2ebf2, #80deea)
+            color: variables.$third-text-color
+        &.iot
+            background-image: linear-gradient(to bottom right, #eeeeff, #e0e0ff, #d0d0ff)
+            color: variables.$third-text-color
+        &.web
+            background-image: linear-gradient(to bottom right, #f9fbe7, #dce775, #cddc39)
+            color: variables.$third-text-color
 
     .img-speaker-talk
         max-width: 80px
         max-height: 80px
         width: auto
         height: auto
-        margin: 10px 0
+        margin: 10px 2px 10px 2px
 
     .border-pink
         border: 10px solid variables.$border-pink