Merge branch 'dev'

feat(workflow): auto merge master to blog content

.github/workflows/deploy-blog.yml

@@ -1,43 +1,106 @@
-name: Deploy Astro Blog
+name: Sync and Deploy Astro Blog
 
 on:
   push:
     branches:
-      - blog-content
+      - master
-    paths:
+
-      - 'src/blog/**'
-      - 'src/friends/**'
-      - 'package.json'
-      - 'package-lock.json'
-      - 'astro.config.mjs'
-      - 'astro.config.ts'
-      - 'public/**'
-      - '.github/workflows/deploy-blog.yml'
   workflow_dispatch:
 
-  discussion:
-    types: [created, category_changed]
-
-  discussion_comment:
-    types: [created, edited, deleted]
-
 concurrency:
   group: deploy-blog
   cancel-in-progress: true
 
 jobs:
+  sync-blog-content:
+    if: github.event_name == 'push'
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Configure git
+        run: |
+          git config user.name "github-actions[bot]"
+          git config user.email "41898282+github-actions[bot]@users.noreply.github.com"
+
+      - name: Checkout blog-content branch
+        run: |
+          git checkout blog-content
+          git pull origin blog-content
+
+      - name: Merge master into blog-content
+        run: |
+          git merge origin/master --no-edit
+
+      - name: Push blog-content
+        run: |
+          git push origin blog-content
+
   build-and-deploy:
-    if: >
+    needs: sync-blog-content
-      github.event_name == 'push' ||
+    if: github.event_name == 'push'
-      github.event_name == 'workflow_dispatch' ||
+    runs-on: ubuntu-latest
-      (
+
-        github.event_name == 'discussion' &&
+    env:
-        github.event.discussion.category.slug == 'comments'
+      DEPLOY_HOST: ${{ vars.DEPLOY_HOST }}
-      ) ||
+      DEPLOY_PORT: ${{ vars.DEPLOY_PORT }}
-      (
+      DEPLOY_PATH: ${{ vars.DEPLOY_PATH }}
-        github.event_name == 'discussion_comment' &&
+      DEPLOY_USER: ${{ vars.DEPLOY_USER }}
-        github.event.discussion.category.slug == 'comments'
+
-      )
+    steps:
+      - name: Checkout blog-content branch
+        uses: actions/checkout@v4
+        with:
+          ref: blog-content
+
+      - name: Setup Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 24
+          cache: npm
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Create .env file
+        run: |
+          cat > .env <<'EOF'
+          ${{ secrets.ENV_FILE }}
+          EOF
+
+      - name: Build Astro site
+        run: npm run build
+
+      - name: Install rsync and ssh client
+        run: sudo apt-get update && sudo apt-get install -y rsync openssh-client
+
+      - name: Setup SSH
+        run: |
+          mkdir -p ~/.ssh
+          echo "${{ secrets.DEPLOY_SSH_KEY }}" > ~/.ssh/id_rsa
+          chmod 600 ~/.ssh/id_rsa
+          echo "${{ secrets.DEPLOY_KNOWN_HOSTS }}" > ~/.ssh/known_hosts
+          chmod 644 ~/.ssh/known_hosts
+
+      - name: Deploy to server
+        run: |
+          rsync -avz --delete \
+            --omit-dir-times \
+            --no-perms \
+            --no-owner \
+            --no-group \
+            -e "ssh -p ${DEPLOY_PORT}" \
+            dist/ \
+            ${DEPLOY_USER}@${DEPLOY_HOST}:${DEPLOY_PATH}/
+
+  manual-deploy:
+    if: github.event_name == 'workflow_dispatch'
     runs-on: ubuntu-latest
 
     env:

README-en.md

@@ -86,6 +86,10 @@ For installation and deployment details, please refer to the official documentat
 
 For details, see: <b>[ChangeLog-en.md](./docs/ChangeLog-en.md)</b>
 
