feat(ui): add git version info display in header

- Display current branch/tag and commit hash in navbar center
- Show dirty working directory indicator with yellow badge
- Add automatic build info generation in Task workflow
- Include build timestamp and user information
- Style with responsive design (hidden on mobile)
- Add .gitignore entries for generated build artifacts

.gitignore

@@ -13,6 +13,12 @@ tmp/
 # devbox
 .devbox/
 
+# Task cache
+.task/
+
+# Generated build data
+data/
+
 # IDE
 .vscode/
 .idea/

Taskfile.yml

@@ -15,6 +15,7 @@ tasks:
     desc: Build Hugo site
     deps:
       - deps:ensure-npm
+      - build:generate-info
     cmds:
       - "{{.HUGO_CMD}} --gc --minify"
 
@@ -22,13 +23,25 @@ tasks:
     desc: Build Hugo site for development
     deps:
       - deps:ensure-npm
+      - build:generate-info
     cmds:
       - "{{.HUGO_CMD}}"
 
+  build:generate-info:
+    desc: Generate build information (git commit, version, etc.)
+    sources:
+      - .git/HEAD
+      - .git/refs/**/*
+    generates:
+      - data/build_info.json
+    cmds:
+      - ./scripts/generate-build-info.sh
+
   serve:
     desc: Start Hugo dev server
     deps:
       - deps:ensure-npm
+      - build:generate-info
     cmds:
       - "{{.HUGO_CMD}} server"
 
@@ -56,6 +69,7 @@ tasks:
     desc: Test Hugo build
     deps:
       - deps:ensure-npm
+      - build:generate-info
     cmds:
       - "{{.HUGO_CMD}} --gc --minify --logLevel info"
 

layouts/partials/hooks/head-end.html

@@ -3,3 +3,7 @@
 <link rel="stylesheet" href="{{ "css/likec4-styles.css" | relURL }}">
 <script src="{{ "js/likec4-loader.js" | relURL }}"></script>
 {{ end }}
+
+<!-- Version Info Styles & Script -->
+<link rel="stylesheet" href="{{ "css/version-info.css" | relURL }}">
+{{ partial "version-info-script.html" . }}

layouts/partials/navbar-version.html

@@ -0,0 +1,17 @@
+{{/* Header version info - compact display in navbar */}}
+{{ $buildInfo := .Site.Data.build_info }}
+{{ if $buildInfo }}
+<div class="navbar-version-info d-none d-md-flex align-items-center">
+  <small class="text-light opacity-75">
+    {{ if $buildInfo.git_tag }}
+      <span class="fw-bold">{{ $buildInfo.git_tag }}</span>
+    {{ else }}
+      <span class="fw-bold">{{ $buildInfo.git_branch }}</span>
+    {{ end }}
+    <span class="mx-1">@</span><code class="text-light">{{ $buildInfo.git_commit_short }}</code>
+    {{ if $buildInfo.git_dirty }}
+      <span class="badge bg-warning text-dark ms-1 px-1" style="font-size: 0.6rem;">*</span>
+    {{ end }}
+  </small>
+</div>
+{{ end }}

layouts/partials/version-info-script.html

@@ -0,0 +1,35 @@
+{{/* Inline JavaScript to add version info to navbar */}}
+{{ $buildInfo := .Site.Data.build_info }}
+{{ if $buildInfo }}
+<script>
+document.addEventListener('DOMContentLoaded', function() {
+  // Find the navbar container
+  const navbarContainer = document.querySelector('.td-navbar .container-fluid');
+  if (!navbarContainer) return;
+  
+  // Create version info element
+  const versionDiv = document.createElement('div');
+  versionDiv.className = 'navbar-version-info d-none d-md-flex align-items-center mx-3';
+  versionDiv.style.flex = '1';
+  versionDiv.style.justifyContent = 'center';
+  
+  const versionText = {{ if $buildInfo.git_tag }}"{{ $buildInfo.git_tag }}"{{ else }}"{{ $buildInfo.git_branch }}"{{ end }};
+  const commitHash = "{{ $buildInfo.git_commit_short }}";
+  const isDirty = {{ $buildInfo.git_dirty }};
+  
+  versionDiv.innerHTML = `
+    <small class="text-light opacity-75">
+      <span class="fw-bold">${versionText}</span>
+      <span class="mx-1">@</span><code class="text-light bg-transparent border-0 p-0" style="font-size: 0.8rem;">${commitHash}</code>
+      ${isDirty ? '<span class="badge bg-warning text-dark ms-1 px-1" style="font-size: 0.6rem;">*</span>' : ''}
+    </small>
+  `;
+  
+  // Insert version info between brand and nav items
+  const navScroll = navbarContainer.querySelector('.td-navbar-nav-scroll');
+  if (navScroll) {
+    navbarContainer.insertBefore(versionDiv, navScroll);
+  }
+});
+</script>
+{{ end }}

