Estimated Time

src/components/cardknowledger/mockKnowledgers.ts

@@ -15,9 +15,9 @@ export const mockKnowledgers = [
     image: knowledgerMonique,
     flag: "alagoas",
     social: [
-      { icon: GithubLogo, url: "https://github.com/leticiadia" },
-      { icon: InstagramLogo, url: "https://www.instagram.com/leohdas/" },
-      { icon: LinkedinLogo, url: "https://www.linkedin.com/in/leohas/" },
+      { icon: GithubLogo, url: "" },
+      { icon: InstagramLogo, url: "" },
+      { icon: LinkedinLogo, url: "" },
     ],
   },
 
@@ -40,9 +40,9 @@ export const mockKnowledgers = [
     image: knowledgerAlves,
     flag: "para",
     social: [
-      { icon: GithubLogo, url: "https://github.com/leticiadia" },
-      { icon: InstagramLogo, url: "https://www.instagram.com/leohdas/" },
-      { icon: LinkedinLogo, url: "https://www.linkedin.com/in/leohas/" },
+      { icon: GithubLogo, url: "" },
+      { icon: InstagramLogo, url: "" },
+      { icon: LinkedinLogo, url: "" },
     ],
   },
 
@@ -52,9 +52,9 @@ export const mockKnowledgers = [
     image: knowledgerJoao,
     flag: "alagoas",
     social: [
-      { icon: GithubLogo, url: "https://github.com/leticiadia" },
-      { icon: InstagramLogo, url: "https://www.instagram.com/leohdas/" },
-      { icon: LinkedinLogo, url: "https://www.linkedin.com/in/leohas/" },
+      { icon: GithubLogo, url: "" },
+      { icon: InstagramLogo, url: "" },
+      { icon: LinkedinLogo, url: "" },
     ],
   },
 
@@ -64,8 +64,8 @@ export const mockKnowledgers = [
     image: knowledgerDaniel,
     flag: "alagoas",
     social: [
-      { icon: InstagramLogo, url: "https://www.instagram.com/leohdas/" },
-      { icon: LinkedinLogo, url: "https://www.linkedin.com/in/leohas/" },
+      { icon: InstagramLogo, url: "" },
+      { icon: LinkedinLogo, url: "" },
     ],
   },
 ];

src/components/posts/post/Post.tsx

@@ -21,6 +21,7 @@ interface PostProps {
 
 export function Post() {
   const [post, setPost] = useState<PostProps>();
+
   const authorInfo = mockAuthor.find(
     (author) => author.name === post?.author.name
   );

src/components/posts/postlist/PostList.tsx

@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from "react";
 
-import { ArrowRight } from "@phosphor-icons/react";
+import { ArrowRight, Clock } from "@phosphor-icons/react";
 import { Link } from "react-router-dom";
 import { formatDateToLong } from "../../../utils/formatDate";
 import { getPosts } from "../../../services/postsService";
@@ -14,6 +14,7 @@ export interface PostType {
     name: string;
   };
   slug: string;
+  estimated_time: number;
 }
 
 export function PostList() {
@@ -68,7 +69,7 @@ export function PostList() {
               >
                 <div className="flex flex-col gap-4 flex-grow">
                   <Link to={`/posts/${post.slug}`} className="no-underline">
-                    <h3 className="lg:w-[28rem] md:w-[16rem] text-sm md:text-xl font-bold dark:text-[#EDE9FE] text-black hover:underline hover:decoration-2 dark:hover:decoration-blue-300 hover:decoration-black">
+                    <h3 className="lg:w-[28rem] md:w-[16rem] text-sm md:text-xl font-bold dark:text-[#EDE9FE] text-black hover:underline hover:decoration-2 dark:hover:decoration-blue-400 hover:decoration-black">
                       {post.title}
                     </h3>
                   </Link>
@@ -85,13 +86,22 @@ export function PostList() {
                   </p>
                 </div>
 
-                <Link
-                  to={`/posts/${post.slug}`}
-                  className="flex items-center gap-2 font-bold mt-auto min-h-14 text-sm dark:text-white text-black dark:hover:text-blue-300 hover:underline"
-                >
-                  Ler mais
-                  <ArrowRight size={16} />
-                </Link>
+                <div className="flex items-center justify-between">
+                  <Link
+                    to={`/posts/${post.slug}`}
+                    className="flex items-center gap-2 font-bold mt-auto min-h-14 text-sm dark:text-white text-black dark:hover:text-blue-400 hover:underline"
+                  >
+                    Ler mais
+                    <ArrowRight size={16} />
+                  </Link>
+
+                  <div className="flex items-center gap-2">
+                    <Clock size={20} weight="bold" color="#8ec5ff" />
+                    <p className="text-sm font-semibold text-blue-400">
+                      {post.estimated_time}min
+                    </p>
+                  </div>
+                </div>
               </li>
             ))}
           </ul>

src/sections/SectionFounders.tsx

@@ -17,13 +17,13 @@ export function SectionFounders() {
         </h2>
 
         <div className="flex flex-col gap-6 w-[19rem] screen-custom:w-[22rem] xs-custom:w-[22rem] md:w-[39rem] lg:w-[26rem]">
-          <p className="font-medium leading-relaxed text-center lg:text-left dark:text-white text-[#62748E]">
+          <p className="leading-relaxed text-center lg:text-left dark:text-white text-[#62748E]">
             Fala galera! Somos o Mikael e a Leticia, os criadores do blog
             TechKnowledge. Gostariamos de compartilhar com vocês um pouco da
             nossa jornada.
           </p>
 
-          <p className="font-medium leading-relaxed text-center lg:text-left dark:text-white text-[#62748E]">
+          <p className="leading-relaxed text-center lg:text-left dark:text-white text-[#62748E]">
             Vem conhecer um pouco sobre nós e como chegamos no universo da
             tecnologia.
           </p>