hacklab/26s
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Colectivos de la acampada con logo y redes desplegables

Browse source
This commit is contained in:
hacklab 2026-09-29 22:26:50 +02:00
parent fe53049ceb
commit 217984045e
2 changed files with 52 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

35
site/css/main.css
View file

@ -121,11 +121,36 @@ footer { margin: 64px 0 24px; border-top: var(--bd); padding-top: 12px; font-siz
.bt:hover, .bt:focus-visible, .bt:active { transform: none; } .bt:hover, .bt:focus-visible, .bt:active { transform: none; }
} }
.colectivos { list-style: none; margin: 0 0 16px; padding: 0; columns: 2 280px; column-gap: 32px; } .colectivos { list-style: none; margin: 0 0 16px; padding: 0; columns: 2 300px; column-gap: 32px; }
.colectivos li { break-inside: avoid; padding: 6px 0; border-bottom: 1px solid var(--fg); } .colectivos > li { break-inside: avoid; border-bottom: 1px solid var(--fg); }
.colectivos a { font-family: var(--tit); font-size: 22px; text-transform: uppercase; text-decoration: none; } .colectivos summary, .colectivos .cab {
.colectivos a:hover, .colectivos a:focus-visible { color: var(--neon); } display: grid;
.colectivos span { display: block; font-size: 14px; } grid-template-columns: 48px 1fr;
column-gap: 12px;
align-items: center;
padding: 8px 0;
}
.colectivos summary { cursor: pointer; list-style: none; }
.colectivos summary::-webkit-details-marker { display: none; }
.colectivos img, .colectivos .sin-logo { grid-row: span 2; width: 48px; height: 48px; border: 2px solid var(--fg); }
.colectivos .sin-logo { background: var(--fg); }
.colectivos .n { font-family: var(--tit); font-size: 22px; line-height: 1.1; text-transform: uppercase; }
.colectivos .n.solo { grid-row: span 2; }
.colectivos .d { font-size: 14px; line-height: 1.3; }
.colectivos summary .n::after { content: " +"; }
.colectivos details[open] .n::after { content: " −"; }
.colectivos summary:hover .n, .colectivos summary:focus-visible .n, .colectivos details[open] .n { color: var(--neon); }
.colectivos summary:focus-visible { outline: 2px solid var(--neon); outline-offset: 2px; }
.redes { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0 0 12px 60px; }
.redes a {
display: block;
padding: 4px 10px;
font-size: 15px;
text-decoration: none;
border: 2px solid var(--fg);
border-radius: 8px;
}
.redes a:hover, .redes a:focus-visible { color: var(--neon); border-color: var(--neon); outline: none; }
.unete { max-width: 480px; margin: 32px auto; } .unete { max-width: 480px; margin: 32px auto; }
.unete .bt { padding: 22px 16px; font-size: 34px; } .unete .bt { padding: 22px 16px; font-size: 34px; }

28
site/index.html
View file

