mindhas403/blueskychan.dev
1
0
Fork 0
mirror of https://github.com/blueskychan-dev/blueskychan.dev.git synced 2025-07-08 07:41:05 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #1 from bluestarowo/main

Browse source 
OwO
This commit is contained in:
Phapoom Saksri 2023-12-28 11:45:12 +07:00 • committed by GitHub
commit 3b3061a275
6 changed files with 47 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

1
README.md
View file

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

10
posts/moveon.md
View file

@ -1,23 +1,27 @@
---
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!
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:
The old one, i use staic html and css but this new version now, they are use next.js to design all of website, also this one is just image (not gif like old one) so now it look better!
The old one, i use staic html and css but this new version now, they are use next.js to design all of website, also this one is just image (not gif like old one) so now it look better!
- 3. Backend System:
The old one is hosted on github pages, but due to this version use next.js, now we move on to use a vercel for hosting the website! Also we have a blog system, so they need to use next.js too!
The old one is hosted on github pages, but due to this version use next.js, now we move on to use a vercel for hosting the website! Also we have a blog system, so they need to use next.js too!
> However, fusemeow.me will hosted until 7 January 2024, and it will be gone!, but osu!collab image will be hosted in here soon!
Also Thanks you for all support! :3
Credit: @bluestar.owo (Helper)
- Last updated: 28 Dec 2023

BIN
public/illust_111261733_20231222_212212-min.webp Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 42 KiB

9
src/pages/index.jsx
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"] })
@ -12,10 +12,13 @@ export default function Home() {
<main
className={`flex min-h-screen items-center justify-center ${inter.className}`}
>
<Head>
<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 ">

35
src/pages/post/[slug].jsx
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,34 @@ export async function getStaticProps({ params: { slug } }) {
}
export default function PostPage({ frontmatter, content }) {
const proseClass =
"prose p-4 prose-invert prose-neutral mx-auto bg-gray-700/50 backdrop-blue-md backdrop-blur-md h-screen"
return (
<div className={proseClass}>
<h1 className="border-b-2 p-1">{frontmatter.title}</h1>
<div dangerouslySetInnerHTML={{ __html: md().render(content) }} />
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>
</>
)
}

6
src/styles/globals.css
View file

@ -3,18 +3,16 @@
@tailwind utilities;
html {
/* Apply background styles to the html element */
--background-image: url("/illust_111261733_20231222_212212.jpg");
--background-image: url("/illust_111261733_20231222_212212-min.webp");
background-image: var(--background-image);
background-repeat: no-repeat;
background-attachment: fixed;
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%;
}