From 0be1fdd2635fbc49d7451d3711b5772e1e9990e2 Mon Sep 17 00:00:00 2001
From: Joe Mou <dev@mou.fo>
Date: Tue, 11 Aug 2026 08:09:47 -0400
Subject: Add language percentages to repo pages

GitHub no longer server-renders the repository sidebar; its React UI
lazily fetches /:owner/:repo/_sidebar as JSON, which carries the
language breakdown (name, percentage, color). getGitHubLanguages() uses
that endpoint, and a new /api/:owner/:repo/languages fragment route
renders the bar and legend the same way refs and latest-commit already
work, so repo page loads still cost a single scrape.

The latest-commit placeholder loader in refs.js is generalized over
.placeholder[data-src] so both placeholders share it.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
---
 cgithub/public/static/style.css | 37 ++++++++++++++++++++++++++++++++++++-
 1 file changed, 36 insertions(+), 1 deletion(-)

(limited to 'cgithub/public/static/style.css')

diff --git a/cgithub/public/static/style.css b/cgithub/public/static/style.css
index 983cb86..ed64bc6 100644
--- a/cgithub/public/static/style.css
+++ b/cgithub/public/static/style.css
@@ -218,10 +218,45 @@ body > footer {
   font-size: 0.85rem;
 }
 
-.latest-commit-placeholder {
+.placeholder {
   opacity: 0.7;
 }
 
+.languages {
+  .language-bar {
+    display: flex;
+    height: .5rem;
+    border-radius: .25rem;
+    overflow: hidden;
+
+    span {
+      /* Keep slivers of tiny languages visible. */
+      min-width: 1px;
+    }
+  }
+
+  .language-list {
+    display: flex;
+    flex-wrap: wrap;
+    gap: .2rem 1rem;
+    list-style: none;
+    margin: .5rem 0 0;
+    padding: 0;
+    font-size: 0.85rem;
+  }
+
+  .language-dot {
+    display: inline-block;
+    width: .6rem;
+    height: .6rem;
+    border-radius: 50%;
+  }
+
+  .language-percentage {
+    opacity: 0.7;
+  }
+}
+
 .repo-info {
   .description {
     margin-bottom: .2rem;
-- 
cgit v1.3.1