diff --git a/index.css b/index.css index b65be1a..1ce46e2 100644 --- a/index.css +++ b/index.css @@ -11,8 +11,8 @@ } :root{ - --sidebar-w: 250px; - --sidebar-rail: 56px; + --sidebar-w: 210px; /* reducido de 250px */ + --sidebar-rail: 48px; /* “Impact” consistente: Anton (Google) + fallback a Impact */ --impact: 'Anton', Impact, Haettenschweiler, 'Arial Black', sans-serif; @@ -144,12 +144,12 @@ body { main { - margin-left: var(--sidebar-w); - transition: margin-left .25s ease; - flex-grow: 1; - padding: 0px 0px; - text-align: center; - font-size: 0.9em; + margin-left: var(--sidebar-w); + transition: margin-left .25s ease; + flex-grow: 1; + padding: 0 16px 0 20px; /* 20px izquierda para separar del sidebar */ + text-align: center; + font-size: 0.9em; } header { @@ -166,9 +166,9 @@ header h1 { .top-nav a, .top-nav.second a { - font-family: 'Rock Salt'; - letter-spacing: 3px; - font-size: 0.5em; + font-family: Impact, 'Anton', sans-serif; + letter-spacing: 1.5px; + font-size: 0.9rem; /* rem absoluto, no hereda nada */ } @@ -199,12 +199,12 @@ header h1 { .top-nav ul { list-style: none; - padding: 0; + padding: 8px 10px; margin: 0; display: flex; - flex-wrap: wrap; /* Permite que haya varias filas si no caben */ + flex-wrap: wrap; justify-content: center; - gap: 5px; /* Espacio entre enlaces */ + gap: 6px 8px; } .top-nav li { @@ -215,43 +215,33 @@ header h1 { text-decoration: none; background-color: white; color: black; - font-weight: bold; - padding: 15px 15px; - border-radius: 20px; - transition: background 0.3s, color 0.3s; - font-size: 0.5em; + font-weight: 900; + padding: 6px 13px; + border-radius: 18px; + border: 2px solid transparent; display: inline-block; + text-transform: uppercase; + transition: color .15s, border-color .15s, box-shadow .15s; } .top-nav a:hover { - background: white; color: #ff00aa; - text-decoration: none; - background-color: white; - border: 2px solid #ff00aa; - box-shadow: 4px 8px black; - border-radius: 12px; - padding: clamp(20px, 2vw, 24px); - text-align: center; - user-select: none; - - transition: transform .18s ease, box-shadow .18s ease, background .18s ease; - + border-color: #ff00aa; + box-shadow: 2px 3px 0 #ff00aa; } /* Secciones del index: fondo blanco, borde rosa, texto negro */ section{ - background: #fff; /* fondo blanco */ - color: #111; /* texto negro */ - padding: 18px 20px; - padding-left: 50px; - margin: 16px auto; - max-width: 6mv; - border: 2px solid #ff00aa; /* borde rosa */ + background: #fff; + color: #111; + padding: 14px 18px; + margin: 10px auto; + max-width: 100%; + border: 2px solid #ff00aa; border-radius: 12px; - box-shadow: 0 6px 18px rgba(0,0,0,.08); + box-shadow: 0 4px 14px rgba(0,0,0,.07); line-height: 1.6; -} +} section#feminismos{ padding-left: 16px; @@ -391,166 +381,172 @@ button:hover { ̣ /* ====== CALENDARIO ====== */ -.cal { - display: grid; - gap: 8px; - background: #FFFFFF; - border: 1px solid rgba(0,255,255,0.18); - border-radius: 12px; - padding: 10px; - box-shadow: 0 0 20px rgba(0,255,255,0.05); + +/* Botones prev / next */ +.button { + background: #000; + color: #ff00aa; + border: 2px solid #ff00aa; + border-radius: 8px; + padding: 5px 14px; + font-size: 1rem; + font-weight: bold; + font-family: inherit; + cursor: pointer; + transition: background .15s, color .15s, transform .1s; + line-height: 1; +} +.button:hover { + background: #ff00aa; + color: #000; + transform: scale(1.08); } -.cal-controls{ +.cal-controls { display: flex; align-items: center; justify-content: center; - gap: 10px; - margin: 6px 0 12px; -} -.cal-title{ - min-width: 300px; - text-align: center; - font-weight: bold; - color: pink; - text-shadow: 0 0 8px rgba(0,255,255,0.25); + gap: 12px; + margin: 6px 0 10px; } -.cal-row{ - display: grid; - grid-template-columns: repeat(7, minmax(0,1fr)); - gap: 8px; +.cal-title { + min-width: 180px; + text-align: center; + font-weight: bold; + font-size: 0.9rem; + color: #ff00aa; + letter-spacing: 2px; + text-transform: uppercase; } -.cal-cell{ - position: relative; - background: #FFFFFF; - border: 1px solid rgba(255,0,171,1); /* líneas rosas */ - border-radius: 8px; - min-height: 90px; + +/* Grid: sin gap, bordes como líneas internas */ +.cal { + background: #fff; + border: 2px solid #ff00aa; + border-radius: 12px; overflow: hidden; - padding-top:28px; + box-shadow: 0 4px 18px rgba(255,0,170,.15); } -.cal-head{ - opacity: 0.9; + +.cal-row { + display: grid; + grid-template-columns: repeat(7, 1fr); + border-bottom: 1px solid rgba(255,0,170,.15); } -.cal-head-cell{ - background: #FFFFFFF - border: 1px solid rgba(255,0,171,1); +.cal-row:last-child { border-bottom: none; } + +/* Cabecera días */ +.cal-head { background: #000; } + +.cal-head-cell { + background: #000; + color: #ff00aa; text-align: center; font-weight: bold; - padding: 8px 0; - border: 1px solid rgba(255,0,171,1); -} -.cal-daynum{ - position: absolute; - top: 6px; left: 20px; - font-size: 1.2rem; - color: var(--muted); - z-index: 2; -} -.cal-empty{ - background: ; - border-style: dashed; - opacity: 0.5; + font-size: 0.78rem; + padding: 8px 2px; + border-right: 1px solid rgba(255,0,170,.2); } +.cal-head-cell:last-child { border-right: none; } -/* celdas con evento: fondo con imagen + overlay oscuro */ -.cal-event{ - background: ; -} -.cal-event::before{ - content: ""; - position: absolute; inset: 0; - background-image: var(--bgimg); - background-size: cover; - background-position: center; - filter: contrast(1.05) saturate(1.05); - opacity: 0.9; - transition: transform .25s ease, opacity .2s ease; -} -.cal-event::after{ - content: ""; - position: absolute; inset: 0; - background: linear-gradient(180deg, rgba(0,0,0,0.22), rgba(0,0,0,0.6)); - pointer-events: none; -} -.cal-event .cal-label{ - position: absolute; - left: 8px; bottom: 16px; - z-index: 2; - display: inline-block; - background: var(--green); - color: #000; - border: 1px solid #0f0; - padding: 4px 8px; - border-radius: 6px; - font-weight: 700; - box-shadow: 0 0 8px rgba(0,255,0,0.35); -} - -.cal-event:hover::before{ - transform: scale(1.04); - opacity: 1; -} - -/* badge leyenda */ -.cal-legend{ - margin-top: 10px; - color: var(--muted); -} -.badge{ - display: inline-block; - border: 1px solid rgba(0,255,0,0.5); - color: var(--green); - padding: 2px 6px; - border-radius: 6px; - margin-right: 6px; -} - -/* --- Corrección de typo existente --- */ -.cal-head-cell{ - background: #FFFFFF; /* antes tenías #FFFFFFF */ - border: 1px solid rgba(255,0,171,1); - text-align: center; - font-weight: bold; - padding: 8px 0; -} - -/* --- Ajustes de celda para que quepan las tiras --- */ -.cal-cell{ - min-height: 110px; /* un poco más alta */ - padding-top: 22px; /* deja hueco al número del día */ -} - -/* Contenedor vertical de tiras */ -.cal-pills{ +/* Celda de día */ +.cal-cell { position: relative; - z-index: 3; /* por encima de ::before/::after */ + background: #fff; + border-right: 1px solid rgba(255,0,170,.1); + min-height: 68px; + padding: 20px 3px 3px; + overflow: hidden; +} +.cal-cell:last-child { border-right: none; } + +/* Fin de semana: fondo levemente rosado */ +.cal-cell:nth-child(6), +.cal-cell:nth-child(7) { background: #fff6fc; } + +/* HOY */ +.cal-today { + background: #fff0f8 !important; + box-shadow: inset 0 0 0 2px #ff00aa; +} + +.cal-daynum { + position: absolute; + top: 3px; + left: 5px; + font-size: 0.88rem; + font-weight: bold; + color: #444; + z-index: 2; +} + +.cal-today .cal-daynum { + background: #ff00aa; + color: #fff; + border-radius: 50%; + width: 22px; + height: 22px; + display: flex; + align-items: center; + justify-content: center; + font-size: 0.72rem; + top: 2px; + left: 2px; +} + +.cal-empty { + background: #f5f5f5 !important; + opacity: .5; +} + +/* Pills */ +.cal-pills { display: flex; flex-direction: column; - gap: 7px; - margin-top: 15px; + gap: 2px; + margin-top: 1px; } -/* Tira (pill) de cada colectivo */ -.cal-pill{ +.cal-pill { background: var(--bg); color: var(--fg); - border: 1px solid rgba(0,0,0,.15); - border-radius: 6px; - padding: 3px 6px; + border-radius: 4px; + padding: 2px 5px; + font-size: 12px; font-weight: 700; - font-size: 16px; - line-height: 1.1; - box-shadow: 0 0 6px rgba(0,0,0,.06); + line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; + border: 1px solid rgba(0,0,0,.08); + cursor: pointer; +} +.cal-pill:hover { + filter: brightness(1.08); } -.cal-pill:hover{ - filter: brightness(1.05); - box-shadow: 0 0 10px rgba(0,0,0,.12); +/* Leyenda */ +.cal-legend { + display: flex; + flex-wrap: wrap; + gap: 5px 14px; + margin: 10px 0 2px; + justify-content: center; +} +.cal-legend-item { + display: flex; + align-items: center; + gap: 5px; + font-size: 0.55rem; + font-family: var(--impact); +} +.cal-legend-dot { + width: 11px; + height: 11px; + border-radius: 3px; + flex-shrink: 0; + border: 1px solid rgba(0,0,0,.12); } @@ -594,15 +590,18 @@ button:hover { } .top-nav a, .top-nav.second a, .top-nav2 a{ display:inline-block; - padding:5px 9px; /* más pequeño */ - font-size:.8em; /* más pequeño */ + padding:5px 10px; + font-size:.8rem; + font-family: Impact, 'Anton', sans-serif; + letter-spacing: 1px; + text-transform: uppercase; line-height:1.1; - border:1px solid #ff00aa; - border-radius:16px; /* un poco más compacto */ + border:2px solid transparent; + border-radius:16px; background:#fff; color:#000; text-decoration:none; - white-space:nowrap; /* evita que se partan dentro del botón */ + white-space:nowrap; } /* Secciones y contenido */ @@ -612,14 +611,18 @@ button:hover { button{ font-size:.9em; padding:8px 12px; } footer{ font-size:.85em; padding:14px 0; } - /* ====== CALENDARIO (sin scroll lateral) ====== */ - .cal{ width:100%; padding:8px; gap:4px; border-radius:10px; } - .cal-row{ display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); gap:4px; } - .cal-cell{ min-height:56px; padding-top:18px; } - .cal-daynum{ font-size:1rem; top:6px; left:6px; z-index:2; } - .cal-pills{ gap:7px; margin-top:6px; } - .cal-pill{ font-size:.72rem; padding:2px 4px; line-height:1.3; } - .cal-head .cal-head-cell{ padding:6px 0; font-size:1.1rem; } + /* ====== CALENDARIO móvil ====== */ + .cal{ border-radius:8px; } + .cal-row{ grid-template-columns:repeat(7, minmax(0,1fr)); } + .cal-cell{ min-height:52px; padding:17px 2px 2px; } + .cal-daynum{ font-size:.65rem; top:2px; left:3px; } + .cal-today .cal-daynum{ width:16px; height:16px; font-size:.55rem; } + .cal-pills{ gap:1px; margin-top:0; } + .cal-pill{ font-size:7px; padding:1px 2px; border-radius:3px; } + .cal-head-cell{ padding:6px 1px; font-size:.7rem; } + .cal-title{ font-size:.75rem; min-width:140px; } + .cal-legend{ gap:3px 8px; } + .cal-legend-item{ font-size:.5rem; } } @@ -662,8 +665,10 @@ button:hover { } .top-nav li, .top-nav.second li{ list-style:none; } .top-nav a, .top-nav.second a, .top-nav2 a{ - display:block; padding:8px 12px; font-size:.95em; - border:1px solid #ff00aa; border-radius:20px; + display:inline-block; padding:7px 13px; font-size:.88rem; + font-family: Impact, 'Anton', sans-serif; + text-transform: uppercase; letter-spacing: 1px; + border:2px solid transparent; border-radius:18px; background:#fff; color:#000; text-decoration:none; } @@ -673,14 +678,15 @@ button:hover { button{ font-size:1em; padding:10px 16px; } footer{ font-size:.95em; padding:16px 0; } - /* Calendario fluido (sin scroll lateral) */ - .cal{ width:100%; padding:10px; gap:6px; border-radius:12px; } - .cal-row{ grid-template-columns:repeat(7, minmax(0,1fr)); gap:6px; } - .cal-cell{ min-height:70px; padding-top:20px; } - .cal-daynum{ font-size:1rem; top:6px; left:8px; z-index:2; } - .cal-pills{ gap:5px; margin-top:8px; } - .cal-pill{ font-size:4px; padding:3px 5px; } - .cal-head .cal-head-cell{ padding:8px 0; font-size:1rem; } + /* Calendario tablet vertical */ + .cal{ border-radius:10px; } + .cal-row{ grid-template-columns:repeat(7, minmax(0,1fr)); } + .cal-cell{ min-height:64px; padding:20px 3px 3px; } + .cal-daynum{ font-size:.72rem; top:3px; left:5px; } + .cal-today .cal-daynum{ width:18px; height:18px; font-size:.6rem; } + .cal-pills{ gap:2px; margin-top:1px; } + .cal-pill{ font-size:8.5px; padding:1px 3px; } + .cal-head-cell{ padding:7px 1px; font-size:.75rem; } } /* ========== TABLETS HORIZONTALES / PORTÁTILES PEQUEÑOS (769px–1024px) ========== */ @@ -707,19 +713,24 @@ button:hover { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; padding:0; } .top-nav li, .top-nav.second li{ list-style:none; } - .top-nav a, .top-nav.second a{ font-size:1em; padding:10px 15px; } + .top-nav a, .top-nav.second a{ + font-size:.9rem; padding:6px 13px; + font-family: Impact, 'Anton', sans-serif; + text-transform: uppercase; letter-spacing:1px; + } section{ padding:20px; max-width:90%; margin:12px auto; } button{ font-size:1em; padding:12px 22px; } footer{ font-size:1em; padding:22px; } - /* Calendario (compacto, sin desbordes) */ - .cal{ width:100%; padding:10px; gap:6px; border-radius:12px; } - .cal-row{ grid-template-columns:repeat(7, minmax(0,1fr)); gap:6px; } - .cal-cell{ min-height:84px; padding-top:22px; } - .cal-daynum{ font-size:2rem; } - .cal-pills{ margin-top:8px; gap:6px; } - .cal-pill{ font-size:4px; } + /* Calendario tablet horizontal */ + .cal{ border-radius:10px; } + .cal-row{ grid-template-columns:repeat(7, minmax(0,1fr)); } + .cal-cell{ min-height:72px; padding:21px 3px 3px; } + .cal-daynum{ font-size:.76rem; top:3px; left:5px; } + .cal-today .cal-daynum{ width:18px; height:18px; font-size:.62rem; } + .cal-pills{ margin-top:1px; gap:2px; } + .cal-pill{ font-size:9px; padding:2px 4px; } } diff --git a/index.html b/index.html index 45660b8..a6e576f 100644 --- a/index.html +++ b/index.html @@ -1,4 +1,3 @@ - @@ -9,409 +8,354 @@ - - -
-
- - NI DIOS NI AMO, NI PATRIA NI ESTADO -0-> - -
+ + +
-
- - OKUPA RESISTE 1312 <3 - -
+
+ + NI DIOS NI AMO, NI PATRIA NI ESTADO -0-> + +
- - -
-
-

CSO LA ENREDADERA DE TETUÁN

- -
- + - -
-

Calendario

-
- -
- -
+ +
+

Calendario

-
- -
+
+ +
+ +
+ +
+
+
+
+

Feminismos

+

Feminismo Tetuán es una asamblea de barrio que nace a raíz del movimiento del 8M.

+ + + Feminismos Tetuán + + + LinkTree + Instagram + +

Es una asamblea abierta no mixta transinclusiva. Nos reunimos los jueves a las 20 en el CSO La Enredadera.

+

Uno de los temas que más trabajamos es el derecho a la libre intervención del embarazo, ya que en nuestro barrio se encuentra la clínica Dator, la primera clínica en realizar abortos en España.

+
+
+

Fridays for Future

+

Somos parte del movimiento global juvenil por la Justicia Climática.

-
+ + Fridays for Future Madrid + + + Fridays for Future Madrid + -
-

Feminismos

- -

- Feminismo Tetuán es una asamblea de barrio que nace a raíz - del movimiento del 8M. -

+ LinkTree + Instagram +
+
+

Colectivo de Vivienda

+

Asamblea abierta desde donde defendemos que la vivienda es para quien la habita y no un negocio.

- - Feminismos Tetuán - + + Organización Vivienda Tetuán + + Instagram +
- - LinkTree - - - - Instagram - - -

- Es una asamblea abierta no mixta transinclusiva. -
- Nos reunimos los jueves a las 20 en el CSO La Enredadera, - donde organizamos acciones, debates. -

- -

- Uno de los temas que más trabajamos es el derecho a la libre - intervención del embarazo, ya que en nuestro barrio se encuentra la clínica - Dator, la primera clínica en realizar abortos en España. Esta clínica está - bajo el ataque constant> -

- -

- También realizamos debates y otras acciones, como salir a la plaza una vez al - mes para visibilizar las violencias que sufren las mujeres en la sociedad - patriarcal, o debates sobre temas como la pronografía, la prostitución, etc. -

- -

- Queremos mantener viva la lucha contra la sociedad patriarcal - y lo vemos como algo muy necesario en el momento actual, en el que la extrema - derecha está atacando los derechos de las mujeres y personas trans. De ahí - que sigamos con nues> -

-
+
+

Circo

+

Información próximamente.

+
-
-

Fridays for Future

-

Somos parte del movimiento global juvenil por la Justicia Climática.

+
+

Hacklab

+ + Hacklab La Raíz + + + + + hacklab.laenre.net +
- - Fridays for Future Madrid - - - Fridays for Future Madrid - +
+

Tienda Gratis

+

Información próximamente.

+
- - LinkTree - - - Instagram - -
+
+

Biblioteca Libre

+

Accede a libros, fanzines y documentos sobre activismo, agroecología, tecnología libre y feminismos.

+ Mas información +
-
-

Colectivo de Vivienda

-

Asamblea abierta desde donde defendemos que la vivienda es para quien la habita y no un negocio.

- - Organización Vivienda Tetuán - +
+

Warawas

+

Información próximamente.

+
- - Instagram - -
-
-

Circo

-

Información próximamente.

-
+
+

Hongos

+

Información próximamente.

+
-
-

Hacklab

- - - +
+

Fermentos

+

Información próximamente.

+
- - - - - hacklab.laenre.net - -
+
+

BICILAB

+

Bocata de espaguetis todos los domingos a las 17:00 nos engrasamos las manos y recuperamos tu bicicleta!

+ Descargar Actas +
-
-

Tienda Gratis

-

Información próximamente.

-
-
-

Biblioteca Libre

-

Accede a libros, fanzines y documentos sobre activismo, agroecología, tecnología libre y feminismos.

+ +
- - Mas información - - - -
-

Warawas

-

Información próximamente.

-
- -
-

Hongos

-

Información próximamente.

-
- -
-

Fermentos

-

Información próximamente.

-
- -
-

BICILAB

-

Bocata de espaguetis todos los domingos a las 17:00 nos engrasamos las manos y recuperamos tu bicicleta!

- - - Descargar Actas - -
- - - -
+