added socials

info/contacts/discord.md

@@ -0,0 +1,4 @@
+---
+platform: "Discord"
+name: "nin0.dev"
+---

info/contacts/email.md

@@ -0,0 +1,6 @@
+---
+platform: "Email"
+name: "support@nin0.dev"
+url: "mailto:support@nin0.dev"
+note: "Replies may be slow"
+---

info/contacts/telegram.md

@@ -0,0 +1,6 @@
+---
+platform: "Telegram"
+url: "https://nin0dev.t.me"
+name: "@nin0dev"
+note: "Use for quick replies"
+---

src/components/Contacts.astro

@@ -0,0 +1,8 @@
+---
+import Social from "./Social.astro"
+
+const contacts = await Astro.glob("../../info/contacts/*.md")
+---
+<ul>
+    {contacts.map(contact => <Social platform={contact.frontmatter.platform} url={contact.frontmatter.url} name={contact.frontmatter.name} note={contact.frontmatter.note}/>)}
+</ul>

src/components/GroupBox.astro

@@ -0,0 +1,16 @@
+---
+const {name} = Astro.props
+---
+
+<style>
+  fieldset {
+    margin-top: 10px;
+    margin-bottom: 0px;
+    padding: 0px 15px;
+  }
+</style>
+
+<fieldset>
+  <legend>{name}</legend>
+  <slot />
+</fieldset>

src/components/Social.astro

@@ -0,0 +1,16 @@
+---
+const {platform, name, url, note} = Astro.props;
+---
+
+<style>
+    bl {
+        font-weight: 500;
+    }
+    it {
+        font-style: italic;
+    }
+</style>
+
+<li>
+    <bl>{platform}</bl>: {url ? <a href={url}>{name}</a> : name}{note && <it> ({note})</it>}
+</li>

src/components/Window.astro

@@ -6,6 +6,9 @@ const {title, showClose, maxWidth} = Astro.props
     #window {
         max-width: var(--maxWidth);
     }
+    .window-body {
+        padding: 20px !important;
+    }
 </style>
 
 <div class="background" id="window">

src/pages/index.astro

@@ -1,6 +1,9 @@
 ---
+import Contacts from "../components/Contacts.astro";
+import GroupBox from "../components/GroupBox.astro";
 import Me from "../components/Me.astro";
 import Presence from "../components/Presence.astro";
+import Social from "../components/Social.astro";
 import Window from "../components/Window.astro";
 import BaseLayout from "../layouts/BaseLayout.astro";
 ---
@@ -9,5 +12,15 @@ import BaseLayout from "../layouts/BaseLayout.astro";
 	<Window title="Home" maxWidth="600px">
 		<Me />
 		<Presence />
+		<GroupBox name="About me">
+			<p>
+				I'm a Canadian self-taught software developer that makes things some people find useful in Python, HTML, JavaScript, and Kotlin.
+				<br/>
+				I occasionally code with Java or C#, and am currently learning Rust.
+			</p>
+		</GroupBox>
+		<GroupBox name="Reach out">
+			<Contacts />
+		</GroupBox>
 	</Window>
 </BaseLayout>