From 1a0eaf2dcb4aaf917f3f34140e38c00732d1167f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Moritz=20H=C3=B6lting?= <87192362+moritz-hoelting@users.noreply.github.com> Date: Sat, 21 Mar 2026 18:56:09 +0100 Subject: [PATCH] make everything noscript compatible as best as possible --- public/js/animate.js | 12 ---- src/components/ArrowCard.tsx | 17 ++--- src/components/BaseHead.astro | 9 --- src/components/Blog.tsx | 65 ++++++++++-------- src/components/Header.astro | 5 +- src/components/Projects.tsx | 67 ++++++++++--------- .../DynamicDoomsdayYearSelector.astro | 17 ++--- src/content/blog/doomsday-algorithm/index.mdx | 5 ++ src/styles/global.css | 17 +++-- 9 files changed, 106 insertions(+), 108 deletions(-) delete mode 100644 public/js/animate.js diff --git a/public/js/animate.js b/public/js/animate.js deleted file mode 100644 index b0715c8..0000000 --- a/public/js/animate.js +++ /dev/null @@ -1,12 +0,0 @@ -function animate() { - const animateElements = document.querySelectorAll('.animate') - - animateElements.forEach((element, index) => { - setTimeout(() => { - element.classList.add('show') - }, index * 150) - }); -} - -document.addEventListener("DOMContentLoaded", animate) -document.addEventListener("astro:after-swap", animate) \ No newline at end of file diff --git a/src/components/ArrowCard.tsx b/src/components/ArrowCard.tsx index 380b2f7..495fa43 100644 --- a/src/components/ArrowCard.tsx +++ b/src/components/ArrowCard.tsx @@ -1,7 +1,6 @@ - import type { CollectionEntry } from "astro:content"; import { formatDate } from "@/lib/utils"; -import { Icon } from '@iconify-icon/solid'; +import { Icon } from "@iconify-icon/solid"; type Props = { entry: CollectionEntry<"blog"> | CollectionEntry<"projects">; @@ -31,13 +30,11 @@ export default function ArrowCard({ entry, pill }: Props) {
{entry.data.summary}
@@ -56,4 +53,4 @@ export default function ArrowCard({ entry, pill }: Props) {
); -} \ No newline at end of file +} diff --git a/src/components/BaseHead.astro b/src/components/BaseHead.astro index fd9eb09..fc6a6fe 100644 --- a/src/components/BaseHead.astro +++ b/src/components/BaseHead.astro @@ -82,7 +82,6 @@ const { title, description, image = "/open-graph.jpg" } = Astro.props; - @@ -107,11 +106,3 @@ const { title, description, image = "/open-graph.jpg" } = Astro.props; integrity="sha384-m7LqaUc4JRc2uA7D4zSVUs/sgkYhmOOe9+Gd8DFmmAXH8vzs15fmw05YXvpxsoQB" crossorigin="anonymous" /> - - diff --git a/src/components/Blog.tsx b/src/components/Blog.tsx index 4090c9e..462fc3c 100644 --- a/src/components/Blog.tsx +++ b/src/components/Blog.tsx @@ -10,20 +10,23 @@ type Props = { }; export default function Blog({ data, tags }: Props) { + function filterPosts(): CollectionEntry<"blog">[] { + return data.filter((entry) => + Array.from(filter()).every((value) => + entry.data.tags.some( + (tag: string) => + tag.toLowerCase() === String(value).toLowerCase(), + ), + ), + ); + } + const [filter, setFilter] = createSignal(new Set()); - const [posts, setPosts] = createSignal[]>([]); + const [posts, setPosts] = + createSignal[]>(filterPosts()); createEffect(() => { - setPosts( - data.filter((entry) => - Array.from(filter()).every((value) => - entry.data.tags.some( - (tag: string) => - tag.toLowerCase() === String(value).toLowerCase() - ) - ) - ) - ); + setPosts(filterPosts()); }); function toggleTag(tag: string) { @@ -32,14 +35,14 @@ export default function Blog({ data, tags }: Props) { new Set( prev.has(tag) ? [...prev].filter((t) => t !== tag) - : [...prev, tag] - ) + : [...prev, tag], + ), ); } return ( -
-
+
+
Filter @@ -58,21 +61,27 @@ export default function Blog({ data, tags }: Props) { "hover:bg-black/10 hover:dark:bg-white/15", "transition-colors duration-300 ease-in-out", filter().has(tag) && - "text-black dark:text-white" + "text-black dark:text-white", )} > -
+
- +
{tag} @@ -105,4 +114,4 @@ export default function Blog({ data, tags }: Props) {
); -} \ No newline at end of file +} diff --git a/src/components/Header.astro b/src/components/Header.astro index 15258d8..e5a581f 100644 --- a/src/components/Header.astro +++ b/src/components/Header.astro @@ -11,7 +11,10 @@ const { pathname } = Astro.url; const subpath = pathname.match(/[^/]+/g); --- -