From 5c665f637323ca4a1057bc483e56fc3564cd9c51 Mon Sep 17 00:00:00 2001 From: daniyal Date: Fri, 12 Jul 2024 13:58:12 +0500 Subject: [PATCH] chore: separate profile section --- src/components/ProfileSection.tsx | 224 +++++++++++++++++++++++++++++ src/pages/submitMod.tsx | 231 +----------------------------- 2 files changed, 226 insertions(+), 229 deletions(-) create mode 100644 src/components/ProfileSection.tsx diff --git a/src/components/ProfileSection.tsx b/src/components/ProfileSection.tsx new file mode 100644 index 0000000..96e055a --- /dev/null +++ b/src/components/ProfileSection.tsx @@ -0,0 +1,224 @@ +import '../styles/author.css' +import '../styles/innerPage.css' +import '../styles/socialPosts.css' + +export const ProfileSection = () => { + return ( +
+
+
+
+
+ +
+
+
+
+
+
+
+
+

+ {author.name} +

+

+ {author.handle} +

+
+
+
+ +
+
+

+ {author.address} +

+
+
+
+ + + +
+
+ + + +
+ + + + + +
+
+
+
+

{author.bio}

+
+
+
+ +
+
+
+
+ {posts.map((post, index) => ( + +
+
+

+ {post.name} +

+
+ + + +
+
+
+

{post.content}

+ {post.imageUrl && ( +
+ )} +
+
+ + ))} +
+
+
+ ) +} + +interface Author { + name: string + handle: string + address: string + bio: string +} + +const author: Author = { + name: 'Freakoverse', + handle: 'freakoverse@degmods.com', + address: 'npub18n4ysp43ux5c98fs6h9c57qpr4p8r3j8f6e32v0vj8egzy878aqqyzzk9r', + bio: `I guess I'm one of those #vtubers . Having fun talking about general topics, vrchat/similar, and games. Also #indiedev #gamedev You can call me: Freak فْرِيكٌ ���リク (still learning Nihongo). #envtuber #podcast #gaming #gamedev` +} + +interface Post { + name: string + link: string + content: string + imageUrl?: string +} + +const posts: Post[] = [ + { + name: 'Freakoverse', + link: `feed-note.html`, + content: ` So I know HTML/CSS pretty well and I'm confident with + them.\n\n\n\nI also know UI and UX, as + well as graphic design (nowhere near pros, but I'm the + guy they call when the pro isn't around or when + something is needed quickly).\n\n\n\nI + don't know much java. Usually, I'd search for what I + want, find something close, and fiddle with it until + it works/gets the desired result ish. AI is helping + with this a lot actually.\n\n\n\nThis + helped me create my own sites and my own designs to + life, though just at a static level. I always wanted + to make dynamic sites, but the idea of doing backend + stuff is complex to me. However...\n\n\n\n"Let + me look into it again" and thought if I could make a + simple blog. Digging a bit, and watching/skimming + through tutorials, I realized that I think I can.\n\n\n\nNot + sure when I'll start/attempt this, but will journey + into learning the basics of PHP and attempting to make + a blog. I guess I'll learn the basics of PHP, and then + head into Laravel. If I manage to get the hang of it, + I'll attempt to make a complex old project I had, and + if I do manage to do it, I'll be pretty confident + =3\n\n\n\nAside from that, would be + nice to make a website, a personal blog, that shows my + long-form articles only. Hopefully by then things + would be more stable nostr-wise, cleaner, and easier + in terms of learning, so I'd be able to do it (or + collab with someone to do it / to make a template for + all to have and deploy easily).\n\n\n\n` + }, + { + name: 'Freakoverse', + link: 'https://primal.net/e/note1j7zmj4g6grc39zq30xq2de95dfszjpwlqvsktv65h7kuzjzsytjqgx73c7', + content: `Happy to see some gamedevs port their games from Unity to Godot, after that Unity fiasco, like this one here called Road To Vostok` + }, + { + name: 'Freakoverse', + link: `feed-note.html`, + content: `This is good.`, + imageUrl: 'assets/img/media-cache%20(1).jpg' + } +] diff --git a/src/pages/submitMod.tsx b/src/pages/submitMod.tsx index 66ac030..921c398 100644 --- a/src/pages/submitMod.tsx +++ b/src/pages/submitMod.tsx @@ -1,9 +1,8 @@ import { ModForm } from '../components/ModForm' -import '../styles/author.css' +import { ProfileSection } from '../components/ProfileSection' import '../styles/innerPage.css' import '../styles/styles.css' import '../styles/write.css' -import '../styles/socialPosts.css' export const SubmitModPage = () => { return ( @@ -24,236 +23,10 @@ export const SubmitModPage = () => { - + ) } - -interface Author { - name: string - handle: string - address: string - bio: string -} - -const author: Author = { - name: 'Freakoverse', - handle: 'freakoverse@degmods.com', - address: 'npub18n4ysp43ux5c98fs6h9c57qpr4p8r3j8f6e32v0vj8egzy878aqqyzzk9r', - bio: `I guess I'm one of those #vtubers . Having fun talking about general topics, vrchat/similar, and games. Also #indiedev #gamedev You can call me: Freak فْرِيكٌ ���リク (still learning Nihongo). #envtuber #podcast #gaming #gamedev` -} - -interface Post { - name: string - link: string - content: string - imageUrl?: string -} - -const posts: Post[] = [ - { - name: 'Freakoverse', - link: `feed-note.html`, - content: ` So I know HTML/CSS pretty well and I'm confident with - them.\n\n\n\nI also know UI and UX, as - well as graphic design (nowhere near pros, but I'm the - guy they call when the pro isn't around or when - something is needed quickly).\n\n\n\nI - don't know much java. Usually, I'd search for what I - want, find something close, and fiddle with it until - it works/gets the desired result ish. AI is helping - with this a lot actually.\n\n\n\nThis - helped me create my own sites and my own designs to - life, though just at a static level. I always wanted - to make dynamic sites, but the idea of doing backend - stuff is complex to me. However...\n\n\n\n"Let - me look into it again" and thought if I could make a - simple blog. Digging a bit, and watching/skimming - through tutorials, I realized that I think I can.\n\n\n\nNot - sure when I'll start/attempt this, but will journey - into learning the basics of PHP and attempting to make - a blog. I guess I'll learn the basics of PHP, and then - head into Laravel. If I manage to get the hang of it, - I'll attempt to make a complex old project I had, and - if I do manage to do it, I'll be pretty confident - =3\n\n\n\nAside from that, would be - nice to make a website, a personal blog, that shows my - long-form articles only. Hopefully by then things - would be more stable nostr-wise, cleaner, and easier - in terms of learning, so I'd be able to do it (or - collab with someone to do it / to make a template for - all to have and deploy easily).\n\n\n\n` - }, - { - name: 'Freakoverse', - link: 'https://primal.net/e/note1j7zmj4g6grc39zq30xq2de95dfszjpwlqvsktv65h7kuzjzsytjqgx73c7', - content: `Happy to see some gamedevs port their games from Unity to Godot, after that Unity fiasco, like this one here called Road To Vostok` - }, - { - name: 'Freakoverse', - link: `feed-note.html`, - content: `This is good.`, - imageUrl: 'assets/img/media-cache%20(1).jpg' - } -] - -interface Props { - author: Author - posts: Post[] -} - -const ProfileComponent = ({ author, posts }: Props) => { - return ( -
-
-
-
-
- -
-
-
-
-
-
-
-
-

- {author.name} -

-

- {author.handle} -

-
-
-
- -
-
-

- {author.address} -

-
-
-
- - - -
-
- - - -
- - - - - -
-
-
-
-

{author.bio}

-
-
-
- -
-
-
- -
-
- ) -}