From 3f92474bdd5608ad34b2c3e721cfeb5ebf60fdae Mon Sep 17 00:00:00 2001 From: Michal Vanko Date: Thu, 31 Oct 2024 19:22:57 +0100 Subject: [PATCH] animated logo --- justfile | 1 + src/main.rs | 1 + src/pages/animated_logo.rs | 10 +++++ src/pages/mod.rs | 1 + src/router.rs | 11 ++--- styles/output.css | 48 +++++--------------- templates/assets/animated_logo.html | 69 +++++++++++++++++++++++++++++ templates/icons/m-logo-animated.svg | 3 ++ 8 files changed, 103 insertions(+), 41 deletions(-) create mode 100644 src/pages/animated_logo.rs create mode 100644 templates/assets/animated_logo.html diff --git a/justfile b/justfile index f22ff69..ceef702 100644 --- a/justfile +++ b/justfile @@ -53,6 +53,7 @@ clean: ssg: - wget --no-convert-links -r -p -E -P dist --no-host-directories 127.0.0.1:{{port}} - wget --no-convert-links --content-on-error -p -E -P dist --no-host-directories 127.0.0.1:{{port}}/not-found + - wget --no-convert-links -p -E -P dist --no-host-directories 127.0.0.1:{{port}}/showcase/m-logo-svg find generated_images/ -name "*_og*" -exec cp --parents {} dist/ \; # Preview server diff --git a/src/main.rs b/src/main.rs index af7cbc2..9229724 100644 --- a/src/main.rs +++ b/src/main.rs @@ -58,3 +58,4 @@ async fn main() { // // TODO view page transitions // TODO cookbook +// TODO remove m-logo-svg from justfile and mention it in some article!!! WRITE SOME NEW ARTICLES diff --git a/src/pages/animated_logo.rs b/src/pages/animated_logo.rs new file mode 100644 index 0000000..2030333 --- /dev/null +++ b/src/pages/animated_logo.rs @@ -0,0 +1,10 @@ +use askama::Template; +use axum::http::StatusCode; + +#[derive(Template)] +#[template(path = "assets/animated_logo.html")] +pub struct AnimatedLogoTemplate {} + +pub async fn render_animated_logo() -> Result { + Ok(AnimatedLogoTemplate {}) +} diff --git a/src/pages/mod.rs b/src/pages/mod.rs index e6ed224..9638b1a 100644 --- a/src/pages/mod.rs +++ b/src/pages/mod.rs @@ -1,4 +1,5 @@ pub mod admin; +pub mod animated_logo; pub mod blog_post_list; pub mod blog_post_page; pub mod broadcast_list; diff --git a/src/router.rs b/src/router.rs index 5102306..92b893c 100644 --- a/src/router.rs +++ b/src/router.rs @@ -1,11 +1,11 @@ use crate::{ feed::render_rss_feed, pages::{ - admin::render_admin, blog_post_list::render_blog_post_list, - blog_post_page::render_blog_post, broadcast_list::render_broadcast_post_list, - contact::render_contact, index::render_index, not_found::render_not_found, - portfolio::render_portfolio, project_list::render_projects_list, - showcase::egg_fetcher::render_egg_fetcher, + admin::render_admin, animated_logo::render_animated_logo, + blog_post_list::render_blog_post_list, blog_post_page::render_blog_post, + broadcast_list::render_broadcast_post_list, contact::render_contact, index::render_index, + not_found::render_not_found, portfolio::render_portfolio, + project_list::render_projects_list, showcase::egg_fetcher::render_egg_fetcher, }, }; use axum::{extract::MatchedPath, http::Request, routing::get, Router}; @@ -23,6 +23,7 @@ pub fn get_router() -> Router { .route("/broadcasts/:post_id", get(render_blog_post)) .route("/contact", get(render_contact)) .route("/showcase", get(render_projects_list)) + .route("/showcase/m-logo-svg", get(render_animated_logo)) .route("/showcase/:project_slug", get(render_egg_fetcher)) .route("/portfolio", get(render_portfolio)) .route("/admin", get(render_admin)) diff --git a/styles/output.css b/styles/output.css index 09ddf96..ef13ae8 100644 --- a/styles/output.css +++ b/styles/output.css @@ -620,6 +620,10 @@ video { size-adjust: 92%; } +.visible { + visibility: visible; +} + .col-span-2 { grid-column: span 2 / span 2; } @@ -632,10 +636,6 @@ video { float: inline-start; } -.float-right { - float: right; -} - .clear-both { clear: both; } @@ -644,6 +644,10 @@ video { margin: 0.25rem; } +.m-10 { + margin: 2.5rem; +} + .m-4 { margin: 1rem; } @@ -656,10 +660,6 @@ video { margin: 1.5rem; } -.m-10 { - margin: 2.5rem; -} - .mx-0\.5 { margin-left: 0.125rem; margin-right: 0.125rem; @@ -796,18 +796,14 @@ video { height: 240px; } -.h-auto { - height: auto; -} - -.h-\[256px\] { - height: 256px; -} - .h-\[320px\] { height: 320px; } +.h-auto { + height: auto; +} + .max-h-\[236px\] { max-height: 236px; } @@ -832,10 +828,6 @@ video { width: 180px; } -.w-\[256px\] { - width: 256px; -} - .w-\[320px\] { width: 320px; } @@ -882,22 +874,10 @@ video { break-inside: avoid; } -.auto-cols-auto { - grid-auto-columns: auto; -} - .grid-flow-row { grid-auto-flow: row; } -.grid-cols-2 { - grid-template-columns: repeat(2, minmax(0, 1fr)); -} - -.grid-cols-\[1fr_auto\] { - grid-template-columns: 1fr auto; -} - .flex-row { flex-direction: row; } @@ -2068,10 +2048,6 @@ article a:visited { grid-template-columns: max-content 1fr; } - .sm\:grid-cols-\[1fr_auto\] { - grid-template-columns: 1fr auto; - } - .sm\:grid-rows-\[max-content_1fr_max-content\] { grid-template-rows: max-content 1fr max-content; } diff --git a/templates/assets/animated_logo.html b/templates/assets/animated_logo.html new file mode 100644 index 0000000..a2fd1bb --- /dev/null +++ b/templates/assets/animated_logo.html @@ -0,0 +1,69 @@ + {% include "icons/m-logo-animated.svg" %} + + diff --git a/templates/icons/m-logo-animated.svg b/templates/icons/m-logo-animated.svg index 3dda299..a0f645f 100644 --- a/templates/icons/m-logo-animated.svg +++ b/templates/icons/m-logo-animated.svg @@ -11,6 +11,7 @@ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns="http://www.w3.org/2000/svg" + visibility="hidden" xmlns:svg="http://www.w3.org/2000/svg"> @@ -57,11 +58,13 @@ stroke="#32a8eb" stroke-width="8" stroke-linejoin="round" + visibility="hidden" sodipodi:nodetypes="csc" />