diff --git a/components/Post.tsx b/components/Post.tsx index ecbc155..5fae92f 100644 --- a/components/Post.tsx +++ b/components/Post.tsx @@ -4,20 +4,28 @@ import styles from "styles/Posts.module.sass"; import { useTheme } from "next-themes"; import Date from "./Date"; -const Post = ({ title, date, tag }) => { +const Post = ({ title, date, tag, slug }) => { const { resolvedTheme: theme } = useTheme(); return ( <> -
-
-

{title}

-

- -

-
- {tag ?

{tag}

: undefined} -
+ + +
+
+

{title}

+

+ +

+
+ {tag ? ( +

+ {tag} +

+ ) : undefined} +
+
+ ); }; diff --git a/posts/second-post.mdx b/posts/second-post.mdx index 6a331da..65002d5 100644 --- a/posts/second-post.mdx +++ b/posts/second-post.mdx @@ -17,4 +17,8 @@ You should ask yourself: "Can I pre-render this page **ahead** of a user's reque On the other hand, Static Generation is **not** a good idea if you cannot pre-render a page ahead of a user's request. Maybe your page shows frequently updated data, and the page content changes on every request. -In that case, you can use **Server-Side Rendering**. It will be slower, but the pre-rendered page will always be up-to-date. Or you can skip pre-rendering and use client-side JavaScript to populate data. \ No newline at end of file +In that case, you can use **Server-Side Rendering**. It will be slower, but the pre-rendered page will always be up-to-date. Or you can skip pre-rendering and use client-side JavaScript to populate data. + +```js +const uwu = "owo"; +``` diff --git a/styles/Posts.module.sass b/styles/Posts.module.sass index f248054..0e8830c 100644 --- a/styles/Posts.module.sass +++ b/styles/Posts.module.sass @@ -2,6 +2,8 @@ .post display: flex + padding-top: .3rem + padding-bottom: .3rem align-items: center transition: all .2s background: $background-dark-buttons @@ -46,3 +48,6 @@ display: grid gap: .5rem grid-template-columns: 1 + +.link + cursor: pointer