diff --git a/.prettierrc b/.prettierrc index 7c28b83..e052394 100644 --- a/.prettierrc +++ b/.prettierrc @@ -1,5 +1,4 @@ { "tabWidth": 2, - "useTabs": false, "semi": false } diff --git a/package.json b/package.json index a9f96fc..fc39b79 100644 --- a/package.json +++ b/package.json @@ -9,14 +9,17 @@ "format": "prettier . --write" }, "dependencies": { + "@phosphor-icons/react": "^2.0.15", + "gray-matter": "^4.0.3", + "markdown-it": "^14.0.0", "next": "14.0.4", "react": "^18", - "react-dom": "^18" + "react-dom": "^18", + "react-tooltip": "^5.25.0" }, "devDependencies": { "@tailwindcss/typography": "^0.5.10", "autoprefixer": "^10.0.1", - "daisyui": "^4.4.23", "postcss": "^8", "prettier": "^3.1.1", "tailwindcss": "^3.3.0" diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index bf999ff..7b1473b 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -5,6 +5,18 @@ settings: excludeLinksFromLockfile: false dependencies: + "@phosphor-icons/react": + specifier: ^2.0.15 + version: 2.0.15(react-dom@18.2.0)(react@18.2.0) + fs: + specifier: 0.0.1-security + version: 0.0.1-security + gray-matter: + specifier: ^4.0.3 + version: 4.0.3 + markdown-it: + specifier: ^14.0.0 + version: 14.0.0 next: specifier: 14.0.4 version: 14.0.4(react-dom@18.2.0)(react@18.2.0) @@ -14,6 +26,9 @@ dependencies: react-dom: specifier: ^18 version: 18.2.0(react@18.2.0) + react-tooltip: + specifier: ^5.25.0 + version: 5.25.0(react-dom@18.2.0)(react@18.2.0) devDependencies: "@tailwindcss/typography": @@ -22,9 +37,6 @@ devDependencies: autoprefixer: specifier: ^10.0.1 version: 10.4.16(postcss@8.4.32) - daisyui: - specifier: ^4.4.23 - version: 4.4.23(postcss@8.4.32) postcss: specifier: ^8 version: 8.4.32 @@ -44,6 +56,32 @@ packages: engines: { node: ">=10" } dev: true + /@floating-ui/core@1.5.2: + resolution: + { + integrity: sha512-Ii3MrfY/GAIN3OhXNzpCKaLxHQfJF9qvwq/kEJYdqDxeIHa01K8sldugal6TmeeXl+WMvhv9cnVzUTaFFJF09A==, + } + dependencies: + "@floating-ui/utils": 0.1.6 + dev: false + + /@floating-ui/dom@1.5.3: + resolution: + { + integrity: sha512-ClAbQnEqJAKCJOEbbLo5IUlZHkNszqhuxS4fHAVxRPXPya6Ysf2G8KypnYcOTpx6I8xcgF9bbHb6g/2KpbV8qA==, + } + dependencies: + "@floating-ui/core": 1.5.2 + "@floating-ui/utils": 0.1.6 + dev: false + + /@floating-ui/utils@0.1.6: + resolution: + { + integrity: sha512-OfX7E2oUDYxtBvsuS4e/jSn4Q9Qb6DzgeYtsAdkPZ47znpoNsMgZw0+tVijiv3uGNR6dgNlty6r9rzIzHjtd/A==, + } + dev: false + /@isaacs/cliui@8.0.2: resolution: { @@ -249,6 +287,20 @@ packages: fastq: 1.16.0 dev: true + /@phosphor-icons/react@2.0.15(react-dom@18.2.0)(react@18.2.0): + resolution: + { + integrity: sha512-PQKNcRrfERlC8gJGNz0su0i9xVmeubXSNxucPcbCLDd9u0cwJVTEyYK87muul/svf0UXFdL2Vl6bbeOhT1Mwow==, + } + engines: { node: ">=10" } + peerDependencies: + react: ">= 16.8" + react-dom: ">= 16.8" + dependencies: + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false + /@pkgjs/parseargs@0.11.0: resolution: { @@ -342,6 +394,22 @@ packages: } dev: true + /argparse@1.0.10: + resolution: + { + integrity: sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==, + } + dependencies: + sprintf-js: 1.0.3 + dev: false + + /argparse@2.0.1: + resolution: + { + integrity: sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==, + } + dev: false + /autoprefixer@10.4.16(postcss@8.4.32): resolution: { @@ -451,6 +519,13 @@ packages: fsevents: 2.3.3 dev: true + /classnames@2.3.2: + resolution: + { + integrity: sha512-CSbhY4cFEJRe6/GQzIk5qXZ4Jeg5pcsP7b5peFSDpffpe1cqjASH/n9UTjBwOp6XpMSTwQ8Za2K5V02ueA7Tmw==, + } + dev: false + /client-only@0.0.1: resolution: { @@ -495,16 +570,6 @@ packages: which: 2.0.2 dev: true - /css-selector-tokenizer@0.8.0: - resolution: - { - integrity: sha512-Jd6Ig3/pe62/qe5SBPTN8h8LeUg/pT4lLgtavPf7updwwHpvFzxvOQBHYj2LZDMjUnBzgvIUSjRcf6oT5HzHFg==, - } - dependencies: - cssesc: 3.0.0 - fastparse: 1.1.2 - dev: true - /cssesc@3.0.0: resolution: { @@ -514,29 +579,6 @@ packages: hasBin: true dev: true - /culori@3.3.0: - resolution: - { - integrity: sha512-pHJg+jbuFsCjz9iclQBqyL3B2HLCBF71BwVNujUYEvCeQMvV97R59MNK3R2+jgJ3a1fcZgI9B3vYgz8lzr/BFQ==, - } - engines: { node: ^12.20.0 || ^14.13.1 || >=16.0.0 } - dev: true - - /daisyui@4.4.23(postcss@8.4.32): - resolution: - { - integrity: sha512-IFQRGoGoAke8chxPcDqQJFldVVd51JL7b4mRA3LqsLexW/6xicZzz9X3GXdGdnYsu8QPxZN4uzQZ5fwRNYXOSg==, - } - engines: { node: ">=16.9.0" } - dependencies: - css-selector-tokenizer: 0.8.0 - culori: 3.3.0 - picocolors: 1.0.0 - postcss-js: 4.0.1(postcss@8.4.32) - transitivePeerDependencies: - - postcss - dev: true - /didyoumean@1.2.2: resolution: { @@ -579,6 +621,14 @@ packages: } dev: true + /entities@4.5.0: + resolution: + { + integrity: sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==, + } + engines: { node: ">=0.12" } + dev: false + /escalade@3.1.1: resolution: { @@ -587,6 +637,25 @@ packages: engines: { node: ">=6" } dev: true + /esprima@4.0.1: + resolution: + { + integrity: sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==, + } + engines: { node: ">=4" } + hasBin: true + dev: false + + /extend-shallow@2.0.1: + resolution: + { + integrity: sha512-zCnTtlxNoAiDc3gqY2aYAWFx7XWWiasuF2K8Me5WbN8otHKTUKBwjPtNpRs/rbUZm7KxWAaNj7P1a/p52GbVug==, + } + engines: { node: ">=0.10.0" } + dependencies: + is-extendable: 0.1.1 + dev: false + /fast-glob@3.3.2: resolution: { @@ -601,13 +670,6 @@ packages: micromatch: 4.0.5 dev: true - /fastparse@1.1.2: - resolution: - { - integrity: sha512-483XLLxTVIwWK3QTrMGRqUfUpoOs/0hbQrl2oz4J0pAcm3A3bu84wxTFqGqkJzewCLdME38xJLJAxBABfQT8sQ==, - } - dev: true - /fastq@1.16.0: resolution: { @@ -645,6 +707,13 @@ packages: } dev: true + /fs@0.0.1-security: + resolution: + { + integrity: sha512-3XY9e1pP0CVEUCdj5BmfIZxRBTSDycnbqhIOGec9QYtmVH2fbLpj86CFWkrNOkt/Fvty4KZG5lTglL9j/gJ87w==, + } + dev: false + /fsevents@2.3.3: resolution: { @@ -712,6 +781,19 @@ packages: } dev: false + /gray-matter@4.0.3: + resolution: + { + integrity: sha512-5v6yZd4JK3eMI3FqqCouswVqwugaA9r4dNZB1wwcmrD02QkV5H0y7XBQW8QwQqEaZY1pM9aqORSORhJRdNK44Q==, + } + engines: { node: ">=6.0" } + dependencies: + js-yaml: 3.14.1 + kind-of: 6.0.3 + section-matter: 1.0.0 + strip-bom-string: 1.0.0 + dev: false + /hasown@2.0.0: resolution: { @@ -741,6 +823,14 @@ packages: hasown: 2.0.0 dev: true + /is-extendable@0.1.1: + resolution: + { + integrity: sha512-5BMULNob1vgFX6EjQw5izWDxrecWK9AM72rugNr0TFldMOi0fj6Jk+zeKIt0xGj4cEfQIJth4w3OKWOJ4f+AFw==, + } + engines: { node: ">=0.10.0" } + dev: false + /is-extglob@2.1.1: resolution: { @@ -809,6 +899,25 @@ packages: } dev: false + /js-yaml@3.14.1: + resolution: + { + integrity: sha512-okMH7OXXJ7YrN9Ok3/SXrnu4iX9yOk+25nqX4imS2npuvTYDmo/QEZoqwZkYaIDk3jVvBOTOIEgEhaLOynBS9g==, + } + hasBin: true + dependencies: + argparse: 1.0.10 + esprima: 4.0.1 + dev: false + + /kind-of@6.0.3: + resolution: + { + integrity: sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==, + } + engines: { node: ">=0.10.0" } + dev: false + /lilconfig@2.1.0: resolution: { @@ -832,6 +941,15 @@ packages: } dev: true + /linkify-it@5.0.0: + resolution: + { + integrity: sha512-5aHCbzQRADcdP+ATqnDuhhJ/MRIqDkZX5pyjFHRRysS8vZ5AbqGEoFIb6pYHPZ+L/OC2Lc+xT8uHVVR5CAK/wQ==, + } + dependencies: + uc.micro: 2.0.0 + dev: false + /lodash.castarray@4.4.0: resolution: { @@ -871,6 +989,28 @@ packages: engines: { node: 14 || >=16.14 } dev: true + /markdown-it@14.0.0: + resolution: + { + integrity: sha512-seFjF0FIcPt4P9U39Bq1JYblX0KZCjDLFFQPHpL5AzHpqPEKtosxmdq/LTVZnjfH7tjt9BxStm+wXcDBNuYmzw==, + } + hasBin: true + dependencies: + argparse: 2.0.1 + entities: 4.5.0 + linkify-it: 5.0.0 + mdurl: 2.0.0 + punycode.js: 2.3.1 + uc.micro: 2.0.0 + dev: false + + /mdurl@2.0.0: + resolution: + { + integrity: sha512-Lf+9+2r+Tdp5wXDXC4PcIBjTDtq4UKjCPMQhKIuzpJNW0b96kVqSwW0bT7FhRSfmAiFYgP+SCRvdrDozfh0U5w==, + } + dev: false + /merge2@1.4.1: resolution: { @@ -1188,6 +1328,14 @@ packages: hasBin: true dev: true + /punycode.js@2.3.1: + resolution: + { + integrity: sha512-uxFIHU0YlHYhDQtV4R9J6a52SLx28BCjT+4ieh7IGbgwVJWO+km431c4yRlREUAsAmt/uMjQUyQHNEPf0M39CA==, + } + engines: { node: ">=6" } + dev: false + /queue-microtask@1.2.3: resolution: { @@ -1208,6 +1356,21 @@ packages: scheduler: 0.23.0 dev: false + /react-tooltip@5.25.0(react-dom@18.2.0)(react@18.2.0): + resolution: + { + integrity: sha512-/eGhmlwbHlJrVoUe75fb58rJfAy9aZnTvQAK9ZUPM0n9mmBGpEk13vDPiQVCeUuax+fBej+7JPsUXlhzaySc7w==, + } + peerDependencies: + react: ">=16.14.0" + react-dom: ">=16.14.0" + dependencies: + "@floating-ui/dom": 1.5.3 + classnames: 2.3.2 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false + /react@18.2.0: resolution: { @@ -1275,6 +1438,17 @@ packages: loose-envify: 1.4.0 dev: false + /section-matter@1.0.0: + resolution: + { + integrity: sha512-vfD3pmTzGpufjScBh50YHKzEu2lxBWhVEHsNGoEXmCmn2hKGfeNLYMzCJpe8cD7gqX7TJluOVpBkAequ6dgMmA==, + } + engines: { node: ">=4" } + dependencies: + extend-shallow: 2.0.1 + kind-of: 6.0.3 + dev: false + /shebang-command@2.0.0: resolution: { @@ -1308,6 +1482,13 @@ packages: } engines: { node: ">=0.10.0" } + /sprintf-js@1.0.3: + resolution: + { + integrity: sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==, + } + dev: false + /streamsearch@1.1.0: resolution: { @@ -1360,6 +1541,14 @@ packages: ansi-regex: 6.0.1 dev: true + /strip-bom-string@1.0.0: + resolution: + { + integrity: sha512-uCC2VHvQRYu+lMh4My/sFNmF2klFymLX1wHJeXnbEJERpV/ZsVuonzerjfrGpIGF7LBVa1O7i9kjiWvJiFck8g==, + } + engines: { node: ">=0.10.0" } + dev: false + /styled-jsx@5.1.1(react@18.2.0): resolution: { @@ -1482,6 +1671,13 @@ packages: } dev: false + /uc.micro@2.0.0: + resolution: + { + integrity: sha512-DffL94LsNOccVn4hyfRe5rdKa273swqeA5DJpMOeFmEn1wCDc7nAbbB0gXlgBCL7TNzeTv6G7XVWzan7iJtfig==, + } + dev: false + /update-browserslist-db@1.0.13(browserslist@4.22.2): resolution: { diff --git a/posts/lorem.md b/posts/lorem.md new file mode 100644 index 0000000..9afafdc --- /dev/null +++ b/posts/lorem.md @@ -0,0 +1,10 @@ +--- +title: "lorem ipsum" +date: "" +tags: + - sit amet +--- + +### Lorem ipsum + +Sit commodo voluptate do quis excepteur veniam aliquip ut dolore. Exercitation elit incididunt aute ipsum deserunt ullamco. Sit cupidatat elit cupidatat aute Lorem non in aute esse nostrud in labore ullamco magna. Minim Lorem mollit est est amet magna. Magna dolore dolore nisi nostrud dolore ut reprehenderit sint cupidatat officia. Commodo reprehenderit tempor est consequat magna pariatur pariatur officia mollit sint dolore elit commodo dolor. diff --git a/public/favicon.ico b/public/favicon.ico deleted file mode 100644 index 4570eb8..0000000 Binary files a/public/favicon.ico and /dev/null differ diff --git a/public/illust_111261733_20231222_212212.jpg b/public/illust_111261733_20231222_212212.jpg new file mode 100644 index 0000000..b8cb309 Binary files /dev/null and b/public/illust_111261733_20231222_212212.jpg differ diff --git a/public/next.svg b/public/next.svg deleted file mode 100644 index 5174b28..0000000 --- a/public/next.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/public/pfp.png b/public/pfp.png new file mode 100644 index 0000000..b0ed472 Binary files /dev/null and b/public/pfp.png differ diff --git a/public/vercel.svg b/public/vercel.svg deleted file mode 100644 index d2f8422..0000000 --- a/public/vercel.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/components/About.jsx b/src/components/About.jsx new file mode 100644 index 0000000..dedb575 --- /dev/null +++ b/src/components/About.jsx @@ -0,0 +1,17 @@ +// About.js +const About = () => { + return ( + <> + About +
+
+
+
+ Time changes world changes everything changes I mean should I accept the + world? +
+ + ) +} + +export default About diff --git a/src/components/Avatar.jsx b/src/components/Avatar.jsx new file mode 100644 index 0000000..078e714 --- /dev/null +++ b/src/components/Avatar.jsx @@ -0,0 +1,14 @@ +import Image from "next/image" +import { Tooltip } from "react-tooltip" +const Avatar = () => { + return ( + <> +
+ Profile picture +
+ + + ) +} + +export default Avatar diff --git a/src/components/LinkIcon.jsx b/src/components/LinkIcon.jsx new file mode 100644 index 0000000..af5274d --- /dev/null +++ b/src/components/LinkIcon.jsx @@ -0,0 +1,15 @@ +import Link from "next/link" + +const ProfileLink = ({ href, LinkIcon }) => { + return ( + + {LinkIcon} + + ) +} + +export default ProfileLink diff --git a/src/components/Profile.jsx b/src/components/Profile.jsx index e69de29..c946840 100644 --- a/src/components/Profile.jsx +++ b/src/components/Profile.jsx @@ -0,0 +1,13 @@ +const Profile = () => { + return ( +
+

+ bluestar + she/her +

+
Acer Pricker
+
+ ) +} + +export default Profile diff --git a/src/components/SocialLinks.jsx b/src/components/SocialLinks.jsx new file mode 100644 index 0000000..14c8c17 --- /dev/null +++ b/src/components/SocialLinks.jsx @@ -0,0 +1,28 @@ +import LinkIcon from "./LinkIcon" +import { DiscordLogo, GithubLogo, InstagramLogo } from "@phosphor-icons/react" + +const SocialLinks = () => { + const profileLinks = [ + { + href: "https://discord.com/users/829156179803504670", + LinkIcon: , + }, + { + href: "https://www.instagram.com/bluestar.pics", + LinkIcon: , + }, + { + href: "https://github.com/bluestarowo", + LinkIcon: , + }, + ] + return ( +
+ {profileLinks.map((link, index) => ( + + ))} +
+ ) +} + +export default SocialLinks diff --git a/src/pages/blog.jsx b/src/pages/blog.jsx new file mode 100644 index 0000000..c99d1e7 --- /dev/null +++ b/src/pages/blog.jsx @@ -0,0 +1,40 @@ +import fs from "fs" +import matter from "gray-matter" +import Link from "next/link" + +export async function getStaticProps() { + const files = fs.readdirSync("posts") + + const posts = files.map((fileName) => { + const slug = fileName.replace(".md", "") + const readFile = fs.readFileSync(`posts/${fileName}`, "utf-8") + const { data: frontmatter } = matter(readFile) + return { + slug, + frontmatter, + } + }) + + return { + props: { + posts, + }, + } +} + +export default function Blog({ posts }) { + return ( +
+ {posts.map(({ slug, frontmatter }) => ( +
+ +

{frontmatter.title}

+ +
+ ))} +
+ ) +} diff --git a/src/pages/index.jsx b/src/pages/index.jsx index 9c4a36e..633b1fa 100644 --- a/src/pages/index.jsx +++ b/src/pages/index.jsx @@ -1,5 +1,8 @@ -import Image from "next/image" import { Inter } from "next/font/google" +import About from "~/components/About" +import Avatar from "~/components/Avatar" +import Profile from "~/components/Profile" +import SocialLinks from "~/components/SocialLinks" const inter = Inter({ subsets: ["latin"] }) @@ -8,33 +11,14 @@ export default function Home() {
-
-
-
-
-
- -
-
- -
-

- bluestar - she/her -

-
-
-
- About - -
-
- Lorem ipsum dolor sit amet consectetur adipisicing elit. Debitis - optio vitae id, aut accusamus magni deleniti delectus saepe quis - quidem quae possimus harum voluptas repellat recusandae - blanditiis, sint ipsa ducimus! -
-
+
+
+ + +
+
+ +
diff --git a/src/pages/post/[slug].jsx b/src/pages/post/[slug].jsx new file mode 100644 index 0000000..8e28a19 --- /dev/null +++ b/src/pages/post/[slug].jsx @@ -0,0 +1,37 @@ +import fs from "fs" +import matter from "gray-matter" +import md from "markdown-it" + +export async function getStaticPaths() { + const files = fs.readdirSync("posts") + const paths = files.map((fileName) => ({ + params: { + slug: fileName.replace(".md", ""), + }, + })) + return { + paths, + fallback: false, + } +} + +export async function getStaticProps({ params: { slug } }) { + const fileName = fs.readFileSync(`posts/${slug}.md`, "utf-8") + const { data: frontmatter, content } = matter(fileName) + return { + props: { + frontmatter, + content, + }, + } +} + +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 ( +
+

{frontmatter.title}

+
+
+ ) +} diff --git a/src/styles/globals.css b/src/styles/globals.css index 02655c2..b6264bf 100644 --- a/src/styles/globals.css +++ b/src/styles/globals.css @@ -3,5 +3,12 @@ @tailwind utilities; :root { - background-color: rgb(32, 32, 32); + --background-image: url("/illust_111261733_20231222_212212.jpg"); + + background-image: var(--background-image); + background-position: center; + background-repeat: no-repeat; + background-size: cover; + color: rgb(255, 255, 255); + height: 100%; } diff --git a/tailwind.config.js b/tailwind.config.js index 1c0eb9a..361e547 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -8,8 +8,5 @@ module.exports = { theme: { extend: {}, }, - plugins: [require("@tailwindcss/typography"), require("daisyui")], - daisyui: { - themes: ["black"], - }, + plugins: [require("@tailwindcss/typography")], }