timeline-1

• Vista previa

  Esta semana

  • Nicolas Ibañez , te ha mencionado en un comentario de Progression Ventures.

    Viernes, 04:46PM

    El proyecto de Progression Ventures va a necesitar un par de manos extra para completarse a tiempo, deberíamos intentar que Laura...

  • Nicolas Ibañez , comento el proyecto de Progression Ventures.

    Jueves, 12:12PM

    Hemos finalizado los términos y condiciones de Progression Ventures esta mañana, por favor revisenlos y haganme saber si hay algo que debamos cambiar.

  • Progression Ventures se ha agrado a los clientes.

    Miercoles, 05:45PM

  • Progression Ventures se ha eliminado de los tratos de entrada.

    Martes, 10:24PM

• Código

  const Timeline1 = () => {
    return (
      <div className="flex flex-col gap-y-5">
        <h3 className="font-medium text-2xl">Esta semana</h3>
        <ul className="border-l border-background-secondary border-dashed pl-8 space-y-8">
          <li>
            <div className="relative">
              <i className="fi fi-sr-comment-alt absolute w-8 h-8 flex items-center justify-center -left-12 top-1/2 -translate-y-1/2 bg-primary rounded-full ring-4 ring-background text-white"></i>
              <h5 className="text-muted-foreground">
                <span className="text-primary">Nicolas Ibañez</span> , te ha mencionado en un comentario de Progression
                Ventures.
              </h5>
            </div>
            <div className="mb-5">
              <p className="text-sm">Viernes, 04:46PM</p>
            </div>
            <div>
              <p className="bg-background-secondary p-3 rounded-lg">
                El proyecto de <span className="text-primary">Progression Ventures</span> va a necesitar un par de manos
                extra para completarse a tiempo, deberíamos intentar que Laura...
              </p>
            </div>
          </li>
          <li>
            <div className="relative">
              <i className="fi fi-sr-comment-alt absolute w-8 h-8 flex items-center justify-center -left-12 top-1/2 -translate-y-1/2 bg-primary rounded-full ring-4 ring-background text-white"></i>
              <h5 className="text-muted-foreground">
                <span className="text-primary">Nicolas Ibañez</span> , comento el proyecto de Progression Ventures.
              </h5>
            </div>
            <div className="mb-5">
              <p className="text-sm">Jueves, 12:12PM</p>
            </div>
            <div>
              <p className="bg-background-secondary p-3 rounded-lg">
                Hemos finalizado los términos y condiciones de <span className="text-primary">Progression Ventures</span>{' '}
                esta mañana, por favor revisenlos y haganme saber si hay algo que debamos cambiar.
              </p>
            </div>
          </li>
          <li>
            <div className="relative">
              <i className="fi fi-sr-plus absolute w-8 h-8 flex items-center justify-center -left-12 top-1/2 -translate-y-1/2 bg-primary rounded-full ring-4 ring-background text-white"></i>
              <div>
                <p>
                  Progression Ventures se ha agrado a los <span className="text-blue-500">clientes.</span>
                </p>
              </div>
            </div>
            <div className="mb-5">
              <p className="text-sm text-muted-foreground">Miercoles, 05:45PM</p>
            </div>
          </li>
          <li>
            <div className="relative">
              <i className="fi fi-sr-plus absolute w-8 h-8 flex items-center justify-center -left-12 top-1/2 -translate-y-1/2 bg-primary rounded-full ring-4 ring-background text-white"></i>
              <div>
                <p>
                  Progression Ventures se ha eliminado de los <span className="text-blue-500">tratos de entrada.</span>
                </p>
              </div>
            </div>
            <div className="mb-5">
              <p className="text-sm text-muted-foreground">Martes, 10:24PM</p>
            </div>
          </li>
        </ul>
      </div>
    );
  };
  
  export default Timeline1;