chore: dynamic version on web

Author: Flyrell

.github/workflows/deploy.yml

@@ -24,6 +24,11 @@ jobs:
         working-directory: tools/sitemap
         run: go run . -docs ${{ github.workspace }}/web/docs -out ${{ github.workspace }}/web/sitemap.xml
 
+      - name: Inject version into HTML
+        run: |
+          VERSION="${GITHUB_REF_NAME}"
+          find ./web -name '*.html' -exec sed -i "s/__VERSION__/${VERSION}/g" {} +
+
       - name: Deploy via SFTP
         run: |
           sudo apt-get update -qq && sudo apt-get install -y -qq lftp

Taskfile.yml

@@ -76,9 +76,15 @@ tasks:
   web:dev:
     desc: Serve website locally with Apache (port 8080)
     deps: [docs, sitemap]
-    cmd: >-
-      docker run --rm -p 8080:80
-      -v "$PWD/web":/usr/local/apache2/htdocs/
-      -v "$PWD/web/httpd-dev.conf":/usr/local/apache2/conf/extra/dev.conf
-      httpd:alpine
-      sh -c "echo 'Include conf/extra/dev.conf' >> /usr/local/apache2/conf/httpd.conf && httpd-foreground"
+    vars:
+      WEB_VERSION:
+        sh: git describe --tags --abbrev=0 2>/dev/null || echo "dev"
+    cmds:
+      - find ./web -name '*.html' -exec sed -i '' 's/__VERSION__/{{.WEB_VERSION}}/g' {} +
+      - defer: find ./web -name '*.html' -exec sed -i '' 's/{{.WEB_VERSION}}/__VERSION__/g' {} +
+      - >-
+        docker run --rm -p 8080:80
+        -v "$PWD/web":/usr/local/apache2/htdocs/
+        -v "$PWD/web/httpd-dev.conf":/usr/local/apache2/conf/extra/dev.conf
+        httpd:alpine
+        sh -c "echo 'Include conf/extra/dev.conf' >> /usr/local/apache2/conf/httpd.conf && httpd-foreground"

web/css/style.css

@@ -164,6 +164,15 @@ code, pre {
   color: var(--text-primary);
 }
 
+.nav-version {
+  font-size: 0.8rem;
+  font-weight: 500;
+  color: var(--text-secondary);
+  opacity: 0.7;
+  margin-top: 3px;
+  margin-left: -2px;
+}
+
 .nav-icon {
   color: var(--accent);
 }

web/index.html

@@ -84,6 +84,7 @@
           <path d="M200.391 144.281H259.706C267.722 144.281 270.928 153.9 264.516 158.709L234.056 184.359C230.85 187.566 226.041 187.566 222.834 184.359L192.375 158.709C185.963 153.9 190.772 144.281 197.184 144.281H200.391Z" fill="white"/>
         </svg>
         <span>Hourgit</span>
+        <span class="nav-version">__VERSION__</span>
       </a>
       <div class="nav-links">
         <a href="#how-it-works">How it works</a>
@@ -164,11 +165,11 @@ <h3>Install in seconds</h3>
               </div>
               <pre><code><span class="t-prompt">$</span> curl -fsSL https://hourgit.com/install.sh | bash
 <span class="t-output">info  Platform: darwin/arm64
-info  Latest version: <span class="t-accent">v0.8.0</span>
-info  Downloading hourgit-darwin-arm64-v0.8.0...
+info  Latest version: <span class="t-accent">__VERSION__</span>
+info  Downloading hourgit-darwin-arm64-__VERSION__...
 info  Checksum verified
 info  Installed to <span class="t-accent">~/.hourgit/bin/hourgit</span>
-<span class="t-success">Hourgit v0.8.0 installed successfully!</span></span></code></pre>
+<span class="t-success">Hourgit __VERSION__ installed successfully!</span></span></code></pre>
             </div>
           </div>
         </div>