mirror of
https://github.com/reonokiy/blog.nokiy.net.git
synced 2025-06-17 12:01:33 +02:00
fix: view transition error with title
- Add `data-disable-transition-on-theme` to post titles and dates - Improve view transition handling for theme changes - Ensure consistent transition behavior across post list and individual post pages
This commit is contained in:
parent
c63eaa3792
commit
14f53a979a
2 changed files with 7 additions and 1 deletions
|
@ -41,6 +41,7 @@ const postsByYear = await getPostsByYear()
|
||||||
class="hover:c-primary"
|
class="hover:c-primary"
|
||||||
href={`/posts/${post.data.slug || post.slug}`}
|
href={`/posts/${post.data.slug || post.slug}`}
|
||||||
transition:name={`post-${post.data.slug || post.slug}`}
|
transition:name={`post-${post.data.slug || post.slug}`}
|
||||||
|
data-disable-transition-on-theme
|
||||||
>
|
>
|
||||||
{post.data.title}
|
{post.data.title}
|
||||||
</a>
|
</a>
|
||||||
|
@ -48,6 +49,7 @@ const postsByYear = await getPostsByYear()
|
||||||
<div
|
<div
|
||||||
class="mb-9 block text-5.6 leading-11 font-time lg:ml-4 lg:inline"
|
class="mb-9 block text-5.6 leading-11 font-time lg:ml-4 lg:inline"
|
||||||
transition:name={`time-${post.data.slug || post.slug}`}
|
transition:name={`time-${post.data.slug || post.slug}`}
|
||||||
|
data-disable-transition-on-theme
|
||||||
>
|
>
|
||||||
<time>
|
<time>
|
||||||
{post.data.published.toLocaleDateString('zh-CN', { year: 'numeric', month: '2-digit', day: '2-digit' }).replace(/\//g, '-')}
|
{post.data.published.toLocaleDateString('zh-CN', { year: 'numeric', month: '2-digit', day: '2-digit' }).replace(/\//g, '-')}
|
||||||
|
|
|
@ -26,7 +26,10 @@ const { Content, remarkPluginFrontmatter } = await post.render()
|
||||||
>
|
>
|
||||||
<article class="heti">
|
<article class="heti">
|
||||||
<h1 class="post-title">
|
<h1 class="post-title">
|
||||||
<span transition:name={`post-${post.data.slug || post.slug}`}>
|
<span
|
||||||
|
transition:name={`post-${post.data.slug || post.slug}`}
|
||||||
|
data-disable-transition-on-theme
|
||||||
|
>
|
||||||
{post.data.title}
|
{post.data.title}
|
||||||
</span>
|
</span>
|
||||||
</h1>
|
</h1>
|
||||||
|
@ -34,6 +37,7 @@ const { Content, remarkPluginFrontmatter } = await post.render()
|
||||||
<div
|
<div
|
||||||
class="mb-23.4 block c-primary font-time"
|
class="mb-23.4 block c-primary font-time"
|
||||||
transition:name={`time-${post.data.slug || post.slug}`}
|
transition:name={`time-${post.data.slug || post.slug}`}
|
||||||
|
data-disable-transition-on-theme
|
||||||
>
|
>
|
||||||
<time>
|
<time>
|
||||||
{post.data.published.toLocaleDateString('zh-CN', { year: 'numeric', month: '2-digit', day: '2-digit' }).replace(/\//g, '-')}
|
{post.data.published.toLocaleDateString('zh-CN', { year: 'numeric', month: '2-digit', day: '2-digit' }).replace(/\//g, '-')}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue