Commit 0178e55

@@ -0,0 +1,22 @@
+---
+title: About
+description: Welcome!
+---
+
+# Lorem
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+# Ipsum
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+# Dolor
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+```rust
+fn main() {
+  println!("Hello, world!")
+}
+```

@@ -1,9 +1,47 @@
 ---
+import { profileConfig } from '@/config';
+import ImageWrapper from '@components/utils/ImageWrapper.astro';
+import Markdown from '@components/utils/Markdown.astro';
+import Button from '@components/widgets/Button.astro';
 import I18nKey from '@i18n/I18nKey';
 import { i18n } from '@i18n/translation';
 import MainLayout from '@layouts/MainLayout.astro';
+import { Icon } from 'astro-icon/components';
+import { getEntry, render } from 'astro:content';
+
+const aboutMd = await getEntry('spec', 'about');
+const { Content } = aboutMd ? await render(aboutMd) : Fragment;
 ---
 
 <MainLayout title={i18n(I18nKey.about)}>
-  <div>测试</div>
+  <div class="mx-auto flex max-w-screen-xl flex-col items-center justify-center">
+    <div class="my-4 flex w-5/6 flex-row items-center justify-between gap-4 md:w-2/3">
+      <div class="mb-5 mr-auto flex flex-col">
+        <div>
+          <span class="text-xl">Hi! I'm </span>
+          <span class="text-2xl font-bold">{profileConfig.name}</span>
+        </div>
+        <div class="mt-2">
+          {profileConfig.bio}
+        </div>
+        <div class="mt-4 flex">
+          {
+            profileConfig.links.map((link) => (
+              <Button href={link.url} title={link.name} class="text-2xl">
+                <Icon name={link.icon} />
+              </Button>
+            ))
+          }
+        </div>
+      </div>
+      <ImageWrapper
+        class="theme-border h-0 min-h-32 w-0 min-w-32 rounded-full border-4 md:min-h-48 md:min-w-48"
+        src={profileConfig.avatar}
+        alt={profileConfig.name}
+      />
+    </div>
+    <Markdown class="w-5/6 md:w-3/4">
+      <Content />
+    </Markdown>
+  </div>
 </MainLayout>