Agrega proyecto spotify

src/components/Projects.astro

@@ -5,13 +5,19 @@ const TAGS = {
     name: "JavaScript",
     icon: "javascript",
     color: "#fff",
-    bg: "#2b2a20",
+    bg: "#414123e8",
+  },
+  css: {
+    name: "CSS3",
+    icon: "css3",
+    color: "#fff",
+    bg: "#264a73bf",
   },
   react: {
     name: "React",
     icon: "react",
     color: "#fff",
-    bg: "#ac5637",
+    bg: "#003159",
   },
   vue: {
     name: "Vue.js",
@@ -29,27 +35,39 @@ const TAGS = {
     name: "Nuxt.js",
     icon: "nuxt",
     color: "#fff",
-    bg: "#152939",
+    bg: "#14403f",
+  },
+  astro: {
+    name: "Astro",
+    icon: "astro",
+    color: "#fff",
+    bg: "#182e40",
+  },
+  tailwind: {
+    name: "Tailwind",
+    icon: "tailwindcss",
+    color: "#fff",
+    bg: "#104755",
   },
 };
 const PROJECTS = [
+  {
+    title: "Spotify Clone",
+    description:
+      "Reproductor de música con persistencia de estado al cambiar de página, equipado con controles de volumen y tiempo de reproducción. Ofrece transiciones entre páginas suaves y animaciones sutiles para una experiencia de usuario mejorada.",
+    link: "https://maximojsdev.github.io/Url-Shortening-Api/",
+    repo: "https://github.com/MaximoJSDev/Url-Shortening-Api",
+    image: "/images/spotify.webp",
+    tags: [TAGS.react, TAGS.tailwind, TAGS.astro],
+  },
   {
     title: "Rest countries API",
     description:
-      "Aplicación de búsqueda de países con API integrada para obtener datos sobre diferentes países. Permite a los usuarios filtrar información y explorar detalles específicos de cada país.",
+      "Aplicación de búsqueda de países con integrada con una API para obtener datos sobre diferentes países en tiempo real. Permite a los usuarios filtrar información y explorar detalles específicos de cada país.",
     link: "https://maximojsdev.github.io/Rest-countries-API/",
     repo: "https://github.com/MaximoJSDev/Rest-countries-API",
     image: "/images/contries-api.webp",
-    tags: [TAGS.javascript],
-  },
-  {
-    title: "URL Shortering",
-    description:
-      "Acortador de enlaces URL con guardado automatico en el localStorage del navegador. Facilita a los usuarios generar versiones más concisas de sus enlaces.",
-    link: "https://maximojsdev.github.io/Url-Shortening-Api/",
-    repo: "https://github.com/MaximoJSDev/Url-Shortening-Api",
-    image: "/images/url-short.webp",
-    tags: [TAGS.javascript],
+    tags: [TAGS.javascript, TAGS.css],
   },
   {
     title: "IP Tracker",
@@ -67,7 +85,7 @@ const PROJECTS = [
     link: "https://space-tourism-maximojsdev.vercel.app/",
     repo: "https://space-tourism-maximojsdev.vercel.app/",
     image: "/images/space.webp",
-    tags: [TAGS.nuxt],
+    tags: [TAGS.nuxt, TAGS.css],
   },
 ];
 ---
@@ -132,6 +150,7 @@ const PROJECTS = [
     display: flex;
     align-items: center;
     margin-bottom: 10px;
+    gap: 5px;
   }
   li {
     list-style: none;
@@ -140,10 +159,11 @@ const PROJECTS = [
     font-size: 16px;
     padding: 6px 12px;
     border-radius: 30px;
-    column-gap: 10px;
+    column-gap: 6px;
   }
   li img {
     height: 20px;
+    width: 20px;
   }
   .project__img {
     aspect-ratio: 3/2;