- added date section

- support description (in meta og)
- added tags section
This commit is contained in:
bluestar_ 2023-12-28 02:51:09 +07:00
parent 253efd97a1
commit 98429455db
5 changed files with 39 additions and 15 deletions

View file

@ -1,2 +1,3 @@
# About me version 2 :3
I had no much to say here, however.... >33333

View file

@ -1,13 +1,16 @@
---
title: "Goodbye fusemeow.me, Hello blueskychan.dev"
desc: Hello world!
date: "28/12/2023"
tags:
- new home
- new stuff
---
### Move on from fusemeow.me to blueskychan.dev
Now i just move on from fusemeow.me to blueskychan.dev, here is why:
- 1. Performance:
Because old blueskychan website (aka fusemeow.me) is kinda use gif image to animated background and it make some devices like older phones/potato devices can crash easily, it why we move on!
- 2. Design:
@ -20,4 +23,5 @@ The old one is hosted on github pages, but due to this version use next.js, now
Also Thanks you for all support! :3
Credit: @bluestar.owo (Helper)
- Last updated: 28 Dec 2023

View file

@ -3,7 +3,7 @@ import About from "~/components/About"
import Avatar from "~/components/Avatar"
import Profile from "~/components/Profile"
import SocialLinks from "~/components/SocialLinks"
import Head from 'next/head'
import Head from "next/head"
const inter = Inter({ subsets: ["latin"] })
@ -15,7 +15,10 @@ export default function Home() {
<Head>
<title>About blueskychan_ :3</title>
<meta property="og:title" content="Hello, World! >3" key="title" />
<meta property="og:description" content="About some stupid person call blueskychan, aka Fuse/Mind :3" />
<meta
property="og:description"
content="About some stupid person call blueskychan, aka Fuse/Mind :3"
/>
</Head>
<div className="backdrop-blur-md bg-gray-700/50 rounded-lg p-2">
<div className="flex flex-row space-x-3 p-4 items-center ">

View file

@ -1,6 +1,7 @@
import fs from "fs"
import matter from "gray-matter"
import md from "markdown-it"
import Head from "next/head"
export async function getStaticPaths() {
const files = fs.readdirSync("posts")
@ -27,12 +28,28 @@ export async function getStaticProps({ params: { slug } }) {
}
export default function PostPage({ frontmatter, content }) {
console.log(frontmatter.tags)
const postTags = frontmatter.tags.map((tag) => (
<div className="inline-block border-2 rounded-md p-1 w-fit h-fit font-bold text-lg mr-1" key={tag.toString()}>{tag}</div>
));
const proseClass =
"prose p-4 prose-invert prose-neutral mx-auto bg-gray-700/50 backdrop-blue-md backdrop-blur-md h-100"
return (
<>
<Head>
<meta property="og:type" content="article" />
<meta property="og:title" content={frontmatter.title} />
<meta property="og:description" content={frontmatter.desc} />
<meta name="twitter:title" content={frontmatter.title} />
<meta name="twitter:description" content={frontmatter.desc} />
</Head>
<div className={proseClass}>
<p className="font-bold text-md">{frontmatter.date}</p>
<h1 className="border-b-2 p-1">{frontmatter.title}</h1>
<div>{postTags}</div>
<div dangerouslySetInnerHTML={{ __html: md().render(content) }} />
</div>
</>

View file

@ -3,7 +3,6 @@
@tailwind utilities;
html {
/* Apply background styles to the html element */
--background-image: url("/illust_111261733_20231222_212212.jpg");
background-image: var(--background-image);
background-repeat: no-repeat;
@ -11,10 +10,10 @@ html {
background-size: cover;
background-position: center center;
color: rgb(255, 255, 255);
height: 100%; /* Ensure full height */
height: 100%;
}
body {
/* Ensure body also fills viewport */
height: 100%;
}