diff --git a/site/src/components/Header.astro b/site/src/components/Header.astro
index d1b28e8..97bb6b9 100644
--- a/site/src/components/Header.astro
+++ b/site/src/components/Header.astro
@@ -83,15 +83,18 @@ const starsLabel = stars >= 1000 ? `${(stars / 1000).toFixed(1)}k` : String(star
href={GITHUB_URL}
target="_blank"
rel="noopener noreferrer"
- aria-label="GitHub repository"
- class="flex items-center gap-1.5 text-slate-500 dark:text-slate-400 hover:text-slate-900 dark:hover:text-white transition-colors"
+ aria-label="Star on GitHub"
+ class="flex items-center gap-0 rounded-md border border-slate-200 dark:border-slate-700 overflow-hidden text-xs font-medium hover:border-slate-300 dark:hover:border-slate-600 transition-colors"
>
-
- {stars > 0 && (
- {starsLabel}
- )}
+
+
+ Star
+
+
+ {starsLabel}
+
@@ -158,4 +161,35 @@ const starsLabel = stars >= 1000 ? `${(stars / 1000).toFixed(1)}k` : String(star
hamburger?.classList.toggle('hidden', isOpen);
closeIcon?.classList.toggle('hidden', !isOpen);
});
+
+ // Live star count — fetch from GitHub API on page load, cache in sessionStorage
+ const starsEl = document.getElementById('github-stars');
+ if (starsEl) {
+ const CACHE_KEY = 'gh_stars_apa';
+ const CACHE_TTL = 3600 * 1000; // 1 hour
+
+ function formatStars(n: number): string {
+ return n >= 1000 ? `${(n / 1000).toFixed(1)}k` : String(n);
+ }
+
+ const cached = sessionStorage.getItem(CACHE_KEY);
+ if (cached) {
+ const { value, ts } = JSON.parse(cached);
+ if (Date.now() - ts < CACHE_TTL) {
+ starsEl.textContent = formatStars(value);
+ }
+ }
+
+ fetch('https://api.github.com/repos/samber/awesome-prometheus-alerts', {
+ headers: { Accept: 'application/vnd.github+json' },
+ })
+ .then((r) => r.ok ? r.json() : null)
+ .then((data) => {
+ if (data?.stargazers_count) {
+ starsEl.textContent = formatStars(data.stargazers_count);
+ sessionStorage.setItem(CACHE_KEY, JSON.stringify({ value: data.stargazers_count, ts: Date.now() }));
+ }
+ })
+ .catch(() => {});
+ }