@ -45,13 +45,29 @@
<section id="colectivos"> <section id="colectivos">
<h2>Colectivos</h2> <h2>Colectivos</h2>
<p>Centros sociales y colectivos de Madrid. Aquí también hay información y asambleas.</p> <p>Centros sociales y colectivos que están en la acampada. Toca uno para ver sus redes.</p>
<ul class="colectivos"> <ul class="colectivos">
<li><a href="https://csolarosa.net" rel="noopener noreferrer">CSO La Rosa</a> <span>Centro · La Latina</span></li> <li><details><summary><img src="/img/colectivos/larosa.webp" alt="" width="48" height="48" loading="lazy"><span class="n">CSO La Rosa</span><span class="d">Centro · La Latina</span></summary><ul class="redes"><li><a href="https://csolarosa.net" rel="noopener noreferrer">Web</a></li><li><a href="https://www.instagram.com/CSO_LaRosa/" rel="noopener noreferrer">Instagram</a></li><li><a href="https://t.me/CSO_LaRosa" rel="noopener noreferrer">Telegram</a></li></ul></details></li>
<li><a href="https://eslaeko.net" rel="noopener noreferrer">ESLA EKO</a> <span>Carabanchel</span></li> <li><details><summary><img src="/img/colectivos/eko.webp" alt="" width="48" height="48" loading="lazy"><span class="n">ESLA EKO</span><span class="d">Carabanchel</span></summary><ul class="redes"><li><a href="https://eslaeko.net" rel="noopener noreferrer">Web</a></li><li><a href="https://www.instagram.com/eko_carabanchel/" rel="noopener noreferrer">Instagram</a></li><li><a href="https://x.com/EKO_Carabanchel" rel="noopener noreferrer">X</a></li><li><a href="https://t.me/ESLAEkoDifusion" rel="noopener noreferrer">Telegram</a></li></ul></details></li>
<li><a href="https://www.laenre.net" rel="noopener noreferrer">CSOA La Enredadera</a> <span>Tetuán</span></li> <li><details><summary><img src="/img/colectivos/enredadera.webp" alt="" width="48" height="48" loading="lazy"><span class="n">CSOA La Enredadera</span><span class="d">Tetuán</span></summary><ul class="redes"><li><a href="https://www.laenre.net" rel="noopener noreferrer">Web</a></li><li><a href="https://www.instagram.com/la_enredadera_de_tetuan/" rel="noopener noreferrer">Instagram</a></li><li><a href="https://t.me/laenredadera" rel="noopener noreferrer">Telegram</a></li></ul></details></li>
<li><a href="https://www.instagram.com/csolaanimosa/" rel="noopener noreferrer">CSO La Animosa</a> <span>Hortaleza</span></li> <li><details><summary><img src="/img/colectivos/animosa.webp" alt="" width="48" height="48" loading="lazy"><span class="n">CSO La Animosa</span><span class="d">Hortaleza</span></summary><ul class="redes"><li><a href="https://www.instagram.com/csolaanimosa/" rel="noopener noreferrer">Instagram</a></li><li><a href="https://x.com/CSOLaAnimosa" rel="noopener noreferrer">X</a></li></ul></details></li>
<li><a href="https://apoyalacasika.wordpress.com" rel="noopener noreferrer">CSOA La Casika</a> <span>Móstoles</span></li> <li><details><summary><img src="/img/colectivos/casika.webp" alt="" width="48" height="48" loading="lazy"><span class="n">CSOA La Casika</span><span class="d">Móstoles</span></summary><ul class="redes"><li><a href="https://www.instagram.com/lacasika.csoa/" rel="noopener noreferrer">Instagram</a></li><li><a href="https://apoyalacasika.wordpress.com" rel="noopener noreferrer">Blog de apoyo</a></li></ul></details></li>
<li><details><summary><img src="/img/colectivos/inquilinas.webp" alt="" width="48" height="48" loading="lazy"><span class="n">Sindicato de Inquilinas</span><span class="d">Vivienda</span></summary><ul class="redes"><li><a href="https://inquilinato.org" rel="noopener noreferrer">Web</a></li><li><a href="https://www.instagram.com/inquilinato_madrid/" rel="noopener noreferrer">Instagram</a></li><li><a href="https://x.com/InquilinatoMad" rel="noopener noreferrer">X</a></li><li><a href="https://t.me/inquilinatoMad" rel="noopener noreferrer">Telegram</a></li></ul></details></li>
<li><details><summary><img src="/img/colectivos/xr.webp" alt="" width="48" height="48" loading="lazy"><span class="n">Rebelión o Extinción</span><span class="d">Clima</span></summary><ul class="redes"><li><a href="https://www.instagram.com/xrmadrid_/" rel="noopener noreferrer">Instagram</a></li><li><a href="https://x.com/xrmadrid_" rel="noopener noreferrer">X</a></li><li><a href="https://t.me/XRMadrid" rel="noopener noreferrer">Telegram</a></li></ul></details></li>
<li><div class="cab"><span class="sin-logo" aria-hidden="true"></span><span class="n">PUCVM</span><span class="d">Sindicatos y asambleas de vivienda de Madrid</span></div></li>
<li><details><summary><img src="/img/colectivos/ir.webp" alt="" width="48" height="48" loading="lazy"><span class="n solo">Izquierda Revolucionaria</span></summary><ul class="redes"><li><a href="https://izquierdarevolucionaria.net/" rel="noopener noreferrer">Web</a></li><li><a href="https://www.instagram.com/izquierdarevol/" rel="noopener noreferrer">Instagram</a></li><li><a href="https://x.com/IzquierdaRevol" rel="noopener noreferrer">X</a></li></ul></details></li>
<li><details><summary><img src="/img/colectivos/liza.webp" alt="" width="48" height="48" loading="lazy"><span class="n">LIZA</span><span class="d">Plataforma anarquista</span></summary><ul class="redes"><li><a href="https://www.instagram.com/liza__madrid/" rel="noopener noreferrer">Instagram</a></li><li><a href="https://x.com/Liza__Madrid" rel="noopener noreferrer">X</a></li><li><a href="https://lizaplataforma.com/" rel="noopener noreferrer">Web</a></li></ul></details></li>
<li><details><summary><img src="/img/colectivos/ariskas.webp" alt="" width="48" height="48" loading="lazy"><span class="n">Ariskas</span><span class="d">Vallekas</span></summary><ul class="redes"><li><a href="https://www.instagram.com/ariskas.vk/" rel="noopener noreferrer">Instagram</a></li></ul></details></li>
<li><details><summary><img src="/img/colectivos/solidaridad.webp" alt="" width="48" height="48" loading="lazy"><span class="n">Solidaridad Obrera</span><span class="d">Sindicato</span></summary><ul class="redes"><li><a href="https://www.solidaridadobrera.org/" rel="noopener noreferrer">Web</a></li><li><a href="https://www.instagram.com/soliobrera/" rel="noopener noreferrer">Instagram</a></li></ul></details></li>
<li><details><summary><img src="/img/colectivos/fff.webp" alt="" width="48" height="48" loading="lazy"><span class="n">Fridays For Future</span><span class="d">Clima</span></summary><ul class="redes"><li><a href="https://www.instagram.com/fridaysformadrid/" rel="noopener noreferrer">Instagram</a></li><li><a href="https://mastodon.social/@fridaysformadrid" rel="noopener noreferrer">Mastodon</a></li><li><a href="https://bsky.app/profile/fridaysformadrid.bsky.social" rel="noopener noreferrer">Bluesky</a></li><li><a href="https://t.me/fffmadrid" rel="noopener noreferrer">Telegram</a></li></ul></details></li>
<li><details><summary><img src="/img/colectivos/crt.webp" alt="" width="48" height="48" loading="lazy"><span class="n">CRT</span><span class="d">Corriente Revolucionaria de Trabajadores y Trabajadoras</span></summary><ul class="redes"><li><a href="https://crtweb.org/" rel="noopener noreferrer">Web</a></li><li><a href="https://www.instagram.com/crtorg/" rel="noopener noreferrer">Instagram</a></li><li><a href="https://x.com/CRTorg" rel="noopener noreferrer">X</a></li></ul></details></li>
<li><details><summary><img src="/img/colectivos/contracorriente.webp" alt="" width="48" height="48" loading="lazy"><span class="n">Contracorriente</span><span class="d">Juventud</span></summary><ul class="redes"><li><a href="https://www.instagram.com/contrac_mad/" rel="noopener noreferrer">Instagram</a></li><li><a href="https://x.com/contrac_mad" rel="noopener noreferrer">X</a></li></ul></details></li>
<li><div class="cab"><span class="sin-logo" aria-hidden="true"></span><span class="n solo">Luciérnagas</span></div></li>
<li><div class="cab"><span class="sin-logo" aria-hidden="true"></span><span class="n solo">Articulación Antirracista Madrid</span></div></li>
<li><details><summary><img src="/img/colectivos/bbaa.webp" alt="" width="48" height="48" loading="lazy"><span class="n">Asamblea BBAA x la Pública</span><span class="d">Bellas Artes · UCM x la Pública</span></summary><ul class="redes"><li><a href="https://ucmxlapublica.org/" rel="noopener noreferrer">Web</a></li><li><a href="https://www.instagram.com/ucm_por_la_publica/" rel="noopener noreferrer">Instagram</a></li><li><a href="https://x.com/UCMporlaPublica" rel="noopener noreferrer">X</a></li><li><a href="https://t.me/PlataformaUCM" rel="noopener noreferrer">Telegram</a></li></ul></details></li>
<li><details><summary><img src="/img/colectivos/sindicato-estudiantes.webp" alt="" width="48" height="48" loading="lazy"><span class="n solo">Sindicato de Estudiantes</span></summary><ul class="redes"><li><a href="https://www.sindicatodeestudiantes.net/" rel="noopener noreferrer">Web</a></li><li><a href="https://www.instagram.com/sindestudmadrid/" rel="noopener noreferrer">Instagram</a></li><li><a href="https://x.com/SEMadrid_" rel="noopener noreferrer">X</a></li></ul></details></li>
<li><details><summary><img src="/img/colectivos/marika.webp" alt="" width="48" height="48" loading="lazy"><span class="n solo">Movimiento Marika Madrid</span></summary><ul class="redes"><li><a href="https://x.com/marikasMMM" rel="noopener noreferrer">X</a></li></ul></details></li>
<li><details><summary><img src="/img/colectivos/trans.webp" alt="" width="48" height="48" loading="lazy"><span class="n solo">Trans en Lucha</span></summary><ul class="redes"><li><a href="https://www.instagram.com/transenlucha/" rel="noopener noreferrer">Instagram</a></li></ul></details></li>
</ul> </ul>
<p>¿Falta tu colectivo? Escribe a la comisión de comunicación en OASIS.</p> <p>¿Falta tu colectivo? Escribe a la comisión de comunicación en OASIS.</p>
</section> </section>