Updates (#5)

Author: smashedr

.github/workflows/dev.yaml

@@ -0,0 +1,119 @@
+name: "Dev"
+
+on:
+  push:
+    branches-ignore: [master]
+    paths:
+      - ".github/workflows/dev.yaml"
+      - ".vitepress/**"
+      - "docs/**"
+      - "package*.json"
+  workflow_dispatch:
+
+env:
+  SSH_HOST: ${{ secrets.DEV_DEPLOY_HOST }}
+  SSH_PORT: ${{ secrets.DEV_DEPLOY_PORT }}
+  SSH_USER: ${{ secrets.DEV_DEPLOY_USER }}
+  SSH_PASS: ${{ secrets.DEV_DEPLOY_PASS }}
+  SSH_DEST: /static
+
+concurrency:
+  group: dev
+  cancel-in-progress: true
+
+jobs:
+  build:
+    name: "Build"
+    runs-on: ubuntu-latest
+    timeout-minutes: 10
+
+    if: ${{ !contains(github.event.head_commit.message, '#nodev') }}
+
+    permissions:
+      contents: read
+
+    steps:
+      - name: "Checkout"
+        uses: actions/checkout@v5
+        with:
+          fetch-depth: 0
+
+      - name: "Setup Node 24"
+        uses: actions/setup-node@v6
+        with:
+          node-version: 24
+
+      - name: "Install Dependencies"
+        run: |
+          npm ci
+
+      - name: "Run Build"
+        run: |
+          npm run build
+
+      - name: "Upload Artifact"
+        uses: actions/upload-artifact@v4
+        with:
+          name: "artifact"
+          path: .vitepress/dist
+
+  deploy:
+    name: "Deploy"
+    runs-on: ubuntu-latest
+    timeout-minutes: 5
+    needs: build
+
+    permissions:
+      pages: write
+      id-token: write
+
+    environment:
+      name: dev
+      url: https://dev-static.cssnr.com/
+
+    steps:
+      - name: "Debug Variables"
+        continue-on-error: true
+        run: |
+          echo "env.SSH_HOST: ${{ env.SSH_HOST }}"
+          echo "env.SSH_PORT: ${{ env.SSH_PORT }}"
+          echo "env.SSH_USER: ${{ env.SSH_USER }}"
+          echo "env.SSH_PASS: ${{ env.SSH_PASS }}"
+          echo "env.SSH_DEST: ${{ env.SSH_DEST }}"
+
+      - name: "Download Artifact"
+        uses: actions/download-artifact@v5
+        with:
+          name: "artifact"
+
+      - name: "Debug Artifact"
+        continue-on-error: true
+        run: |
+          tree .
+
+      - name: "Setup SSH"
+        run: |
+          mkdir -p "${HOME}/.ssh"
+          chmod 0700 "${HOME}/.ssh"
+          ssh-keyscan -p "${{ env.SSH_PORT }}" -H "${{ env.SSH_HOST }}" \
+            | tee -a "${HOME}/.ssh/known_hosts"
+
+      - name: "No Robots"
+        run: |
+          cat <<EOF > robots.txt
+          User-agent: *
+          Disallow: /
+          EOF
+
+      - name: "Deploy Artifact"
+        env:
+          SSHPASS: ${{ env.SSH_PASS }}
+        run: |
+          sshpass -e rsync -aPvh --delete -e 'ssh -p ${{ env.SSH_PORT }}' \
+            ./ "${{ env.SSH_USER }}"@"${{ env.SSH_HOST }}":"${{ env.SSH_DEST }}"
+
+      - name: "Send Discord Notification"
+        uses: sarisia/actions-status-discord@v1
+        with:
+          webhook: ${{ secrets.DISCORD_WEBHOOK }}
+          description: "https://dev-static.cssnr.com/"

.github/workflows/pages.yaml

@@ -69,6 +69,9 @@ jobs:
       name: github-pages
       url: ${{ steps.deployment.outputs.page_url }}
 
+    outputs:
+      page_url: ${{ steps.deployment.outputs.page_url }}
+
     steps:
       - name: "Deploy Pages"
         id: deployment
@@ -101,3 +104,4 @@ jobs:
         uses: sarisia/actions-status-discord@v1
         with:
           webhook: ${{ secrets.DISCORD_WEBHOOK }}
+          description: ${{ needs.deploy.outputs.page_url }}

.vitepress/theme/Layout.vue

@@ -0,0 +1,40 @@
+<script setup>
+import DefaultTheme from 'vitepress/theme'
+
+const { Layout } = DefaultTheme
+</script>
+
+<template>
+  <Layout>
+    <template #home-features-after>
+      <div class="features-after">
+        <a href="https://ko-fi.com/cssnr" target="_blank" rel="noopener">
+          <img alt="Ko-Fi" src="/images/ko-fi.gif" />
+        </a>
+      </div>
+    </template>
+  </Layout>
+</template>
+
+<!--suppress CssUnusedSymbol -->
+<style scoped>
+.features-after {
+  margin-top: 64px;
+  padding: 0 24px;
+  text-align: center;
+}
+.features-after img {
+  margin: auto;
+  display: inline-block;
+  vertical-align: middle;
+  /*    transform: translateZ(0);*/
+  /*    box-shadow: 0 0 1px rgba(0, 0, 0, 0);*/
+  /*    backface-visibility: hidden;*/
+  /*    -moz-osx-font-smoothing: grayscale;*/
+  /*    transition-duration: 0.3s;*/
+  /*    transition-property: transform;*/
+  /*}*/
+  /*.features-after img:hover {*/
+  /*    transform: scale(1.02);*/
+}
+</style>

.vitepress/theme/index.js

@@ -1,6 +1,8 @@
 import DefaultTheme, { VPBadge } from 'vitepress/theme'
 import './custom.css'
 
+// import Layout from './Layout.vue'
+
 import BrowserIcons from './components/BrowserIcons.vue'
 import VPCardLink from './components/VPCardLink.vue'
 
@@ -20,6 +22,8 @@ import '@cssnr/vitepress-swiper/style.css'
 export default {
     ...DefaultTheme,
 
+    // Layout: Layout,
+
     enhanceApp({ app }) {
         app.component('Badge', VPBadge)