feat: festival cine barato

eerii · Mar 22, 2024 · a12440d · a12440d
1 parent 2b38a25
commit a12440d
Show file tree

Hide file tree

Showing 7 changed files with 136 additions and 38 deletions.
diff --git a/assets/style/custom.css b/assets/style/custom.css
@@ -23,10 +23,6 @@
     border-color: var(--accent);
 }
 
-.tarxeta:not(.tarxeta:last-of-type) {
-    margin-bottom: var(--spacing);
-}
-
 /* TODO: Efecto brillo bordes */
 
 /* Paragrafos */

diff --git a/src/routes.rs b/src/routes.rs
@@ -55,6 +55,10 @@ pub fn router() -> Router {
     Router::new()
         .route("/", get(paxinas::inicio))
         .route("/sobre_nos", get(paxinas::sobre_nos))
+        .route(
+            "/cine_barato",
+            get(paxinas::cine_barato),
+        )
         .route("/peliculas", get(paxinas::peliculas))
         .route("/blog", get(blog::lista_blog))
         .route(

diff --git a/src/routes/paxinas.rs b/src/routes/paxinas.rs
@@ -22,6 +22,14 @@ pub async fn sobre_nos() -> TemplateSobreNos {
     TemplateSobreNos {}
 }
 
+#[derive(Template)]
+#[template(path = "paxinas/cine_barato.html")]
+pub struct TemplateCineBarato;
+
+pub async fn cine_barato() -> TemplateCineBarato {
+    TemplateCineBarato {}
+}
+
 #[derive(Template)]
 #[template(path = "paxinas/peliculas.html")]
 pub struct TemplatePeliculas;

diff --git a/templates/componentes/lista_peliculas.html b/templates/componentes/lista_peliculas.html
@@ -12,7 +12,6 @@
         this > div {
             width: 250px;
             flex-direction: column;
-            margin-bottom: var(--spacing);
         }
 
         this h4 {

diff --git a/templates/componentes/novidades.html b/templates/componentes/novidades.html
@@ -1,21 +1,55 @@
 <!-- Podedes engadir máis bloques aquí -->
 
 <div id="novidades">
+    <h2>Festival Cine Barato</h2>
+    <style>
+        this > div {
+            cursor: pointer;
+        }
+        this > div > div {
+            flex-basis: fit-content;
+        }
+        this img:hover {
+            transform: scale(1.1);
+            filter: drop-shadow(var(--radius) var(--radius) 10px black);
+        }
+    </style>
+    <div class="tarxeta" onclick="window.location.href='/cine_barato'">
+        <div>
+            <p>
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
+                eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
+                enim ad minim veniam, quis nostrud exercitation ullamco laboris
+                nisi ut aliquip ex ea commodo consequat.
+            </p>
+        </div>
+        <img
+            src="/assets/posters/sen-portada.webp"
+            width="200"
+            alt="Festival Cine Barato"
+        />
+    </div>
+
     <h2>Fanzine</h2>
-    <div class="tarxeta">
-        <style>
-            this img:hover {
-                transform: scale(1.1);
-                filter: drop-shadow(var(--radius) var(--radius) 10px black);
-            }
-        </style>
+    <div
+        class="tarxeta"
+        onclick="window.open('https://raw.githubusercontent.com/eerii/cinemazarelos/main/assets/fanzines/fanzine_2122.pdf', '_blank')"
+    >
+        <img
+            src="/assets/fanzines/fanzine_2122.webp"
+            width="200"
+            alt="Primeiro fanzine"
+        />
         <div>
-            <p>Estamos moi emocionades de, por fin, poder compartir un pequeno adianto do que é o Fanzine do noso ciclo
-                de cine!</p>
-            <p>Poderedes atopar unha portada chulísima, os cartaces do ciclo do ano pasado e unha recopilación de textos
-                escritos poles presentadores dos filmes!</p>
+            <p>
+                Estamos moi emocionades de, por fin, poder compartir un pequeno
+                adianto do que é o Fanzine do noso ciclo de cine!
+            </p>
+            <p>
+                Poderedes atopar unha portada chulísima, os cartaces do ciclo do
+                ano pasado e unha recopilación de textos escritos poles
+                presentadores dos filmes!
+            </p>
         </div>
-        <a href="https://raw.githubusercontent.com/eerii/cinemazarelos/main/assets/fanzines/fanzine_2122.pdf"
-            target="_blank"><img src="/assets/fanzines/fanzine_2122.webp" width="250" alt="Primeiro fanzine" /></a>
     </div>
 </div>
diff --git a/templates/nav.html b/templates/nav.html
@@ -9,7 +9,6 @@
 
             padding: 0 calc(var(--spacing) * 2);
 
-            animation-name: escurecer_fondo;
             animation-timeline: scroll(root);
             animation-timing-function: linear;
         }
@@ -22,6 +21,8 @@
 
             height: var(--nav-height);
             border-bottom: 1px solid var(--bg-lighter);
+            background-color: var(--bg-darker);
+            z-index: 30;
         }
 
         this span {
@@ -66,13 +67,18 @@
             scale: 1.05;
         }
 
-        @keyframes escurecer_fondo {
+        this #banner {
+            position: fixed;
+            top: calc(var(--spacing) * 0.5);
+            width: 20rem;
+            left: calc(50% - 10rem);
 
-            40%,
-            to {
-                background-color: var(--bg);
-                backdrop-filter: blur(0.5rem);
-            }
+            background-color: var(--fg);
+            color: var(--bg);
+            text-align: center;
+
+            padding: calc(var(--spacing) * 0.75);
+            border-radius: calc(var(--radius) * 2);
         }
 
         @keyframes logo_hover {
@@ -97,21 +103,46 @@ <h1>CineMa<span id="alt">zarelos</span></h1>
         <a href="/peliculas">Películas</a>
         <a href="/blog">Blog</a>
         <a href="/sobre_nos">Sobre nós</a>
-        <a href="https://www.instagram.com/cinemazarelos" target="_blank" aria-label="Instagram">
-            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-brand-instagram" width="24"
-                height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
-                stroke-linecap="round" stroke-linejoin="round">
+        <a
+            href="https://www.instagram.com/cinemazarelos"
+            target="_blank"
+            aria-label="Instagram"
+        >
+            <svg
+                xmlns="http://www.w3.org/2000/svg"
+                class="icon icon-tabler icon-tabler-brand-instagram"
+                width="24"
+                height="24"
+                viewBox="0 0 24 24"
+                stroke-width="2"
+                stroke="currentColor"
+                fill="none"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+            >
                 <path stroke="none" d="M0 0h24v24H0z" fill="none" />
                 <rect x="4" y="4" width="16" height="16" rx="4" />
                 <circle cx="12" cy="12" r="3" />
                 <line x1="16.5" y1="7.5" x2="16.5" y2="7.501" />
             </svg>
         </a>
-        <a href="https://www.filmaffinity.com/es/userreviews.php?user_id=5661081" target="_blank"
-            aria-label="Filmaffinity">
-            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-brand-instagram" width="24"
-                height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
-                stroke-linecap="round" stroke-linejoin="round">
+        <a
+            href="https://www.filmaffinity.com/es/userreviews.php?user_id=5661081"
+            target="_blank"
+            aria-label="Filmaffinity"
+        >
+            <svg
+                xmlns="http://www.w3.org/2000/svg"
+                class="icon icon-tabler icon-tabler-brand-instagram"
+                width="24"
+                height="24"
+                viewBox="0 0 24 24"
+                stroke-width="2"
+                stroke="currentColor"
+                fill="none"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+            >
                 <path stroke="none" d="M0 0h24v24H0z" fill="none" />
                 <rect x="4" y="4" width="16" height="16" rx="2" />
                 <line x1="8" y1="4" x2="8" y2="20" />
@@ -123,10 +154,23 @@ <h1>CineMa<span id="alt">zarelos</span></h1>
                 <line x1="16" y1="16" x2="20" y2="16" />
             </svg>
         </a>
-        <a href="https://letterboxd.com/cinemazarelos" target="_blank" aria-label="Letterboxd">
-            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-brand-instagram" width="24"
-                height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
-                stroke-linecap="round" stroke-linejoin="round">
+        <a
+            href="https://letterboxd.com/cinemazarelos"
+            target="_blank"
+            aria-label="Letterboxd"
+        >
+            <svg
+                xmlns="http://www.w3.org/2000/svg"
+                class="icon icon-tabler icon-tabler-brand-instagram"
+                width="24"
+                height="24"
+                viewBox="0 0 24 24"
+                stroke-width="2"
+                stroke="currentColor"
+                fill="none"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+            >
                 <g transform="matrix(1,0,0,1,0.28094,0.108175)">
                     <circle cx="5.254" cy="11.892" r="4.395" />
                 </g>
@@ -138,5 +182,6 @@ <h1>CineMa<span id="alt">zarelos</span></h1>
                 </g>
             </svg>
         </a>
+        <a id="banner" href="/cine_barato">Descubre o festival Cine Barato</a>
     </div>
 </div>
diff --git a/templates/paxinas/cine_barato.html b/templates/paxinas/cine_barato.html
@@ -0,0 +1,12 @@
+{% extends "base.html" %}
+
+<!-- -->
+
+{% block content %}
+<h1>Cine barato</h1>
+<div class="paragrafos">
+    <p>
+        En construcción...
+    </p>
+</div>
+{% endblock %}