feat: 添加GitHub Chart组件

This commit closes #72.

Signed-off-by: crrashh1542 <[email protected]>

config/config.ts

@@ -86,11 +86,19 @@ export default {
     // banner 横幅下的由组件组成的内容区，内容顺序分先后
     components: {
 
+        // GitHub Charts
+        ghChart: {
+            // 贡献表的标题
+            title: '今天咕咕咕了没！',
+            // 此处填写 GitHub 用户名
+            username: 'crrashh1542'
+        },
+
         // 个人其他网站链接
         links: {
 
             // 链接组件的标题
-            title: '咱的好东西！',
+            title: '咱的好东西',
 
             to: [
                 // 此处的每一个对象（用大括号包起来的东西）对应一个内容区的灰色背景链接

src/components/main/GhChart.astro

@@ -0,0 +1,13 @@
+---
+interface Props {
+    username: string
+}
+const { username } = Astro.props
+import Card from './Card.astro'
+---
+
+<Card isMulti>
+    <img src={ 'https://ghchart.rshah.org/f59f17/' + username }
+         alt="crrashh1542's GitHub chart"
+         class="block m-auto overflow-x-scroll" />
+</Card> 

src/pages/index.astro

@@ -13,6 +13,7 @@ import DataTransfer from '@/components/DataTransfer.astro'
 
 // 引入页面模块
 import Links from '@/components/main/Links.astro'
+import GhChart from '@/components/main/GhChart.astro'
 import Properties from '@/components/main/Properties.astro'
 ---
 
@@ -24,6 +25,12 @@ import Properties from '@/components/main/Properties.astro'
 	<main>
 		<Banner info={ config.site } social={ config.social } />
 
+		<!-- 组件1 GitHub Chart -->
+		<div class="component-wrapper">
+			<Catalog>{ config.components.ghChart.title }</Catalog>
+			<GhChart username={ config.components.ghChart.username }></GhChart>
+		</div>
+
 		<!-- 组件1 个人链接 -->
 		<div class="component-wrapper">
 			<Catalog>{ config.components.links.title }</Catalog>