From cbc004834bb768b4fea99ffecc3b5ded10fde64d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Itziar=20Zameza=20Garc=C3=ADa?= Date: Sun, 22 Mar 2026 19:26:59 +0100 Subject: [PATCH] feat: add project detail modals with comprehensive case studies - Add 'Ver detalles' button to each project card - Implement 3 fullscreen modals with project information - Include project description, features, and tech stack for each project - Add high-quality screenshots/imagery in modals - Implement modal open/close with smooth animations - Add ESC key support to close modals - Prevent body scroll when modal is open - Use glassmorphism design consistent with portfolio theme - Add dark mode support for all modal elements - Include measurable results for each project case study --- index.html | 456 ++++++++++++++++++++++++++++++++++++++++++++++++----- 1 file changed, 420 insertions(+), 36 deletions(-) diff --git a/index.html b/index.html index 18b05b5..a5e7b66 100644 --- a/index.html +++ b/index.html @@ -204,7 +204,9 @@
-

+

Sobre mí

Ingeniera de telecomunicaciones y desarrolladora especializada - en automatización de procesos, integración de APIs y creación - de agentes basados en inteligencia artificial. Construyo - sistemas que conectan herramientas, procesan información - (texto, audio, vídeo) y crean flujos automatizados que reducen - trabajo manual. + en automatización de procesos, integración de APIs y creación de + agentes basados en inteligencia artificial. Construyo sistemas + que conectan herramientas, procesan información (texto, audio, + vídeo) y crean flujos automatizados que reducen trabajo manual.

@@ -281,9 +284,13 @@
-
+
-

+

Selected Works

@@ -313,7 +320,9 @@ >

-

+

AI Knowledge Pipeline

-

+
n8nAPIs IA
+
@@ -355,7 +370,9 @@ >
-

+

ChefGPT

-

+
Telegramn8n
+
@@ -397,7 +420,9 @@ >
-

+

Content Processing Automation

-

+
WorkflowLLMs
+
@@ -433,7 +464,9 @@ class="absolute inset-0 bg-primary/[0.03] dark:bg-primary/[0.02] skew-y-3 -z-10" >
-

+

Tech Curated Stack

@@ -451,7 +484,9 @@
- terminal + terminal
Next.js - database + database
Supabase - palette + palette
Tailwind CSS -
+
mail Enviar un Email @@ -557,17 +598,19 @@
link - share + share
@@ -575,22 +618,333 @@
-

© 2024 Itziar ZG. Hecho con IA y mucho café.

+

© 2025 Itziar ZG. Hecho con IA y mucho café.

LinkedIn GitHub
+
+ +
+ + + + + + + + + + + @@ -626,15 +980,45 @@ } } - function scrollToContact() { - const contactSection = document.getElementById("contact"); - if (contactSection) { - contactSection.scrollIntoView({ behavior: "smooth" }); - } - } + function scrollToContact() { + const contactSection = document.getElementById("contact"); + if (contactSection) { + contactSection.scrollIntoView({ behavior: "smooth" }); + } + } - // Initialize theme on page load - document.addEventListener("DOMContentLoaded", initTheme); + // Modal functions + function openModal(projectId) { + const modal = document.getElementById(projectId + "-modal"); + if (modal) { + modal.classList.remove("hidden"); + document.body.style.overflow = "hidden"; + } + } + + function closeModal(projectId) { + const modal = document.getElementById(projectId + "-modal"); + if (modal) { + modal.classList.add("hidden"); + document.body.style.overflow = "auto"; + } + } + + // Close modal with ESC key + document.addEventListener("keydown", function (event) { + if (event.key === "Escape") { + const modals = document.querySelectorAll( + '[id$="-modal"]:not(.hidden)' + ); + modals.forEach((modal) => { + const projectId = modal.id.replace("-modal", ""); + closeModal(projectId); + }); + } + }); + + // Initialize theme on page load + document.addEventListener("DOMContentLoaded", initTheme);