+### 6. Older Versions
+
+Older versions of GISCUS are available on the <b>[deprecated/giscus](https://github.com/ClovertaTheTrilobita/SanYeCao-blog/tree/deprecated/giscus)</b> branch, but they haven’t been updated in a while and may contain numerous issues.
+
 <hr>
 
 ## ⚖️ License 

README.md

@@ -1,6 +1,6 @@
 # SanYeCao-Blog
 
-[中文](README.md) | [English](README-en.md)
+<p align="right">[<a href="./README.md">中文</a> | <a href="./README-en.md">English</a>]</p>
 
 <p align="center"><br>
     ✨三叶草Blog✨<br>
@@ -88,6 +88,10 @@
 
 详情请看：<b>[ChangeLog.md](./docs/ChangeLog.md)</b>
 
+### 6. 旧版本
+
+支持GISCUS的旧版本在 <b>[deprecated/giscus](https://github.com/ClovertaTheTrilobita/SanYeCao-blog/tree/deprecated/giscus)</b> 分支上，但是它有些时候没更新了，可能会有诸多问题。
+
 <hr>
 
 ## ⚖️ 许可

src/components/Navigation.astro

@@ -143,7 +143,7 @@ const t = getTranslations(lang);
         color: white;
     }
 
-    @media (max-width: 768px) {
+    @media (max-width: 700px) {
         .site-nav-desktop {
             display: none;
         }

src/components/Posts/PostItem.astro

@@ -1,14 +1,32 @@
 ---
 import "@/styles/global.css";
 import Remark42Count from "@/components/remark42-counter.svelte";
+import { getLangFromUrl } from "@/i18n";
+
+const lang = getLangFromUrl(Astro.url);
 const data = Astro.props;
+const tags = data.tags;
 ---
 
 <li class="post-card">
-  <a href={data.url} class="post-link" data-astro-reload>
+  <div class="post-link">
     <div class="post-text">
-      <span class="post-title">{data.title}</span>
+      <a href={data.url} class="post-title">
-      <span class="post-description">{data.description}</span>
+        {data.title}
+      </a>
+
+      <a href={data.url} class="post-description">
+        {data.description}
+      </a>
+      <div class="tags">
+        {
+          tags.map((tag: string) => (
+            <p class="tag">
+              <a href={`/${lang}/tags/${tag}`}>{tag}</a>
+            </p>
+          ))
+        }
+      </div>
 
       <div class="post-meta-row">
         <span class="post-date">{data.date}</span>
@@ -20,13 +38,73 @@ const data = Astro.props;
       </div>
     </div>
 
-    <img src={data.img} alt={data.title} class="post-image" loading="lazy" />
+    <a href={data.url} class="post-image-link">
-  </a>
+      <img src={data.img} alt={data.title} class="post-image" loading="lazy" />
+    </a>
+  </div>
 </li>
 
 <div class="section-divider"></div>
 
 <style>
+  .tags {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.4rem;
+    margin-top: 0.5rem;
+    margin-bottom: 0.5rem;
+  }
+
+  .tag {
+    font-family:
+      system-ui,
+      -apple-system,
+      BlinkMacSystemFont,
+      "Segoe UI",
+      Roboto,
+      Oxygen,
+      Ubuntu,
+      Cantarell,
+      "Open Sans",
+      "Helvetica Neue",
+      sans-serif;
+
+    margin: 0;
+    padding: 0.22em 0.65em;
+    font-size: 1rem;
+    line-height: 1.2;
+    border: 1px dashed #8b6b4a;
+    border-radius: 0;
+    background-color: transparent;
+  }
+
+  .tag a {
+    color: #6f4e37;
+    text-decoration: none;
+    font-size: 0.8rem;
+    font-weight: 500;
+  }
+
+  .tag a:hover {
+    text-decoration: underline;
+  }
+
+  :global(.dark) .tag {
+    border-color: #d8c7a1;
+  }
+
+  :global(.dark) .tag a {
+    color: #e6d8b8;
+  }
+
+  :global(.dark) .tag {
+    border-color: #d8c7a1;
+  }
+
+  :global(.dark) .tag a {
+    color: #e6d8b8;
+  }
+
   .post-card {
     list-style: none;
     margin: 0 0 1rem 0;
@@ -47,6 +125,7 @@ const data = Astro.props;
   .post-text {
     flex: 1;
     min-width: 0;
+    max-width: 40rem;
     display: flex;
     flex-direction: column;
     justify-content: space-between;
@@ -57,7 +136,6 @@ const data = Astro.props;
   .post-title {
     font-family:
       system-ui,
-      sans-serif,
       -apple-system,
       BlinkMacSystemFont,
       "Segoe UI",
@@ -66,9 +144,9 @@ const data = Astro.props;
       Ubuntu,
       Cantarell,
       "Open Sans",
-      "Helvetica Neue";
+      "Helvetica Neue",
-    color: inherit;
+      sans-serif;
-    font-weight: 700;
+    font-weight: 500;
     font-size: 1.34rem;
     line-height: 1.6;
     display: -webkit-box;
@@ -79,7 +157,9 @@ const data = Astro.props;
 
   .post-description {
     color: black;
+    text-decoration: none;
     font-weight: 400;
+    font-size: 0.92rem;
     font-style: italic;
   }
 
@@ -114,12 +194,12 @@ const data = Astro.props;
   }
 
   .post-image {
-    width: calc((1.6em * 4) * 16 / 9);
+    width: calc((1.6em * 4) * 16 / 10);
     height: calc(1.6em * 4);
-    aspect-ratio: 16 / 9;
+    aspect-ratio: 16 / 10;
     object-fit: cover;
     object-position: center;
-    border-radius: 0.5rem;
+    border: 2px #94a0ab dashed;
     flex-shrink: 0;
     display: block;
   }
@@ -132,13 +212,14 @@ const data = Astro.props;
     color: #aab7c4;
   }
 
-  @media (max-width: 640px) {
+  @media (max-width: 600px) {
     .post-link {
       display: grid;
-      grid-template-columns: 1fr 120px;
+      grid-template-columns: 1fr 145px;
       grid-template-areas:
         "title title"
         "desc image"
+        "tags image"
         "meta image";
       column-gap: 0.75rem;
       row-gap: 0.2rem;
@@ -165,9 +246,19 @@ const data = Astro.props;
     }
 
     .post-image {
+      border: none;
       grid-area: image;
-      width: 120px;
+      width: 100%;
-      height: calc(120px * 9 / 16);
+      height: calc(145px * 10 / 16);
+      align-self: center;
+    }
+
+    .post-image-link {
+      grid-area: image;
+      align-self: center;
+      display: block;
+      width: 145px;
+      text-decoration: none;
     }
   }
 </style>

src/components/Posts/PostList.astro

@@ -37,6 +37,7 @@ const latestPosts = filteredPosts.slice(0, 5);
           description={post.data.description}
           date={formattedDate}
           img={post.data.image.url}
+          tags={post.data.tags}
         />
       );
     })

src/pages/[lang]/tags/[tag].astro

@@ -53,6 +53,7 @@ const t = getTranslations(lang);
             title={post.data.title}
             date={formattedDate}
             img={post.data.image.url}
+            tags={post.data.tags}
           />
         );
       })

src/pages/[lang]/tags/index.astro

@@ -39,6 +39,19 @@ const pageTitle = lang === "zh" ? "标签索引" : "Tag Index";
     }
 
     .tag {
+        font-family:
+            system-ui,
+            -apple-system,
+            BlinkMacSystemFont,
+            "Segoe UI",
+            Roboto,
+            Oxygen,
+            Ubuntu,
+            Cantarell,
+            "Open Sans",
+            "Helvetica Neue",
+            sans-serif;
+
         margin: 0;
         padding: 0.22em 0.65em;
         font-size: 1rem;
@@ -51,6 +64,7 @@ const pageTitle = lang === "zh" ? "标签索引" : "Tag Index";
     .tag a {
         color: #6f4e37;
         text-decoration: none;
+        font-weight: 500;
     }
 
     .tag a:hover {