306 lines
14 KiB
HTML
306 lines
14 KiB
HTML
|
||
<!DOCTYPE html>
|
||
<html lang="es">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>La Enredadera de Tetuán</title>
|
||
<link rel="preload" href="/Code462WPink-Regular.ttf" as="font" type="font/ttf">
|
||
<link rel="stylesheet" href="/index.css">
|
||
</head>
|
||
<body>
|
||
<input type="checkbox" id="nav-toggle" class="sr-only">
|
||
<label for="nav-toggle" class="sb-toggle" aria-label="Abrir/cerrar menú">☰</label>
|
||
<div class="container">
|
||
<div class="vertical-marquee left-marquee">
|
||
<marquee behavior="scroll" direction="up" scrollamount="2">
|
||
NI DIOS NI AMO, NI PATRIA NI ESTADO -0->
|
||
</marquee>
|
||
</div>
|
||
|
||
<div class="vertical-marquee right-marquee">
|
||
<marquee behavior="scroll" direction="up" scrollamount="2">
|
||
OKUPA RESISTE 1312 <3
|
||
</marquee>
|
||
</div>
|
||
|
||
<aside id="sidebar" class="sidebar">
|
||
<img src="/INFO/logo_enre_negro.png" alt="Logo de La Enredadera" class="logo">
|
||
<h2>La Enredadera</h2>
|
||
<p>Centro Social Autogestionado en Tetuán. Haciendo barrio desde 2009.</p>
|
||
<nav class="sidebar-nav">
|
||
<ul>
|
||
<li><a href="/subdir/sobre_nosotrxs.html">Sobre Nosotrxs</a></li>
|
||
<li><a href="https://okupanel.laenre.net">Actividades</a></li>
|
||
<li><a href="https://mad.convoca.la/place/CSO%20La%20Enredadera">Eventos</a></li>
|
||
<li><a href="comunicados.html">Comunicados</a></li>
|
||
<li><a href="mailto:enredadera@riseup.net">Contacto</a></li>
|
||
<li><a href="https://www.instagram.com/la_enredadera_de_tetuan/">Instagram</a></li>
|
||
<li><a href="https://masto.es/@csolaenre">Mastodon</a></li>
|
||
</ul>
|
||
</nav>
|
||
</aside>
|
||
|
||
<main class="main-content">
|
||
<header>
|
||
<h1>CSO LA ENREDADERA DE TETUÁN</h1>
|
||
<nav class="top-nav">
|
||
<ul>
|
||
<li><a href="/index.html#feminismos">feminismos tetuan</a></li>
|
||
<li><a href="/subdir/campa.html">campañas</a></li>
|
||
<li><a href="/index.html#yoga">yoga</a></li>
|
||
<li><a href="/index.html#fridays">fridays for future</a></li>
|
||
<li><a href="/index.html#OVT">organizacion vivienda tetuan</a></li>
|
||
<li><a href="/#circo/">circo</a></li>
|
||
<li><a href="https://hacklab.laenre.net">hacklab la raiz</a></li>
|
||
<li><a href="/#tienda_gratis/">tienda gratis</a></li>
|
||
<li><a href="/#biblioteka/">biblioteka</a></li>
|
||
<li><a href="/#Warawas/">warawas</a></li>
|
||
<li><a href="/#Hongos/">hongos</a></li>
|
||
<li><a href="/#Fermentos/">fermentos</a></li>
|
||
<li><a href="/#bicilab/">bicilab</a></li>
|
||
|
||
</ul>
|
||
</nav>
|
||
</header>
|
||
|
||
|
||
|
||
<!-- CALENDARIO MENSUAL (AUTO) -->
|
||
<section id="agenda" class="panel" aria-label="Calendario mensual">
|
||
<h2>Calendario</h2>
|
||
<div class="cal-controls" role="group" aria-label="Navegación de mes">
|
||
<button class="button cal-prev" type="button" aria-label="Mes anterior">←</button>
|
||
<div class="cal-title" aria-live="polite"></div>
|
||
<button class="button cal-next" type="button" aria-label="Mes siguiente">→</button>
|
||
</div>
|
||
|
||
<div class="cal" id="cal-root">
|
||
<!-- Aquí el JS pintará el calendario -->
|
||
</div>
|
||
|
||
|
||
<script>
|
||
(function () {
|
||
const monthNames = ['Enero','Febrero','Marzo','Abril','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre'];
|
||
const weekdayNames = ['L','M','X','J','V','S','D']; // lunes primero (ES)
|
||
|
||
// Paleta por colectivo
|
||
const COLORS = {
|
||
hacklab: { bg:'#39FF14', fg:'#000' }, // verde neón + negro (original)
|
||
feminismos: { bg:'#6A0DAD', fg:'#fff' }, // morado + blanco
|
||
vivienda: { bg:'#000000', fg:'#ff00aa' },// negro + rosa
|
||
circo: { bg:'#FFD400', fg:'#000' }, // amarillo + negro
|
||
bicilab: { bg:'#FF7A00', fg:'#000' }, // naranja + negro
|
||
autodefensa: { bg:'#00BCD4', fg:'#fff' }, // cian + blanco
|
||
fridays: { bg:'#2E8B57', fg:'#fff' } // verde oscuro + blanco
|
||
};
|
||
|
||
// Horarios semanales (sin viernes: se gestionan aparte)
|
||
const WEEKLY = [
|
||
{ group:'vivienda', dow:3, start:'19:00', end:'21:00' }, // jueves
|
||
{ group:'circo', dow:0, start:'18:00', end:'21:00' }, // lunes
|
||
{ group:'circo', dow:2, start:'18:00', end:'21:00' }, // miércoles
|
||
{ group:'feminismos', dow:2, start:'19:30', end:'21:30' }, // miércoles
|
||
{ group:'bicilab', dow:6, start:'17:00', end:'20:00' }, // domingo
|
||
{ group:'autodefensa', dow:1, start:'20:00', end:'22:00' }, // martes
|
||
{ group:'autodefensa', dow:2, start:'20:00', end:'22:00' } // miércoles
|
||
|
||
];
|
||
|
||
function createPill(text, bg, fg) {
|
||
const pill = document.createElement('div');
|
||
pill.className = 'cal-pill';
|
||
pill.style.setProperty('--bg', bg);
|
||
pill.style.setProperty('--fg', fg);
|
||
pill.textContent = text;
|
||
return pill;
|
||
}
|
||
|
||
function renderWeeklyPills(cell, wd){
|
||
const todays = WEEKLY.filter(e => e.dow === wd);
|
||
if (!todays.length) return;
|
||
const wrap = document.createElement('div');
|
||
wrap.className = 'cal-pills';
|
||
todays.forEach(e => {
|
||
const { bg, fg } = COLORS[e.group] || { bg:'#eee', fg:'#000' };
|
||
const name = e.group.charAt(0).toUpperCase() + e.group.slice(1);
|
||
wrap.appendChild(createPill(`${name} ${e.start}-${e.end}`, bg, fg));
|
||
});
|
||
cell.appendChild(wrap);
|
||
}
|
||
|
||
const root = document.getElementById('cal-root');
|
||
const title = document.querySelector('.cal-title');
|
||
const btnPrev = document.querySelector('.cal-prev');
|
||
const btnNext = document.querySelector('.cal-next');
|
||
|
||
let view = new Date(); // hoy
|
||
view.setDate(1); // primer día del mes
|
||
|
||
function buildCalendar(date){
|
||
root.innerHTML = '';
|
||
|
||
const year = date.getFullYear();
|
||
const month = date.getMonth();
|
||
title.textContent = monthNames[month] + ' ' + year;
|
||
|
||
// semanas empiezan en lunes
|
||
const first = new Date(year, month, 1);
|
||
let startIndex = (first.getDay() + 6) % 7;
|
||
const daysInMonth= new Date(year, month + 1, 0).getDate();
|
||
|
||
// localizar viernes del mes
|
||
const fridays = [];
|
||
for (let d = 1; d <= daysInMonth; d++){
|
||
const wd = (new Date(year, month, d).getDay() + 6) % 7;
|
||
if (wd === 4) fridays.push(d);
|
||
}
|
||
const secondFri = fridays[1]; // 2º viernes
|
||
|
||
// cabecera
|
||
const head = document.createElement('div');
|
||
head.className = 'cal-row cal-head';
|
||
weekdayNames.forEach(w => {
|
||
const cell = document.createElement('div');
|
||
cell.className = 'cal-cell cal-head-cell';
|
||
cell.textContent = w;
|
||
head.appendChild(cell);
|
||
});
|
||
root.appendChild(head);
|
||
|
||
// grid 6x7
|
||
let day = 1 - startIndex;
|
||
for (let r = 0; r < 6; r++){
|
||
const row = document.createElement('div');
|
||
row.className = 'cal-row';
|
||
for (let c = 0; c < 7; c++){
|
||
const cell = document.createElement('div');
|
||
cell.className = 'cal-cell';
|
||
|
||
if (day >= 1 && day <= daysInMonth){
|
||
const num = document.createElement('span');
|
||
num.className = 'cal-daynum';
|
||
num.textContent = day;
|
||
cell.appendChild(num);
|
||
|
||
const wd = (new Date(year, month, day).getDay() + 6) % 7; // lunes=0
|
||
|
||
if (wd === 4){
|
||
// VIERNES: por defecto en blanco
|
||
// 2º viernes -> ART-LAB (neón + rosa)
|
||
// 1º/3º/4º/5º -> HACKLAB (neón + negro)
|
||
const wrap = document.createElement('div');
|
||
wrap.className = 'cal-pills';
|
||
if (day === secondFri){
|
||
wrap.appendChild(createPill('ART-LAB', '#39FF14', '#ff00aa'));
|
||
} else {
|
||
wrap.appendChild(createPill('HACKLAB', '#39FF14', '#000'));
|
||
}
|
||
cell.appendChild(wrap);
|
||
} else {
|
||
// Resto: semanales normales con sus colores
|
||
renderWeeklyPills(cell, wd);
|
||
}
|
||
} else {
|
||
cell.classList.add('cal-empty');
|
||
}
|
||
|
||
row.appendChild(cell);
|
||
day++;
|
||
}
|
||
root.appendChild(row);
|
||
}
|
||
}
|
||
|
||
function shiftMonth(delta){
|
||
view.setMonth(view.getMonth() + delta);
|
||
buildCalendar(view);
|
||
}
|
||
|
||
btnPrev.addEventListener('click', () => shiftMonth(-1));
|
||
btnNext.addEventListener('click', () => shiftMonth(1));
|
||
|
||
buildCalendar(view);
|
||
})();
|
||
</script>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
</section>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<section id="ovt">
|
||
<h2> Colectivo de Vivienda</h2>
|
||
<p>Asamblea abierta desde donde defendemos que la vivienda es para quien la habita y no un negocio.</p>
|
||
<button <a href="https://okupanel.laenre.net">Twitter</button>
|
||
</section>
|
||
|
||
<section id="yoga">
|
||
<h2> Colectivo de Yoga</h2>
|
||
<p>Sesiones abiertas y gratuitas de yoga, meditación y respiración consciente. Espacio de bienestar colectivo.</p>
|
||
</section>
|
||
|
||
<section id="feminismos">
|
||
<h2> Feminismos</h2>
|
||
<p>Organizamos talleres, círculos de lectura y encuentros de autodefensa. Un espacio para el debate y la acción feminista autónoma.</p>
|
||
</section>
|
||
|
||
<section id="fridays">
|
||
<h2>Fridays for Future</h2>
|
||
<p>Movilización climática juvenil, asambleas abiertas y acciones directas para la justicia ambiental y el decrecimiento.</p>
|
||
</section>
|
||
|
||
|
||
<section id="hacklab">
|
||
<h2> Hacklab</h2>
|
||
<p>Espacio de tecnología libre, hacking ético y ciberseguridad. Nos reunimos semanalmente para compartir conocimientos sobre privacidad digital, redes descentralizadas y criptografía.</p>
|
||
<button onclick=https://hacklab.laenre.net>hacklab.laenre.net</button>
|
||
</section>
|
||
|
||
<section id="musica_andina">
|
||
<h2>🎶Colectivo de Música Andina</h2>
|
||
<p>Preservamos y difundimos la música tradicional andina como herramienta de resistencia cultural.</p>
|
||
<button onclick="window.location.href='/archivos/musica_andina.pdf'">📥 Descargar Cancionero</button>
|
||
</section>
|
||
|
||
<section id="tatus">
|
||
<h2>🖋️Tatus circus</h2>
|
||
<p>Tatuajes artesanales con simbología política, tribal y de resistencia callejera.</p>
|
||
<button onclick="window.location.href='/archivos/tatus_warrix.pdf'">📥 Descargar Portafolio</button>
|
||
</section>
|
||
|
||
<section id="artistico">
|
||
<h2> Colectivo Artístico</h2>
|
||
<p>Muralismo, arte urbano, intervenciones visuales y talleres de creación colaborativa.</p>
|
||
<button onclick="window.location.href='/archivos/artistico.pdf'">📥 Descargar Dossier</button>
|
||
</section>
|
||
|
||
<section id="bicilab">
|
||
<h2>BICILAB</h2>
|
||
<p>Bocata de espaguetis todos los domingos a las 17:00 nos engrasamos las manos y recuperamos tu bicicleta!</p>
|
||
<button onclick="window.location.href='/archivos/asamblea.pdf'">📥 Descargar Actas</button>
|
||
</section>
|
||
|
||
<section id="biblioteca">
|
||
<h2>📚 Biblioteca Libre</h2>
|
||
<p>Accede a libros, fanzines y documentos sobre activismo, agroecología, tecnología libre y feminismos.</p>
|
||
<button onclick="window.location.href='/archivos/biblioteca.pdf'">Mas información</button>
|
||
</section>
|
||
|
||
<footer>
|
||
<p>📩 Contacto: <a href="mailto:enredadera@riseup.net">enredadera@riseup.net</a></p>
|
||
<p>📌 Plaza de la Resistencia, Local 3, Madrid</p>
|
||
<p>⚡ Mastodon: <a href="https://mastodon.social/@laenre">@laenre@mastodon.social</a></p>
|
||
</footer>
|
||
</main>
|
||
</div>
|
||
</body>
|
||
</html>
|