Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix link error #17

Merged
merged 1 commit into from
Oct 19, 2023
Merged

fix link error #17

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion components/CustomLink.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import Link from 'next/link';
export default function CustomLink({ as, href, ...otherProps }) {
return (
<>
<Link as={as} href={href}>
<Link legacyBehavior as={as} href={href}>
<a {...otherProps} />
</Link>
</>
Expand Down
2 changes: 1 addition & 1 deletion components/Header.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ export default function Header({ name }) {
<header className="pt-20 pb-12">
<div className="w-12 h-12 rounded-full block mx-auto mb-4 bg-gradient-conic from-gradient-3 to-gradient-4" />
<p className="text-2xl dark:text-white text-center">
<Link href="/">
<Link legacyBehavior href="/">
<a>{name}</a>
</Link>
</p>
Expand Down
27 changes: 13 additions & 14 deletions pages/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,21 +26,20 @@ export default function Index({ posts, globalData }) {
<Link
as={`/posts/${post.filePath.replace(/\.mdx?$/, '')}`}
href={`/posts/[slug]`}
className="py-6 lg:py-10 px-6 lg:px-16 block focus:outline-none focus:ring-4"
>
<a className="py-6 lg:py-10 px-6 lg:px-16 block focus:outline-none focus:ring-4">
{post.data.date && (
<p className="uppercase mb-3 font-bold opacity-60">
{post.data.date}
</p>
)}
<h2 className="text-2xl md:text-3xl">{post.data.title}</h2>
{post.data.description && (
<p className="mt-3 text-lg opacity-60">
{post.data.description}
</p>
)}
<ArrowIcon className="mt-4" />
</a>
{post.data.date && (
<p className="uppercase mb-3 font-bold opacity-60">
{post.data.date}
</p>
)}
<h2 className="text-2xl md:text-3xl">{post.data.title}</h2>
{post.data.description && (
<p className="mt-3 text-lg opacity-60">
{post.data.description}
</p>
)}
<ArrowIcon className="mt-4" />
</Link>
</li>
))}
Expand Down
36 changes: 16 additions & 20 deletions pages/posts/[slug].js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -58,29 +58,25 @@ export default function PostPage({
</main>
<div className="grid md:grid-cols-2 lg:-mx-24 mt-12">
{prevPost && (
<Link href={`/posts/${prevPost.slug}`}>
<a className="py-8 px-10 text-center md:text-right first:rounded-t-lg md:first:rounded-tr-none md:first:rounded-l-lg last:rounded-r-lg first last:rounded-b-lg backdrop-blur-lg bg-white dark:bg-black dark:bg-opacity-30 bg-opacity-10 hover:bg-opacity-20 dark:hover:bg-opacity-50 transition border border-gray-800 dark:border-white border-opacity-10 dark:border-opacity-10 last:border-t md:border-r-0 md:last:border-r md:last:rounded-r-none flex flex-col">
<p className="uppercase text-gray-500 mb-4 dark:text-white dark:opacity-60">
Previous
</p>
<h4 className="text-2xl text-gray-700 mb-6 dark:text-white">
{prevPost.title}
</h4>
<ArrowIcon className="transform rotate-180 mx-auto md:mr-0 mt-auto" />
</a>
<Link href={`/posts/${prevPost.slug}`} className="py-8 px-10 text-center md:text-right first:rounded-t-lg md:first:rounded-tr-none md:first:rounded-l-lg last:rounded-r-lg first last:rounded-b-lg backdrop-blur-lg bg-white dark:bg-black dark:bg-opacity-30 bg-opacity-10 hover:bg-opacity-20 dark:hover:bg-opacity-50 transition border border-gray-800 dark:border-white border-opacity-10 dark:border-opacity-10 last:border-t md:border-r-0 md:last:border-r md:last:rounded-r-none flex flex-col">
<p className="uppercase text-gray-500 mb-4 dark:text-white dark:opacity-60">
Previous
</p>
<h4 className="text-2xl text-gray-700 mb-6 dark:text-white">
{prevPost.title}
</h4>
<ArrowIcon className="transform rotate-180 mx-auto md:mr-0 mt-auto" />
</Link>
)}
{nextPost && (
<Link href={`/posts/${nextPost.slug}`}>
<a className="py-8 px-10 text-center md:text-left md:first:rounded-t-lg last:rounded-b-lg first:rounded-l-lg md:last:rounded-bl-none md:last:rounded-r-lg backdrop-blur-lg bg-white dark:bg-black dark:bg-opacity-30 bg-opacity-10 hover:bg-opacity-20 dark:hover:bg-opacity-50 transition border border-gray-800 dark:border-white border-opacity-10 dark:border-opacity-10 border-t-0 first:border-t first:rounded-t-lg md:border-t border-b-0 last:border-b flex flex-col">
<p className="uppercase text-gray-500 mb-4 dark:text-white dark:opacity-60">
Next
</p>
<h4 className="text-2xl text-gray-700 mb-6 dark:text-white">
{nextPost.title}
</h4>
<ArrowIcon className="mt-auto mx-auto md:ml-0" />
</a>
<Link href={`/posts/${nextPost.slug}`} className="py-8 px-10 text-center md:text-left md:first:rounded-t-lg last:rounded-b-lg first:rounded-l-lg md:last:rounded-bl-none md:last:rounded-r-lg backdrop-blur-lg bg-white dark:bg-black dark:bg-opacity-30 bg-opacity-10 hover:bg-opacity-20 dark:hover:bg-opacity-50 transition border border-gray-800 dark:border-white border-opacity-10 dark:border-opacity-10 border-t-0 first:border-t first:rounded-t-lg md:border-t border-b-0 last:border-b flex flex-col">
<p className="uppercase text-gray-500 mb-4 dark:text-white dark:opacity-60">
Next
</p>
<h4 className="text-2xl text-gray-700 mb-6 dark:text-white">
{nextPost.title}
</h4>
<ArrowIcon className="mt-auto mx-auto md:ml-0" />
</Link>
)}
</div>
Expand Down