From e45f516598951278ec2fb071c51bdd0afe49a416 Mon Sep 17 00:00:00 2001
From: skyeto <mail@skyeto.com>
Date: Fri, 12 Jan 2024 13:34:48 +0100
Subject: [PATCH] Fixed transitions and blend modes in Chrome

---
 src/layouts/Layout.astro | 2 +-
 src/layouts/Post.astro   | 2 +-
 src/pages/index.astro    | 4 ++--
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index a54531b..fbf120c 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -52,7 +52,7 @@ const { title, description, pubDate } = Astro.props;
     </div>
 
 
-    <span class="bg-blend-luminosity mix-blend-luminosity">
+    <span class="">
     <slot />
     </span>
 
diff --git a/src/layouts/Post.astro b/src/layouts/Post.astro
index f186d4e..60e5e2d 100644
--- a/src/layouts/Post.astro
+++ b/src/layouts/Post.astro
@@ -10,8 +10,8 @@ const { frontmatter } = Astro.props;
     description={frontmatter.description}
     pubDate={frontmatter.pubDate}>
   <Navbar />
+    <h1 class="px-[2rem] container justify-center gap-2 bg-blend-luminosity mix-blend-luminosity" transition:name="title">{ frontmatter.title }</h1>
   <article class="container justify-center gap-2 text-base" transition:name="content">
-    <h1 transition:name="title">{ frontmatter.title }</h1>
     <p class="pubdate">published { frontmatter.pubDate.slice(0, 10) }</p>
     <p class="ingress">{ frontmatter.description }</p>
     <slot />
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 4d9d9cc..cea0cb8 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -12,8 +12,8 @@ const posts = await Astro.glob("./p/*.{md,mdx}");
 
   <Navbar />
 
-  <main class="container justify-center" transition:name="content" transition:type="slide">
-    <h1 transition:name="title">hi there!</h1>
+    <h1 transition:name="title" transition:animate="fade" class="px-[2rem] container justify-center gap-2 bg-blend-luminosity mix-blend-luminosity">hi there!</h1>
+  <main class="container justify-center gap-2 text-base" transition:name="content">
     <p>I'm <span class="italic">/skaɪ-tuː/</span>. This blog is mostly a rambly collection of posts on different topics.</p>
 
     <p>