From 18ea64fb134007f7f3b43e7e006fd7239b817889 Mon Sep 17 00:00:00 2001
From: Vardamir <antoniocepas@gmail.com>
Date: Sun, 3 May 2026 18:39:38 +0200
Subject: [PATCH] Recuperar ajustes locales tras actualizar rama e2026

---
 frontend/src/app.scss                       |  73 ++++++++--
 frontend/src/routes/venue-info/+page.svelte | 145 ++++++++++++++++++--
 package-lock.json                           |   6 +
 3 files changed, 194 insertions(+), 30 deletions(-)
 create mode 100644 package-lock.json

diff --git a/frontend/src/app.scss b/frontend/src/app.scss
index 5b047db..01c2e4a 100644
--- a/frontend/src/app.scss
+++ b/frontend/src/app.scss
@@ -1,7 +1,6 @@
 @use 'sass:map';
 @use 'design-system/typographies.scss';
 
-
 // Theme configuration is done by giving value to Bulma variables
 // https://bulma.io/documentation/customize/concepts/
 
@@ -152,7 +151,7 @@ body {
 	// background-position: top;
 	// background-size: cover;
 	min-height: 100vh;
-	font-family: 'Lora', sans-serif;
+	font-family: $font-family-secondary;
 }
 
 .container-all {
@@ -165,18 +164,18 @@ body {
 	left: 0;
 	background-color: #cceaf5;
 	width: 100vw !important;
-	margin-left: calc(-50vw + 50%) !important; 
+	margin-left: calc(-50vw + 50%) !important;
 	transition: transform 0.1s ease-in-out;
 	padding: 2rem 0;
-	font-family: 'Cinzel', sans-serif;
+	font-family: $font-family-primary;
 	&-item {
 		font-weight: 600;
 		color: $color-primary;
-		padding-left: 1.5rem !important; 
-    	padding-right: 1.5rem !important;
+		padding-left: 1.5rem !important;
+		padding-right: 1.5rem !important;
 		&:hover {
 			background-color: #43b2dc !important;
-			color: $color-white !important; 
+			color: $color-white !important;
 			border-radius: 30px !important;
 		}
 
@@ -186,10 +185,24 @@ body {
 		}
 
 		&.brand {
-			// FIXME
 			@include mixins.desktop {
 				padding: 0;
 				transform: scale(1.2);
+				transform-origin: left center;
+			}
+		}
+
+		.brand-home-label {
+			font-family: $font-family-primary;
+			font-size: 1em;
+			font-weight: 600;
+			line-height: inherit;
+			color: inherit;
+			white-space: nowrap;
+
+			@include mixins.desktop {
+				transform: scale(0.8333);
+				transform-origin: left center;
 			}
 		}
 	}
@@ -201,13 +214,15 @@ body {
 	&-right {
 		width: 100%;
 		justify-content: flex-end;
-	padding-right: 5rem;
+		padding-right: 5rem;
 	}
+
 	&-left {
 		width: 100%;
 		justify-content: flex-start;
-	padding-left: 5rem;
+		padding-left: 5rem;
 	}
+
 	&-burger {
 		color: $color-primary;
 		&:hover {
@@ -230,7 +245,7 @@ body {
 		background-size: cover;
 	}
 
-    .hero-body {
+	.hero-body {
 		padding: 8rem 4rem;
 		@include mixins.mobile {
 			padding: 3rem 2rem;
@@ -292,9 +307,9 @@ footer {
 	background-image: linear-gradient(to right, $color-dark, $color-dark);
 	color: $color-white;
 	width: 100vw !important;
-    margin-left: calc(-50vw + 50%) !important;
-    position: relative;
-    left: 0;
+	margin-left: calc(-50vw + 50%) !important;
+	position: relative;
+	left: 0;
 	a {
 		color: $color-white;
 	}
@@ -391,6 +406,31 @@ footer {
 	}
 }
 
+.content {
+	ul {
+		list-style: none;
+		padding-left: 0;
+		margin-left: 0;
+	}
+
+	ul li {
+		position: relative;
+		padding-left: 1.4rem;
+		margin-bottom: 0.75rem;
+		line-height: 1.65;
+	}
+
+	ul li::before {
+		content: '✦';
+		position: absolute;
+		left: 0;
+		top: 0.05rem;
+		color: #b06b2d;
+		font-size: 0.9rem;
+		line-height: 1.65;
+	}
+}
+
 .content-location {
 	h4 {
 		margin-top: 3rem;
@@ -481,4 +521,7 @@ footer {
 		margin-bottom: 0.625rem;
 	}
 }
-@import 'https://fonts.googleapis.com/css?family=Vollkorn:400,700';
+
+@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600;700&display=swap');
+/* @import 'https://fonts.googleapis.com/css?family=Vollkorn:400,700'; */
diff --git a/frontend/src/routes/venue-info/+page.svelte b/frontend/src/routes/venue-info/+page.svelte
index 64f7269..4849554 100644
--- a/frontend/src/routes/venue-info/+page.svelte
+++ b/frontend/src/routes/venue-info/+page.svelte
@@ -1,21 +1,136 @@
 <script lang="ts">
-  import SvelteMarkdown from '@humanspeak/svelte-markdown'
-  import * as m from '$lib/paraglide/messages.js'
-  let { data } = $props();
+	import SvelteMarkdown from '@humanspeak/svelte-markdown';
+	import * as m from '$lib/paraglide/messages.js';
+	let { data } = $props();
 </script>
+
 <section class="hero page-title">
-  <h3 class="title">{data.title || m.venue_info()}</h3>
+	<h3 class="title">{data.title || m.venue_info()}</h3>
 </section>
 <section class="section">
-    <div class="container">
-        <div class="content content-border">
-          <div class="columns">
-            <div class="column is-five-fifths">
-              {#if data.content}
-              <SvelteMarkdown options={{mangle: false}} source={data.content}/>
-              {/if}
-            </div>
-          </div>
-        </div>
-    </div>
+	<div class="container">
+		<div class="content content-border">
+			<div class="columns">
+				<div class="column is-five-fifths">
+					{#if data.content}
+						<div class="strapi-markdown venue-markdown">
+							<SvelteMarkdown options={{ mangle: false }} source={data.content} />
+						</div>
+					{/if}
+				</div>
+			</div>
+		</div>
+	</div>
 </section>
+
+<style>
+	:global(.venue-markdown) {
+		max-width: 1100px;
+		margin: 0 auto;
+	}
+
+	:global(.venue-markdown p) {
+		font-size: clamp(1.05rem, 1.8vw, 1.45rem);
+		line-height: 1.65;
+		margin: 1.5rem 0;
+	}
+
+	:global(.venue-markdown strong) {
+		font-weight: 700;
+		color: #0d3b44;
+	}
+
+	/* Galería automática para párrafos Markdown que contienen imágenes */
+	:global(.venue-markdown p:has(img)) {
+		display: grid;
+		grid-template-columns: repeat(2, minmax(0, 1fr));
+		gap: 1.5rem;
+		margin: 2.5rem 0;
+		padding: 1rem;
+		border-radius: 1.5rem;
+		background: linear-gradient(135deg, rgba(204, 234, 245, 0.65), rgba(255, 255, 255, 0.92));
+		box-shadow: 0 18px 45px rgba(13, 59, 68, 0.12);
+	}
+
+	:global(.venue-markdown p:has(img) img) {
+		width: 100%;
+		height: 320px;
+		object-fit: cover;
+		display: block;
+		border-radius: 1rem;
+		box-shadow: 0 10px 25px rgba(13, 59, 68, 0.18);
+		transition:
+			transform 0.25s ease,
+			box-shadow 0.25s ease,
+			filter 0.25s ease;
+	}
+
+	/* Efecto tipo postal */
+	:global(.venue-markdown p:has(img) img:first-child) {
+		transform: rotate(-1.2deg);
+	}
+
+	:global(.venue-markdown p:has(img) img:nth-child(2)) {
+		transform: rotate(1.2deg);
+	}
+
+	:global(.venue-markdown p:has(img) img:hover) {
+		transform: rotate(0deg) translateY(-4px) scale(1.02);
+		box-shadow: 0 18px 35px rgba(13, 59, 68, 0.26);
+		filter: saturate(1.08);
+	}
+
+	/* Separador elegante después de la galería */
+	:global(.venue-markdown p:has(img) + p) {
+		margin-top: 2rem;
+		padding-top: 1.5rem;
+	}
+
+	/* Ajuste para imágenes sueltas, si alguna vez pones solo una */
+	:global(.venue-markdown p:has(img) img:only-child) {
+		grid-column: 1 / -1;
+		max-width: 760px;
+		margin: 0 auto;
+	}
+
+	@media screen and (max-width: 768px) {
+		:global(.venue-markdown) {
+			max-width: 100%;
+		}
+
+		:global(.venue-markdown p) {
+			font-size: 1.05rem;
+			line-height: 1.6;
+			margin: 1.25rem 0;
+		}
+
+		:global(.venue-markdown p:has(img)) {
+			grid-template-columns: 1fr;
+			gap: 1rem;
+			padding: 0.75rem;
+			margin: 1.75rem 0;
+			border-radius: 1.25rem;
+			box-shadow: 0 12px 28px rgba(13, 59, 68, 0.12);
+		}
+
+		:global(.venue-markdown p:has(img) img),
+		:global(.venue-markdown p:has(img) img:first-child),
+		:global(.venue-markdown p:has(img) img:nth-child(2)) {
+			width: 100%;
+			height: auto;
+			max-height: none;
+			transform: none;
+			border-radius: 0.9rem;
+		}
+
+		:global(.venue-markdown p:has(img) img:hover) {
+			transform: none;
+			box-shadow: 0 10px 25px rgba(13, 59, 68, 0.18);
+		}
+
+		:global(.venue-markdown p:has(img) + p) {
+			margin-top: 1.5rem;
+			padding-top: 1.25rem;
+		}
+	}
+</style>
diff --git a/package-lock.json b/package-lock.json
new file mode 100644
index 0000000..bf7077f
--- /dev/null
+++ b/package-lock.json
@@ -0,0 +1,6 @@
+{
+  "name": "e2026-main",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {}
+}