TE AMO YULISSA

programé esta pagina con mucho cariño

Nosotros

porque cada recuerdo junto a ti lo atesoro en mi corazón

Nosotros 1
Nosotros 2
Nosotros 3
Nosotros 4
Nosotros 5
Nosotros 6
Nosotros 7
Nosotros 8
Nosotros 9
Nosotros 10
Nosotros 11
Nosotros 12
1 / 12

tócala para verla completa

Para ti

Te amo con todo mi corazón, gracias por estar ahí para mi y apoyarme cuando lo he necesitado. Me siento afortunado de estar contigo y ser tu novio, me haces muy feliz y haré lo que sea para hacerte feliz a ti también

— Siempre tuyo

Solo para ti

Un pequeño secreto necesita la llave correcta

Esa no es la clave, mi amor. Intenta de nuevo.

te amo

en todas sus formas, colores y tipografías — desliza y descubre cada versión hecha para ti

10 formas de decirte lo mismo

01 — neón

te amo

como un letrero que no se apaga nunca en mi corazón

02 — pixel art

♥ 8-bit, sin game over

03 — maximalista

te AMO ¡muchísimo!

más es más cuando se trata de ti

04 — minimal

te amo

dos palabras. todo.

05 — minecraft

bloque por bloque, siempre contigo

06 — brutalista

TE AMO.

en bloque, sin filtro, sin miedo

07 — kawaii

te amo ♡

suavecito, esponjoso, todo rosita

08 — glitch

te amo

aunque falle el sistema, yo te amo

09 — acuarela

te amo

suave como acuarela que se expande

10 — collage

teamo

pedacito a pedacito, siempre tú

y en cualquiera que elijas, siempre significa lo mismo: eres mi todo, Yulissa ♥

1UP 00
HI-SCORE 00
NIVEL 1

PAC-MAN

usa las flechas o desliza el tablero

PAUSA

GAME OVER

detrás de la página

EL CÓDIGO

Para que veas cómo está construido

Esta página está hecha con HTML, CSS y JavaScript. Aquí puedes recorrer el proyecto con calma, explicado en partes para que sea fácil de seguir.

01

HTML

Es el esqueleto: títulos, fotos, botones y cada sección que ves.

02

CSS

Es la apariencia: colores, tamaños, animaciones y adaptación al móvil.

03

JavaScript

Es el comportamiento: navegación, carrusel, clave, corazón y Pac-Man.

El proyecto por partes

Abre cada archivo para ver su contenido completo. Los archivos grandes están divididos de esta forma para que puedas entender qué hace cada uno.

Las partes sensibles se reemplazan por: “Aquí no se muestra para no revelar esta info”

01 index.html La estructura y el contenido HTML

Aquí nacen las cuatro pestañas y todo lo que aparece en pantalla.

preparando archivo… 
Abre esta parte para cargar el código completo.
02 styles.css El diseño principal CSS

Colores, tipografías, responsive, waybar, corazón, fotos, carta y video.

abre la parte para cargarla 
Abre esta parte para cargar el código completo.
03 app.js La interacción de la página JS

Hace funcionar la navegación, el corazón, el carrusel, la clave y la carga inteligente.

abre la parte para cargarla 
Abre esta parte para cargar el código completo.
04 teamo.css Los diez estilos de “te amo” CSS

La galería de neón, pixel art, Minecraft, acuarela y los demás estilos.

abre la parte para cargarla 
Abre esta parte para cargar el código completo.
05 pacman.css El tablero y sus controles CSS

El laberinto, el marcador, los botones táctiles y los mensajes del juego.

abre la parte para cargarla 
Abre esta parte para cargar el código completo.
06 pacman.js Las reglas y el movimiento del juego JS

La lógica de Pac-Man: puntos, fantasmas, niveles, controles, sonido y vidas.

abre la parte para cargarla 
Abre esta parte para cargar el código completo.

Las fotos, gifs, fuentes y sonidos son recursos aparte. El código los llama desde sus carpetas para que la página pueda usarlos.