segundo commit
This commit is contained in:
root
parent
6b8b75863a
commit
d2e79d63a5
13601 changed files with 1117197 additions and 0 deletions
265
index.html
Normal file
265
index.html
Normal file
|
|
@ -0,0 +1,265 @@
|
|||
<!doctype html>
|
||||
<html lang="es">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>artivismo</title>
|
||||
|
||||
<!-- Tipos ^`^|graffiti/artist ^`^} -->
|
||||
<link href="https://fonts.googleapis.com/css2?family=Permanent+Marker&family=Rock+Salt&family=Montserrat:wght@400;600;800&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="styles.css" />
|
||||
<meta name="color-scheme" content="light">
|
||||
</head>
|
||||
<body>
|
||||
<header class="site-header">
|
||||
<div class="brand">
|
||||
<h1 class="logo" aria-label="ARTIVISMO">artivismo</h1>
|
||||
</div>
|
||||
<nav class="nav">
|
||||
<a href="#galeria" class="nav-link">Galery</a>
|
||||
<a href="#sobre" class="nav-link">About</a>
|
||||
<a href="#contacto" class="nav-link">Contact</a>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<!-- Controles de categorías (CSS-only) -->
|
||||
<section id="filtros" class="filtros" aria-label="Filtrar por categoría">
|
||||
<!-- Radios ocultos -->
|
||||
<input type="radio" name="cat" id="cat-todo" checked>
|
||||
<input type="radio" name="cat" id="cat-mural" checked>
|
||||
<input type="radio" name="cat" id="cat-protesta" checked>
|
||||
<input type="radio" name="cat" id="cat-collage" checked>
|
||||
<input type="radio" name="cat" id="cat-stencil" checked>
|
||||
|
||||
<!-- Etiquetas visibles -->
|
||||
<div class="tabs">
|
||||
<label class="tab" for="cat-todo">Todo</label>
|
||||
<label class="tab" for="cat-mural">Murales</label>
|
||||
<label class="tab" for="cat-protesta">Protesta</label>
|
||||
<label class="tab" for="cat-collage">Collage</label>
|
||||
<label class="tab" for="cat-stencil">Stencil</label>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Galería -->
|
||||
<section id="galeria" class="galeria" aria-label="Galería de imágenes">
|
||||
<!-- Todos los ítems usan la clase existente "item mural" para no romper el CSS/filters -->
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/1984.jpg" alt="1984" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">sten</span>
|
||||
<h3 class="title">1984</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/agua.jpg" alt="Agua" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">draw</span>
|
||||
<h3 class="title">Water</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/armas_banksy.jpg" alt="Dick Launch" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">sten</span>
|
||||
<h3 class="title">Dick launch</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/cambiar_las_cosas.jpg" alt="Cambiar las cosas" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">draw</span>
|
||||
<h3 class="title">Change Things</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/chess_kings.jpg" alt="Chess Kings" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">draw</span>
|
||||
<h3 class="title">Chess Kings</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/crean_desiertos.jpg" alt="Crean desiertos" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">draw</span>
|
||||
<h3 class="title">OASIFICAR</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/cyberpunk.jpg" alt="Cyberpunk" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">flyer</span>
|
||||
<h3 class="title">Cyberpunk</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/declarar_desolacion.jpg" alt="Declarar desolación" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">draw</span>
|
||||
<h3 class="title">Declarar</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/desgazado.jpeg" alt="Desgazado" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">flyer</span>
|
||||
<h3 class="title">Desgazado</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/el_pez.jpg" alt="El pez" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">draw</span>
|
||||
<h3 class="title">El pez</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/empresnder.jpg" alt="Empresnder" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">draw</span>
|
||||
<h3 class="title">Entrepeneurship</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/empujar_locomotora.jpg" alt="Empujar locomotora" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">draw</span>
|
||||
<h3 class="title">Train push</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/gato.jpg" alt="Gato" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">graffiti</span>
|
||||
<h3 class="title">CAT</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/gentrificado.jpg" alt="Gentrificado" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">flyer</span>
|
||||
<h3 class="title">Gentrificado</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/leopardo.jpg" alt="Leopardo" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">draw</span>
|
||||
<h3 class="title">Leopard</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/musk.jpg" alt="Musk" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">flyer</span>
|
||||
<h3 class="title">Musk</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/musk_1939.jpg" alt="Musk 1939" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">flyer</span>
|
||||
<h3 class="title">Musk 1939</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/nueva_brida.jpg" alt="Nueva brida" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">draw</span>
|
||||
<h3 class="title">New year</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/politicos_arca.jpg" alt="Políticos Arca" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">draw</span>
|
||||
<h3 class="title">Fuck Noe</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/stickers.jpg" alt="Stickers" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">stick</span>
|
||||
<h3 class="title">Stickers</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="item mural">
|
||||
<img src="ARTIVISMO_THS/stop_wars.jpg" alt="Stop wars" loading="lazy">
|
||||
<figcaption>
|
||||
<span class="chip chip-mural">sten</span>
|
||||
<h3 class="title">Stop wars</h3>
|
||||
<p class="meta"></p>
|
||||
</figcaption>
|
||||
</figure>
|
||||
</section>
|
||||
|
||||
<!-- Sobre -->
|
||||
<section id="sobre" class="sobre">
|
||||
<h2>About</h2>
|
||||
<p>
|
||||
ARTIVISMO is a space to archive and celebrate images with intention:
|
||||
murals, visual protests, collages, stencils and performances. We curate
|
||||
pieces that question, move and activate.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<!-- Contacto -->
|
||||
<section id="contacto" class="contacto">
|
||||
<h2>Contact</h2>
|
||||
<p>¿Share with us!</p>
|
||||
<a class="cta" href="mailto:hola@artivismo.example">artivismo@riseup.net</a>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer class="site-footer">
|
||||
<p><span id="year"></span> ARTIVISMO made with love</p>
|
||||
</footer>
|
||||
|
||||
<!-- Año -->
|
||||
<script>
|
||||
document.getElementById('year').textContent = new Date().getFullYear();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue