From da99f4ebb038a65262a95bca46274e1a32392049 Mon Sep 17 00:00:00 2001 From: WriterV2 Date: Tue, 12 May 2026 17:39:17 +0200 Subject: Add language filter for stories --- src/page.rs | 2 +- src/story.rs | 66 +++++++++++++++++++++++++++++++++++++++++++++++++++++++----- 2 files changed, 62 insertions(+), 6 deletions(-) diff --git a/src/page.rs b/src/page.rs index 6774a1b..7449f46 100644 --- a/src/page.rs +++ b/src/page.rs @@ -19,7 +19,7 @@ pub trait Page: Sized { fn logo_svg(height_px: f32) -> Markup { html!( - svg xmlns="http://www.w3.org/2000/svg" width=(height_px * 0.707_070_7) height=(height_px) viewBox="0 0 210 297" { + svg role="img" title="V2 Tales Logo" alt="V2 Tales Logo" xmlns="http://www.w3.org/2000/svg" width=(height_px * 0.707_070_7) height=(height_px) viewBox="0 0 210 297" { path d="m143.17 118.01 19.018 30.905-33.758-.951zM66.41 118.01 47.39 148.915l33.758-.951z" style="opacity:.5;fill:#000;fill-opacity:1;stroke:#000;stroke-width:5.76727" transform="matrix(1.081 0 0 1.081 -10.214 -40)"{} path d="M193.13 62.963s.92 3.455 0 4.74c-3.708 5.173-13.105 2.168-18.081 6.136-24.12 19.233-36.92 50.23-48.505 78.822-10.285 25.384-17.792 80.217-17.792 80.217h-6.274s-9.022-55.018-19.557-80.566c-11.655-28.264-24.145-58.718-47.478-78.473-4.225-3.577-12.324-1.556-15.432-6.136-.887-1.308 0-4.74 0-4.74" aria-label="V" style="font-size:251.905px;font-family:"Liberation Serif";-inkscape-font-specification:"Liberation Serif";opacity:1;fill:none;fill-opacity:1;stroke:#000;stroke-width:4.62538498;stroke-dasharray:none" transform="matrix(1.081 0 0 1.081 -10.214 -40)"{} path d="M35.723 73.988h135.413v75.733H35.723v86.553h135.413" style="opacity:1;fill:none;fill-opacity:1;stroke:#000;stroke-width:4.62538498;stroke-dasharray:none" transform="matrix(1.081 0 0 1.081 -10.214 -40)"{} diff --git a/src/story.rs b/src/story.rs index c5371ee..716b4ae 100644 --- a/src/story.rs +++ b/src/story.rs @@ -1,6 +1,6 @@ use crate::page; use anyhow::Result; -use maud::{html, Markup}; +use maud::{html, Markup, PreEscaped}; use serde::Deserialize; use toml::value::Date; @@ -11,8 +11,24 @@ impl page::Page for Vec { fn render_content(&self) -> Markup { html!( - @for story in self { - (story.render_as_card()) + section class="stories" { + div class="stories-filter" { + label for="all" { + input type="radio" id="all" name="language" checked; + "All" + } + label for="de" { + input type="radio" id="de" name="language"; + "German" + } + label for="en" { + input type="radio" id="en" name="language"; + "English" + } + } + @for story in self { + (story.render_as_card()) + } } ) } @@ -31,7 +47,8 @@ impl page::Page for Vec { fn content_style() -> Markup { html!( - """ + (PreEscaped( + r#" h2 { font-size: 1.8rem; margin-bottom: 2rem; @@ -88,7 +105,46 @@ hr { width: fit-content; } } - """ + +.stories:has(input:checked) .story-card { + display: none; +} + +.stories:has(#all:checked) .story-card, +.stories:has(#de:checked) .story-card[lang="de"], +.stories:has(#en:checked) .story-card[lang="en"] { + display: block; +} + +.stories-filter { + display: flex; + align-items: center; + border: .1rem dotted #000; + margin: 3rem; + width: fit-content; + border:.1rem dotted #000; + label { + margin: 0.8rem; + padding: .8rem; + } + input { + margin-right: 0.5rem; + appearance: none; + } + + label:hover { + cursor: pointer; + color: #11396A; + } + + label:has(input:checked) { + color: #FFD1A3; + background-color: #11396A; + #background-color: #2F3C57; + } +} +"# + )) ) } } -- cgit v1.2.3