cloverta/SanYeCao-blog
1
0
Fork 0
mirror of https://github.com/ClovertaTheTrilobita/SanYeCao-blog.git synced 2026-07-03 15:41:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

update post nav format

Browse source
This commit is contained in:
ClovertaTheTrilobita 2026-04-18 21:46:01 +03:00
parent 804bfbd080
commit d9ae38197c
1 changed files with 17 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
src/components/Posts/PostNav.astro
View file

@ -43,7 +43,7 @@ const nextSlug = nextPost ? getSlugFromId(nextPost.id) : null;
---
<nav class="post-nav" aria-label="Post navigation">
<div class="post-nav-item post-nav-next">
<div class="post-nav-item post-nav-prev">
{
nextPost && nextSlug && (
<a href={`/${lang}/posts/${nextSlug}/`}>
@ -56,7 +56,7 @@ const nextSlug = nextPost ? getSlugFromId(nextPost.id) : null;
}
</div>
<div class="post-nav-item post-nav-prev">
<div class="post-nav-item post-nav-next">
{
prevPost && prevSlug && (
<a href={`/${lang}/posts/${prevSlug}/`}>
@ -77,21 +77,23 @@ const nextSlug = nextPost ? getSlugFromId(nextPost.id) : null;
gap: 1rem;
margin-top: 3rem;
padding-top: 1.5rem;
padding-bottom: 1.5rem;
border-top: 1px dashed rgba(128, 128, 128, 0.5);
border-bottom: 1px dashed rgba(128, 128, 128, 0.5);
}
.post-nav-item {
min-width: 0;
}
.post-nav-prev {
.post-nav-next {
text-align: right;
}
.post-nav a {
display: block;
text-decoration: none;
color: inherit;
/* color: inherit; */
}
.post-nav-label {
@ -99,6 +101,7 @@ const nextSlug = nextPost ? getSlugFromId(nextPost.id) : null;
font-size: 0.9rem;
opacity: 0.65;
margin-bottom: 0.35rem;
color: black;
}
.post-nav-title {
@ -106,4 +109,14 @@ const nextSlug = nextPost ? getSlugFromId(nextPost.id) : null;
font-size: 1rem;
line-height: 1.5;
}
@media (max-width: 768px) {
.post-nav {
grid-template-columns: 1fr;
}
.post-nav-next {
text-align: right;
}
}
</style>