🎉 Start development

2024-01-20 23:19:15 +08:00 · 2024-01-20 23:19:15 +08:00 · c80003459e
commit c80003459e
46 changed files with 11644 additions and 0 deletions
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1,24 @@
+# build output
+dist/
+# generated types
+.astro/
+
+# dependencies
+node_modules/
+
+# logs
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+
+# environment variables
+.env
+.env.production
+
+# macOS-specific files
+.DS_Store
+
+# Development content
+/content
--- a/.vscode/extensions.json
+++ b/.vscode/extensions.json
@ -0,0 +1,4 @@
+{
+  "recommendations": ["astro-build.astro-vscode"],
+  "unwantedRecommendations": []
+}
--- a/.vscode/launch.json
+++ b/.vscode/launch.json
@ -0,0 +1,11 @@
+{
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "command": "./node_modules/.bin/astro dev",
+      "name": "Development server",
+      "request": "launch",
+      "type": "node-terminal"
+    }
+  ]
+}
--- a/README.md
+++ b/README.md
@ -0,0 +1,47 @@
+# Astro Starter Kit: Minimal
+
+```sh
+npm create astro@latest -- --template minimal
+```
+
+[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/withastro/astro/tree/latest/examples/minimal)
+[![Open with CodeSandbox](https://assets.codesandbox.io/github/button-edit-lime.svg)](https://codesandbox.io/p/sandbox/github/withastro/astro/tree/latest/examples/minimal)
+[![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/withastro/astro?devcontainer_path=.devcontainer/minimal/devcontainer.json)
+
+> 🧑‍🚀 **Seasoned astronaut?** Delete this file. Have fun!
+
+## 🚀 Project Structure
+
+Inside of your Astro project, you'll see the following folders and files:
+
+```text
+/
+├── public/
+├── src/
+│   └── pages/
+│       └── index.astro
+└── package.json
+```
+
+Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name.
+
+There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components.
+
+Any static assets, like images, can be placed in the `public/` directory.
+
+## 🧞 Commands
+
+All commands are run from the root of the project, from a terminal:
+
+| Command                   | Action                                           |
+| :------------------------ | :----------------------------------------------- |
+| `npm install`             | Installs dependencies                            |
+| `npm run dev`             | Starts local dev server at `localhost:4321`      |
+| `npm run build`           | Build your production site to `./dist/`          |
+| `npm run preview`         | Preview your build locally, before deploying     |
+| `npm run astro ...`       | Run CLI commands like `astro add`, `astro check` |
+| `npm run astro -- --help` | Get help using the Astro CLI                     |
+
+## 👀 Want to learn more?
+
+Feel free to check [our documentation](https://docs.astro.build) or jump into our [Discord server](https://astro.build/chat).
--- a/astro.config.mjs
+++ b/astro.config.mjs
@ -0,0 +1,10 @@
+import { defineConfig } from "astro/config";
+import mdx from "@astrojs/mdx";
+import tailwind from "@astrojs/tailwind";
+
+import react from "@astrojs/react";
+
+// https://astro.build/config
+export default defineConfig({
+  integrations: [mdx(), tailwind(), react()]
+});
--- a/package.json
+++ b/package.json
@ -0,0 +1,36 @@
+{
+  "name": "capital",
+  "type": "module",
+  "version": "0.0.1",
+  "scripts": {
+    "dev": "tinacms dev -c \"astro dev\"",
+    "start": "astro dev",
+    "build": "astro check && astro build",
+    "preview": "astro preview",
+    "astro": "astro"
+  },
+  "dependencies": {
+    "@astrojs/check": "^0.4.1",
+    "@astrojs/mdx": "^2.0.5",
+    "@astrojs/react": "^3.0.9",
+    "@astrojs/tailwind": "^5.1.0",
+    "@popperjs/core": "^2.11.8",
+    "@types/react": "^18.2.48",
+    "@types/react-dom": "^18.2.18",
+    "astro": "^4.2.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "sass": "^1.70.0",
+    "tailwindcss": "^3.4.1",
+    "theme-change": "^2.5.0",
+    "tinacms": "^1.5.28",
+    "typescript": "^5.3.3"
+  },
+  "devDependencies": {
+    "@tailwindcss/typography": "^0.5.10",
+    "@tinacms/cli": "^1.5.39",
+    "@types/node": "^20.11.5",
+    "daisyui": "^4.6.0",
+    "prettier": "^3.2.4"
+  }
+}
--- a/public/admin/.gitignore
+++ b/public/admin/.gitignore
@ -0,0 +1,2 @@
+index.html
+assets/
--- a/public/favicon.svg
+++ b/public/favicon.svg
@ -0,0 +1,21 @@
+<svg version="1.2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024">
+	<title>SmartSheep Logo</title>
+	<defs>
+		<image  width="124" height="198" id="img1" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHwAAADGCAMAAAAnkRSfAAAAAXNSR0IB2cksfwAAAq9QTFRFAAAA////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////J9QBRAAAAOV0Uk5TAA0WEiFfjMLMr40/BRdmtuz//vbQYAQmpfLdQAGovyURj/iOD0r07loDGJfbPDTf/bhd94QLdPrrVQLWcPmtHU31egknzehRg9Ev1xnzbgYHhfzmTMorSOSbFJloKsniReXDKG/7kQ6m8WMw3ue7I4cKNdTZOFTqsR5/Hzra0zZY7al4Ir5SPWHvnpbG4MRrlKJs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"/>
+		<image  width="122" height="142" id="img2" href="data:image/png;base64,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"/>
+	</defs>
+	<style>
+		.s0 { fill: #ffffff;stroke: #000000;stroke-miterlimit:100;stroke-width: 56 } 
+		.s1 { fill: #4750a3;stroke: #000000;stroke-miterlimit:100;stroke-width: 56 } 
+	</style>
+	<path id="Wool" fill-rule="evenodd" class="s0" d="m128 608.4c0 95.9 77.4 173.6 172.8 173.6h441.6c84.8 0 153.6-69.1 153.6-154.3 0-74.6-52.8-136.9-122.9-151.1 4.9-12.9 7.7-27 7.7-41.7 0-63.9-51.6-115.8-115.2-115.8-23.6 0-45.7 7.3-64 19.6-33.2-57.9-95.2-96.7-166.4-96.7-106.1 0-192 86.3-192 192.9 0 3.2 0.1 6.5 0.2 9.7-67.2 23.8-115.4 88.1-115.4 163.8z"/>
+	<g id="Crystal">
+		<path id="Crystal" class="s1" d="m699 224l138.6 80v160l-138.6 80-138.6-80v-160z"/>
+		<use id="Highlight" href="#img1" x="688" y="255"/>
+	</g>
+	<g id="Horn">
+	</g>
+	<g id="Face">
+		<use id="Slime" href="#img2" x="233" y="538"/>
+	</g>
+</svg>
--- a/semantic.json
+++ b/semantic.json
@ -0,0 +1,22 @@
+{
+  "base": "libs/fomantic",
+  "paths": {
+    "source": {
+      "config": "src/theme.config",
+      "definitions": "src/definitions/",
+      "site": "src/site/",
+      "themes": "src/themes/"
+    },
+    "output": {
+      "packaged": "dist/",
+      "uncompressed": "dist/components/",
+      "compressed": "dist/components/",
+      "themes": "dist/themes/"
+    },
+    "clean": "dist/"
+  },
+  "permission": false,
+  "autoInstall": false,
+  "rtl": false,
+  "version": "2.9.3"
+}
--- a/src/assets/fonts/fonts.css
+++ b/src/assets/fonts/fonts.css
@ -0,0 +1,204 @@
+:root {
+  --bs-body-font-family: "IBM Plex Serif", "Noto Serif SC", sans-serif !important;
+}
+
+html,
+body {
+  font-family: var(--bs-body-font-family);
+}
+
+/* ibm-plex-serif-100 - latin */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "IBM Plex Serif";
+  font-style: normal;
+  font-weight: 100;
+  src: url("./ibm-plex-serif-v19-latin-100.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* ibm-plex-serif-100italic - latin */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "IBM Plex Serif";
+  font-style: italic;
+  font-weight: 100;
+  src: url("./ibm-plex-serif-v19-latin-100italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* ibm-plex-serif-200 - latin */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "IBM Plex Serif";
+  font-style: normal;
+  font-weight: 200;
+  src: url("./ibm-plex-serif-v19-latin-200.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* ibm-plex-serif-200italic - latin */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "IBM Plex Serif";
+  font-style: italic;
+  font-weight: 200;
+  src: url("./ibm-plex-serif-v19-latin-200italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* ibm-plex-serif-300 - latin */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "IBM Plex Serif";
+  font-style: normal;
+  font-weight: 300;
+  src: url("./ibm-plex-serif-v19-latin-300.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* ibm-plex-serif-300italic - latin */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "IBM Plex Serif";
+  font-style: italic;
+  font-weight: 300;
+  src: url("./ibm-plex-serif-v19-latin-300italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* ibm-plex-serif-regular - latin */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "IBM Plex Serif";
+  font-style: normal;
+  font-weight: 400;
+  src: url("./ibm-plex-serif-v19-latin-regular.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* ibm-plex-serif-italic - latin */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "IBM Plex Serif";
+  font-style: italic;
+  font-weight: 400;
+  src: url("./ibm-plex-serif-v19-latin-italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* ibm-plex-serif-500 - latin */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "IBM Plex Serif";
+  font-style: normal;
+  font-weight: 500;
+  src: url("./ibm-plex-serif-v19-latin-500.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* ibm-plex-serif-500italic - latin */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "IBM Plex Serif";
+  font-style: italic;
+  font-weight: 500;
+  src: url("./ibm-plex-serif-v19-latin-500italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* ibm-plex-serif-600 - latin */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "IBM Plex Serif";
+  font-style: normal;
+  font-weight: 600;
+  src: url("./ibm-plex-serif-v19-latin-600.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* ibm-plex-serif-600italic - latin */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "IBM Plex Serif";
+  font-style: italic;
+  font-weight: 600;
+  src: url("./ibm-plex-serif-v19-latin-600italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* ibm-plex-serif-700 - latin */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "IBM Plex Serif";
+  font-style: normal;
+  font-weight: 700;
+  src: url("./ibm-plex-serif-v19-latin-700.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* ibm-plex-serif-700italic - latin */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "IBM Plex Serif";
+  font-style: italic;
+  font-weight: 700;
+  src: url("./ibm-plex-serif-v19-latin-700italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* noto-serif-sc-200 - chinese-simplified */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "Noto Serif SC";
+  font-style: normal;
+  font-weight: 200;
+  src: url("./noto-serif-sc-v22-chinese-simplified-200.woff2")
+    format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* noto-serif-sc-300 - chinese-simplified */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "Noto Serif SC";
+  font-style: normal;
+  font-weight: 300;
+  src: url("./noto-serif-sc-v22-chinese-simplified-300.woff2")
+    format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* noto-serif-sc-regular - chinese-simplified */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "Noto Serif SC";
+  font-style: normal;
+  font-weight: 400;
+  src: url("./noto-serif-sc-v22-chinese-simplified-regular.woff2")
+    format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* noto-serif-sc-500 - chinese-simplified */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "Noto Serif SC";
+  font-style: normal;
+  font-weight: 500;
+  src: url("./noto-serif-sc-v22-chinese-simplified-500.woff2")
+    format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* noto-serif-sc-600 - chinese-simplified */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "Noto Serif SC";
+  font-style: normal;
+  font-weight: 600;
+  src: url("./noto-serif-sc-v22-chinese-simplified-600.woff2")
+    format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* noto-serif-sc-700 - chinese-simplified */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "Noto Serif SC";
+  font-style: normal;
+  font-weight: 700;
+  src: url("./noto-serif-sc-v22-chinese-simplified-700.woff2")
+    format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+/* noto-serif-sc-900 - chinese-simplified */
+@font-face {
+  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+  font-family: "Noto Serif SC";
+  font-style: normal;
+  font-weight: 900;
+  src: url("./noto-serif-sc-v22-chinese-simplified-900.woff2")
+    format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
--- a/src/assets/fonts/ibm-plex-serif-v19-latin-100.woff2
+++ b/src/assets/fonts/ibm-plex-serif-v19-latin-100.woff2
--- a/src/assets/fonts/ibm-plex-serif-v19-latin-100italic.woff2
+++ b/src/assets/fonts/ibm-plex-serif-v19-latin-100italic.woff2
--- a/src/assets/fonts/ibm-plex-serif-v19-latin-200.woff2
+++ b/src/assets/fonts/ibm-plex-serif-v19-latin-200.woff2
--- a/src/assets/fonts/ibm-plex-serif-v19-latin-200italic.woff2
+++ b/src/assets/fonts/ibm-plex-serif-v19-latin-200italic.woff2
--- a/src/assets/fonts/ibm-plex-serif-v19-latin-300.woff2
+++ b/src/assets/fonts/ibm-plex-serif-v19-latin-300.woff2
--- a/src/assets/fonts/ibm-plex-serif-v19-latin-300italic.woff2
+++ b/src/assets/fonts/ibm-plex-serif-v19-latin-300italic.woff2
--- a/src/assets/fonts/ibm-plex-serif-v19-latin-500.woff2
+++ b/src/assets/fonts/ibm-plex-serif-v19-latin-500.woff2
--- a/src/assets/fonts/ibm-plex-serif-v19-latin-500italic.woff2
+++ b/src/assets/fonts/ibm-plex-serif-v19-latin-500italic.woff2
--- a/src/assets/fonts/ibm-plex-serif-v19-latin-600.woff2
+++ b/src/assets/fonts/ibm-plex-serif-v19-latin-600.woff2
--- a/src/assets/fonts/ibm-plex-serif-v19-latin-600italic.woff2
+++ b/src/assets/fonts/ibm-plex-serif-v19-latin-600italic.woff2
--- a/src/assets/fonts/ibm-plex-serif-v19-latin-700.woff2
+++ b/src/assets/fonts/ibm-plex-serif-v19-latin-700.woff2
--- a/src/assets/fonts/ibm-plex-serif-v19-latin-700italic.woff2
+++ b/src/assets/fonts/ibm-plex-serif-v19-latin-700italic.woff2
--- a/src/assets/fonts/ibm-plex-serif-v19-latin-italic.woff2
+++ b/src/assets/fonts/ibm-plex-serif-v19-latin-italic.woff2
--- a/src/assets/fonts/ibm-plex-serif-v19-latin-regular.woff2
+++ b/src/assets/fonts/ibm-plex-serif-v19-latin-regular.woff2
--- a/src/assets/fonts/noto-serif-sc-v22-chinese-simplified-200.woff2
+++ b/src/assets/fonts/noto-serif-sc-v22-chinese-simplified-200.woff2
--- a/src/assets/fonts/noto-serif-sc-v22-chinese-simplified-300.woff2
+++ b/src/assets/fonts/noto-serif-sc-v22-chinese-simplified-300.woff2
--- a/src/assets/fonts/noto-serif-sc-v22-chinese-simplified-500.woff2
+++ b/src/assets/fonts/noto-serif-sc-v22-chinese-simplified-500.woff2
--- a/src/assets/fonts/noto-serif-sc-v22-chinese-simplified-600.woff2
+++ b/src/assets/fonts/noto-serif-sc-v22-chinese-simplified-600.woff2
--- a/src/assets/fonts/noto-serif-sc-v22-chinese-simplified-700.woff2
+++ b/src/assets/fonts/noto-serif-sc-v22-chinese-simplified-700.woff2
--- a/src/assets/fonts/noto-serif-sc-v22-chinese-simplified-900.woff2
+++ b/src/assets/fonts/noto-serif-sc-v22-chinese-simplified-900.woff2
--- a/src/assets/fonts/noto-serif-sc-v22-chinese-simplified-regular.woff2
+++ b/src/assets/fonts/noto-serif-sc-v22-chinese-simplified-regular.woff2
--- a/src/components/Navbar.astro
+++ b/src/components/Navbar.astro
@ -0,0 +1,117 @@
+---
+interface MenuItem {
+  href: string;
+  label: string;
+  children?: MenuItem[];
+}
+
+const items: MenuItem[] = [
+  { href: "/posts", label: "记录" },
+  { href: "/annoucements", label: "情报" },
+  { href: "/projects", label: "企划" },
+];
+---
+
+<div class="fixed top-0 navbar shadow-md bg-base-100 lg:px-5">
+  <div class="navbar-start">
+    <div class="dropdown">
+      <div tabindex="0" role="button" class="btn btn-ghost lg:hidden">
+        <svg
+          xmlns="http://www.w3.org/2000/svg"
+          class="h-5 w-5"
+          fill="none"
+          viewBox="0 0 24 24"
+          stroke="currentColor"
+          ><path
+            stroke-linecap="round"
+            stroke-linejoin="round"
+            stroke-width="2"
+            d="M4 6h16M4 12h8m-8 6h16"></path></svg
+        >
+      </div>
+      <ul
+        tabindex="0"
+        class="menu menu-sm dropdown-content mt-3 z-[1] p-2 shadow bg-base-100 rounded-box w-52"
+      >
+        {
+          items.map((item) => (
+            <li>
+              <a href={item.href}>{item.label}</a>
+              {item.children && (
+                <ul class="p-2">
+                  {item.children?.map((child) => (
+                    <li>
+                      <a href={item.href}>{item.label}</a>
+                    </li>
+                  ))}
+                </ul>
+              )}
+            </li>
+          ))
+        }
+      </ul>
+    </div>
+    <a class="btn btn-ghost text-xl">山羊寒舍</a>
+  </div>
+  <div class="navbar-center hidden lg:flex">
+    <ul class="menu menu-horizontal px-1">
+      {
+        items.map((item) => (
+          <li>
+            {item.children ? (
+              <details>
+                <summary>{item.label}</summary>
+                <ul class="p-2">
+                  <ul class="p-2">
+                    {item.children?.map((child) => (
+                      <li>
+                        <a href={item.href}>{item.label}</a>
+                      </li>
+                    ))}
+                  </ul>
+                </ul>
+              </details>
+            ) : (
+              <a href={item.href}>{item.label}</a>
+            )}
+          </li>
+        ))
+      }
+    </ul>
+  </div>
+  <div class="navbar-end">
+    <label class="swap swap-rotate px-[16px]">
+      <input
+        type="checkbox"
+        class="theme-controller"
+        value="light"
+        data-toggle-theme="dark,light"
+        data-act-class="active"
+      />
+
+      <svg
+        class="swap-on fill-current w-8 h-8"
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 24 24"
+        ><path
+          d="M5.64,17l-.71.71a1,1,0,0,0,0,1.41,1,1,0,0,0,1.41,0l.71-.71A1,1,0,0,0,5.64,17ZM5,12a1,1,0,0,0-1-1H3a1,1,0,0,0,0,2H4A1,1,0,0,0,5,12Zm7-7a1,1,0,0,0,1-1V3a1,1,0,0,0-2,0V4A1,1,0,0,0,12,5ZM5.64,7.05a1,1,0,0,0,.7.29,1,1,0,0,0,.71-.29,1,1,0,0,0,0-1.41l-.71-.71A1,1,0,0,0,4.93,6.34Zm12,.29a1,1,0,0,0,.7-.29l.71-.71a1,1,0,1,0-1.41-1.41L17,5.64a1,1,0,0,0,0,1.41A1,1,0,0,0,17.66,7.34ZM21,11H20a1,1,0,0,0,0,2h1a1,1,0,0,0,0-2Zm-9,8a1,1,0,0,0-1,1v1a1,1,0,0,0,2,0V20A1,1,0,0,0,12,19ZM18.36,17A1,1,0,0,0,17,18.36l.71.71a1,1,0,0,0,1.41,0,1,1,0,0,0,0-1.41ZM12,6.5A5.5,5.5,0,1,0,17.5,12,5.51,5.51,0,0,0,12,6.5Zm0,9A3.5,3.5,0,1,1,15.5,12,3.5,3.5,0,0,1,12,15.5Z"
+        ></path></svg
+      >
+
+      <svg
+        class="swap-off fill-current w-8 h-8"
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 24 24"
+        ><path
+          d="M21.64,13a1,1,0,0,0-1.05-.14,8.05,8.05,0,0,1-3.37.73A8.15,8.15,0,0,1,9.08,5.49a8.59,8.59,0,0,1,.25-2A1,1,0,0,0,8,2.36,10.14,10.14,0,1,0,22,14.05,1,1,0,0,0,21.64,13Zm-9.5,6.69A8.14,8.14,0,0,1,7.08,5.22v.27A10.15,10.15,0,0,0,17.22,15.63a9.79,9.79,0,0,0,2.1-.22A8.11,8.11,0,0,1,12.14,19.73Z"
+        ></path></svg
+      >
+    </label>
+  </div>
+</div>
+
+<script>
+  import { themeChange } from "theme-change";
+
+  themeChange();
+</script>
--- a/src/env.d.ts
+++ b/src/env.d.ts
@ -0,0 +1 @@
+/// <reference types="astro/client" />
--- a/src/layouts/PageLayout.astro
+++ b/src/layouts/PageLayout.astro
@ -0,0 +1,9 @@
+---
+import RootLayout from "./RootLayout.astro";
+---
+
+<RootLayout>
+  <main class="container h-fullpage mt-[81px]">
+    <slot />
+  </main>
+</RootLayout>
--- a/src/layouts/RootLayout.astro
+++ b/src/layouts/RootLayout.astro
@ -0,0 +1,58 @@
+---
+import "../assets/fonts/fonts.css";
+
+import Navbar from "../components/Navbar.astro";
+import { ViewTransitions } from "astro:transitions";
+
+const { title } = Astro.props;
+---
+
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <meta name="viewport" content="width=device-width" />
+    <meta name="generator" content={Astro.generator} />
+    <title>{title}</title>
+
+    <script is:inline>
+      if (localStorage.getItem("theme") === null) {
+        document.documentElement.setAttribute("data-theme", "light");
+      } else {
+        document.documentElement.setAttribute(
+          "data-theme",
+          localStorage.getItem("theme")
+        );
+      }
+    </script>
+
+    <ViewTransitions />
+  </head>
+  <body>
+    <!-- Header -->
+    <Navbar />
+
+    <!-- Content -->
+    <slot />
+    <style>
+      html {
+        overflow-x: hidden !important;
+        overflow-y: auto !important;
+      }
+    </style>
+
+    <style is:global>
+      .h-fullpage {
+        height: calc(100vh - 64px);
+      }
+
+      .max-h-fullpage {
+        max-height: calc(100vh - 64px);
+      }
+
+      .mt-header {
+        margin-top: 64px;
+      }
+    </style>
+  </body>
+</html>
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@ -0,0 +1,241 @@
+---
+import RootLayout from "../layouts/RootLayout.astro";
+
+import { client } from "../..//tina/__generated__/client";
+import { TinaMarkdown } from "tinacms/dist/rich-text";
+
+const eventsResponse = await client.queries.eventConnection();
+const events = eventsResponse.data.eventConnection.edges
+  ?.reverse()
+  .map((event) => {
+    return { ...event?.node, slug: event?.node?._sys.filename };
+  });
+---
+
+<RootLayout>
+  <div class="max-h-fullpage mt-header wrapper px-5 snap-y snap-mandatory">
+    <div id="hello" class="hero h-fullpage snap-start">
+      <div
+        class="hero-content w-full grid grid-cols-1 md:grid-cols-2 max-md:gap-[60px]"
+      >
+        <div class="max-md:text-center">
+          <h1 class="text-5xl font-bold">你好呀 👋</h1>
+          <p class="py-6">
+            欢迎来到 SmartSheep Studio
+            的官方网站！在这里了解，订阅，跟踪我们的最新消息。
+            接触我们最大的官方社区，并且尝试最新产品，参与各种活动，提供反馈，让我们更好的服务您。
+          </p>
+          <a href="#about" class="btn btn-primary btn-md">了解更多</a>
+        </div>
+
+        <div class="flex justify-center md:justify-end max-md:order-first">
+          <div
+            class="spinning p-3 md:p-5 shadow-2xl aspect-square rounded-[30%] w-[192px] md:w-[256px] lg:w-[384px]"
+          >
+            <img src="/favicon.svg" alt="logo" loading="lazy" />
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div id="about" class="hero h-fullpage snap-start">
+      <div
+        class="hero-content w-full grid grid-cols-1 md:grid-cols-2 max-md:gap-[60px]"
+      >
+        <div class="flex justify-center md:justify-start">
+          <div class="stats shadow">
+            <div class="stat">
+              <div class="stat-figure text-secondary">
+                <svg
+                  xmlns="http://www.w3.org/2000/svg"
+                  fill="none"
+                  viewBox="0 0 24 24"
+                  class="inline-block w-8 h-8 stroke-current"
+                  ><path
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                    stroke-width="2"
+                    d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
+                  ></path></svg
+                >
+              </div>
+              <div class="stat-title">People</div>
+              <div class="stat-value">1</div>
+              <div class="stat-desc">2019 - {new Date().getFullYear()}</div>
+            </div>
+
+            <div class="stat">
+              <div class="stat-figure text-secondary">
+                <svg
+                  xmlns="http://www.w3.org/2000/svg"
+                  fill="none"
+                  viewBox="0 0 24 24"
+                  class="inline-block w-8 h-8 stroke-current"
+                  ><path
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                    stroke-width="2"
+                    d="M12 6V4m0 2a2 2 0 100 4m0-4a2 2 0 110 4m-6 8a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4m6 6v10m6-2a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4"
+                  ></path></svg
+                >
+              </div>
+              <div class="stat-title">Clients</div>
+              <div class="stat-value">180</div>
+              <div class="stat-desc">↗︎ 80 (44%)</div>
+            </div>
+
+            <div class="stat">
+              <div class="stat-figure text-secondary">
+                <svg
+                  xmlns="http://www.w3.org/2000/svg"
+                  fill="none"
+                  viewBox="0 0 24 24"
+                  class="inline-block w-8 h-8 stroke-current"
+                  ><path
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                    stroke-width="2"
+                    d="M5 8h14M5 8a2 2 0 110-4h14a2 2 0 110 4M5 8v10a2 2 0 002 2h10a2 2 0 002-2V8m-9 4h4"
+                  ></path></svg
+                >
+              </div>
+              <div class="stat-title">Products</div>
+              <div class="stat-value">4</div>
+              <div class="stat-desc">↘︎ 8 (67%)</div>
+            </div>
+          </div>
+        </div>
+
+        <div class="max-md:text-center">
+          <h1 class="text-5xl font-bold">关于我们 🔖</h1>
+          <p class="py-6">
+            我们是一群充满活力、对开源充满热情的开发者。成立于 2019
+            年。自那年起我们一直在开发让人喜欢的开源软件。在我们这里，“取之于开源，用之于开源”
+            不仅是原则，更是我们信仰的座右铭。
+          </p>
+          <a href="#history" class="btn btn-primary btn-md pl-[24px]">查看「岁月史书」</a>
+        </div>
+      </div>
+    </div>
+
+    <div
+      id="history"
+      class="flex flex-col justify-center items-center h-fullpage snap-start"
+    >
+      <div class="text-center">
+        <div>
+          <h1 class="text-4xl font-bold">岁月史书</h1>
+          <p class="pt-2 pb-4 tracking-[8px]">但当涉猎，见往事耳</p>
+          <ul
+            class="pb-6 mx-[-20px] max-w-[100vw] px-5 flex justify-center history timeline timeline-horizontal"
+          >
+            {
+              events?.map((item: any, idx: number) => (
+                <li>
+                  {idx > 0 && <hr />}
+                  <div class="timeline-start">
+                    {new Date(item.date).toLocaleDateString()}
+                  </div>
+                  <div class="timeline-middle">
+                    <svg
+                      xmlns="http://www.w3.org/2000/svg"
+                      viewBox="0 0 20 20"
+                      fill="currentColor"
+                      class="w-5 h-5"
+                    >
+                      <path
+                        fill-rule="evenodd"
+                        d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z"
+                        clip-rule="evenodd"
+                      />
+                    </svg>
+                  </div>
+                  <div class="timeline-end timeline-box">
+                    <h2 class="font-bold">{item.title}</h2>
+                    <div class="line-clamp-2">
+                      <TinaMarkdown content={item._body} />
+                    </div>
+                  </div>
+                  {idx < events?.length - 1 && <hr />}
+                </li>
+              ))
+            }
+          </ul>
+          <a class="btn btn-primary" href="/events">查看更多</a>
+        </div>
+      </div>
+    </div>
+  </div>
+</RootLayout>
+
+<script>
+  function debounce(func: any, timeout = 300) {
+    let timer: number;
+    return (...args: any[]) => {
+      clearTimeout(timer);
+      // @ts-ignore
+      timer = setTimeout(() => {
+        // @ts-ignore
+        func.apply(this, args);
+      }, timeout);
+    };
+  }
+
+  // Makes scroll means slide to next page
+  const wrapper = document.querySelector<HTMLDivElement>(".wrapper");
+  const template = document.querySelector<HTMLDivElement>("#hello");
+  const scroll = debounce((negative: boolean) => {
+    if (wrapper) {
+      console.log("scrolled");
+      let range = negative
+        ? -(template?.clientHeight ?? 0)
+        : template?.clientHeight ?? 0;
+      wrapper.scrollTop += range;
+    }
+  }, 40); // 40ms to prevent touchpad and smooth scroll software
+  wrapper?.addEventListener("wheel", (event) => {
+    event.preventDefault();
+    event.stopPropagation();
+    scroll(event.deltaY < 0);
+  });
+</script>
+
+<style>
+  .spinning {
+    animation: 5s ease-in-out infinite running spinning;
+  }
+
+  @keyframes spinning {
+    0% {
+      rotate: 0deg;
+    }
+    60% {
+      rotate: 360deg;
+    }
+    100% {
+      rotate: 360deg;
+    }
+  }
+</style>
+
+<style scoped>
+  .wrapper {
+    overflow-y: auto;
+    scrollbar-width: none;
+    scroll-behavior: smooth;
+  }
+
+  .wrapper::-webkit-scrollbar {
+    width: 0;
+  }
+
+  .history {
+    overflow-x: auto;
+    scrollbar-width: none;
+    scroll-behavior: smooth;
+  }
+
+  .history::-webkit-scrollbar {
+    width: 0;
+  }
+</style>
--- a/tailwind.config.mjs
+++ b/tailwind.config.mjs
@ -0,0 +1,41 @@
+/** @type {import('tailwindcss').Config} */
+export default {
+  content: ["./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}"],
+  daisyui: {
+    themes: [
+      {
+        light: {
+          ...require("daisyui/src/theming/themes")["light"],
+          primary: "#4750a3",
+          secondary: "#93c5fd",
+          accent: "#0f766e",
+          info: "#67e8f9",
+          success: "#15803d",
+          warning: "#f97316",
+          error: "#dc2626",
+          "--rounded-box": "0",
+          "--rounded-btn": "0",
+          "--rounded-badge": "0",
+          "--tab-radius": "0",
+        },
+      },
+      {
+        dark: {
+          ...require("daisyui/src/theming/themes")["dark"],
+          primary: "#4750a3",
+          secondary: "#93c5fd",
+          accent: "#0f766e",
+          info: "#67e8f9",
+          success: "#15803d",
+          warning: "#f97316",
+          error: "#dc2626",
+          "--rounded-box": "0",
+          "--rounded-btn": "0",
+          "--rounded-badge": "0",
+          "--tab-radius": "0",
+        },
+      },
+    ],
+  },
+  plugins: [require("daisyui"), require("@tailwindcss/typography")],
+};
--- a/tina/.gitignore
+++ b/tina/.gitignore
@ -0,0 +1 @@
+__generated__
--- a/tina/collection/author.ts
+++ b/tina/collection/author.ts
@ -0,0 +1,30 @@
+import type { Collection } from "tinacms";
+
+const Author: Collection = {
+  label: "Authors",
+  name: "author",
+  path: "content/authors",
+  format: "mdx",
+  fields: [
+    {
+      type: "string",
+      label: "Name",
+      name: "name",
+      isTitle: true,
+      required: true,
+    },
+    {
+      type: "image",
+      label: "Avatar",
+      name: "avatar",
+    },
+    {
+      type: "rich-text",
+      label: "Introduction",
+      name: "_body",
+      templates: [],
+      isBody: true,
+    },
+  ],
+};
+export default Author;
--- a/tina/collection/event.ts
+++ b/tina/collection/event.ts
@ -0,0 +1,51 @@
+import type { Collection } from "tinacms";
+
+const Event: Collection = {
+  label: "Events",
+  name: "event",
+  path: "content/events",
+  format: "mdx",
+  ui: {
+    router: ({ document }) => {
+      return `/events/${document._sys.filename}`;
+    },
+  },
+  fields: [
+    {
+      type: "string",
+      label: "Title",
+      name: "title",
+      isTitle: true,
+      required: true,
+    },
+    {
+      type: "image",
+      name: "heroImg",
+      label: "Hero Image",
+    },
+    {
+      type: "reference",
+      label: "Author",
+      name: "author",
+      collections: ["author"],
+    },
+    {
+      type: "datetime",
+      label: "Published Date",
+      name: "date",
+      ui: {
+        dateFormat: "MMMM DD YYYY",
+        timeFormat: "hh:mm A",
+      },
+    },
+    {
+      type: "rich-text",
+      label: "Body",
+      name: "_body",
+      templates: [],
+      isBody: true,
+    },
+  ],
+};
+
+export default Event;
--- a/tina/collection/page.ts
+++ b/tina/collection/page.ts
@ -0,0 +1,36 @@
+import type { Collection } from "tinacms";
+
+const Page: Collection = {
+  label: "Pages",
+  name: "page",
+  path: "content/pages",
+  format: "mdx",
+  ui: {
+    router: ({ document }) => {
+      if (document._sys.filename === "about") {
+        return `/about`;
+      }
+      return undefined;
+    },
+  },
+  fields: [
+    {
+      type: "string",
+      label: "Title",
+      name: "title",
+      description:
+        "The title of the page. This is used to display the title in the CMS",
+      isTitle: true,
+      required: true,
+    },
+    {
+      type: "rich-text",
+      label: "Body",
+      name: "_body",
+      templates: [],
+      isBody: true,
+    },
+  ],
+};
+
+export default Page;
--- a/tina/collection/post.ts
+++ b/tina/collection/post.ts
@ -0,0 +1,56 @@
+import type { Collection } from "tinacms";
+
+const Post: Collection = {
+  label: "Posts",
+  name: "post",
+  path: "content/posts",
+  format: "mdx",
+  ui: {
+    router: ({ document }) => {
+      return `/posts/${document._sys.filename}`;
+    },
+  },
+  fields: [
+    {
+      type: "string",
+      label: "Title",
+      name: "title",
+      isTitle: true,
+      required: true,
+    },
+    {
+      type: "image",
+      name: "heroImg",
+      label: "Hero Image",
+    },
+    {
+      type: "rich-text",
+      label: "Excerpt",
+      name: "excerpt",
+    },
+    {
+      type: "reference",
+      label: "Author",
+      name: "author",
+      collections: ["author"],
+    },
+    {
+      type: "datetime",
+      label: "Published Date",
+      name: "date",
+      ui: {
+        dateFormat: "MMMM DD YYYY",
+        timeFormat: "hh:mm A",
+      },
+    },
+    {
+      type: "rich-text",
+      label: "Body",
+      name: "_body",
+      templates: [],
+      isBody: true,
+    },
+  ],
+};
+
+export default Post;
--- a/tina/config.ts
+++ b/tina/config.ts
@ -0,0 +1,41 @@
+import { defineConfig } from "tinacms";
+import Author from "./collection/author";
+import Event from "./collection/event";
+import Post from "./collection/post";
+import Page from "./collection/page";
+
+// Your hosting provider likely exposes this as an environment variable
+const branch =
+  process.env.GITHUB_BRANCH ||
+  process.env.VERCEL_GIT_COMMIT_REF ||
+  process.env.HEAD ||
+  "main";
+
+export default defineConfig({
+  branch,
+
+  // Get this from tina.io
+  clientId: process.env.NEXT_PUBLIC_TINA_CLIENT_ID,
+  // Get this from tina.io
+  token: process.env.TINA_TOKEN,
+
+  build: {
+    outputFolder: "admin",
+    publicFolder: "public",
+  },
+  media: {
+    tina: {
+      mediaRoot: "",
+      publicFolder: "public",
+    },
+  },
+  // See docs on content modeling for more info on how to setup new content models: https://tina.io/docs/schema/
+  schema: {
+    collections: [
+      Author,
+      Event,
+      Page,
+      Post,
+    ],
+  },
+});
--- a/tina/tina-lock.json
+++ b/tina/tina-lock.json
--- a/tsconfig.json
+++ b/tsconfig.json
@ -0,0 +1,7 @@
+{
+  "extends": "astro/tsconfigs/strict",
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "jsxImportSource": "react"
+  }
+}
--- a/yarn.lock
+++ b/yarn.lock