layouts/partials/version-info.html

@@ -0,0 +1,36 @@
+{{/* Version info banner - displays git commit info and build time */}}
+{{ $buildInfo := .Site.Data.build_info }}
+{{ if $buildInfo }}
+<div class="version-info-banner">
+  <div class="container-fluid">
+    <div class="row align-items-center">
+      <div class="col-md-8">
+        <small class="text-muted">
+          <i class="fab fa-git-alt me-1"></i>
+          {{ if $buildInfo.git_tag }}
+            <strong>{{ $buildInfo.git_tag }}</strong>
+            {{ if ne $buildInfo.git_tag $buildInfo.git_commit }}
+              <span class="text-muted">(@{{ $buildInfo.git_commit_short }})</span>
+            {{ end }}
+          {{ else }}
+            <strong>{{ $buildInfo.git_branch }}</strong>
+            <span class="text-muted">@{{ $buildInfo.git_commit_short }}</span>
+          {{ end }}
+          {{ if $buildInfo.git_dirty }}
+            <span class="badge badge-warning ms-1">dirty</span>
+          {{ end }}
+        </small>
+      </div>
+      <div class="col-md-4 text-md-end">
+        <small class="text-muted">
+          <i class="far fa-clock me-1"></i>
+          Built {{ $buildInfo.build_time_human }}
+          {{ if $buildInfo.build_user }}
+            by {{ $buildInfo.build_user }}
+          {{ end }}
+        </small>
+      </div>
+    </div>
+  </div>
+</div>
+{{ end }}

scripts/generate-build-info.sh

@@ -0,0 +1,48 @@
+#!/bin/bash
+
+# Generate build information for Hugo
+# This script collects git information and build metadata
+
+set -euo pipefail
+
+# Create data directory if it doesn't exist
+mkdir -p data
+
+# Get git information
+GIT_COMMIT=$(git rev-parse HEAD 2>/dev/null || echo "unknown")
+GIT_COMMIT_SHORT=$(git rev-parse --short HEAD 2>/dev/null || echo "unknown")
+GIT_BRANCH=$(git rev-parse --abbrev-ref HEAD 2>/dev/null || echo "unknown")
+GIT_TAG=$(git describe --tags --exact-match 2>/dev/null || echo "")
+GIT_DIRTY=""
+
+# Check if working directory is dirty
+if git diff-index --quiet HEAD -- 2>/dev/null; then
+    GIT_DIRTY="false"
+else
+    GIT_DIRTY="true"
+fi
+
+# Get build information
+BUILD_TIME=$(date -u +"%Y-%m-%dT%H:%M:%SZ")
+BUILD_TIME_HUMAN=$(date -u +"%Y-%m-%d %H:%M UTC")
+BUILD_USER=$(whoami 2>/dev/null || echo "unknown")
+BUILD_HOST=$(hostname 2>/dev/null || echo "unknown")
+
+# Create JSON file for Hugo
+cat > data/build_info.json << EOF
+{
+  "git_commit": "${GIT_COMMIT}",
+  "git_commit_short": "${GIT_COMMIT_SHORT}",
+  "git_branch": "${GIT_BRANCH}",
+  "git_tag": "${GIT_TAG}",
+  "git_dirty": ${GIT_DIRTY},
+  "build_time": "${BUILD_TIME}",
+  "build_time_human": "${BUILD_TIME_HUMAN}",
+  "build_user": "${BUILD_USER}",
+  "build_host": "${BUILD_HOST}"
+}
+EOF
+
+echo "✓ Build info generated: data/build_info.json"
+echo "  Git: ${GIT_BRANCH}@${GIT_COMMIT_SHORT}${GIT_TAG:+ (${GIT_TAG})}"
+echo "  Built: ${BUILD_TIME_HUMAN} by ${BUILD_USER}"

static/css/version-info.css

@@ -0,0 +1,36 @@
+/* Navbar version info styles */
+.navbar-version-info {
+  flex: 1;
+  justify-content: center;
+  font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;
+}
+
+.navbar-version-info code {
+  background: rgba(255, 255, 255, 0.1);
+  padding: 0.1rem 0.3rem;
+  border-radius: 0.2rem;
+  font-size: 0.8rem;
+}
+
+.navbar-version-info .badge {
+  font-size: 0.6rem;
+  padding: 0.1rem 0.3rem;
+}
+
+/* Hide on small screens */
+@media (max-width: 767px) {
+  .navbar-version-info {
+    display: none !important;
+  }
+}
+
+/* Additional responsive tweaks */
+@media (min-width: 768px) and (max-width: 991px) {
+  .navbar-version-info {
+    flex: 0.5;
+  }
+  
+  .navbar-version-info small {
+    font-size: 0.75rem;
+  }
+}