v9: GitHub-style action buttons (Watch/Fork/Star) — cosmetic, Solid-native impl is follow-up

Author: melvincarvalho

app.js

@@ -187,6 +187,34 @@
       font-size: 0.85rem;
       cursor: pointer;
     }
+    .repo-actions {
+      display: inline-flex;
+      gap: 0.4rem;
+      margin-left: auto;
+      flex-wrap: wrap;
+    }
+    .repo-action {
+      padding: 0.3rem 0.7rem;
+      background: #f6f8fa;
+      border: 1px solid #d0d7de;
+      border-radius: 6px;
+      font-size: 0.8rem;
+      color: #1f2328;
+      cursor: pointer;
+      display: inline-flex;
+      align-items: center;
+      gap: 0.4rem;
+      font-family: inherit;
+    }
+    .repo-action:hover { background: #f3f4f6; }
+    .repo-action .count {
+      padding: 1px 6px;
+      background: #eaeef2;
+      border-radius: 10px;
+      font-size: 0.72rem;
+      color: #1f2328;
+      font-weight: 600;
+    }
     .latest-commit {
       margin: 0.75rem 0 0;
       padding: 0.625rem 1rem;

index.html

@@ -579,6 +579,17 @@ function App() {
               </select>
             `;
           })()}
+          <span class="repo-actions">
+            <button class="repo-action" title="Sign in to watch (Solid-native, not yet implemented)">
+              \u{1F441} Watch <span class="count">0</span>
+            </button>
+            <button class="repo-action" title="Sign in to fork (Solid-native, not yet implemented)">
+              \u{1F374} Fork <span class="count">0</span>
+            </button>
+            <button class="repo-action repo-action-star" title="Sign in to star (Solid-native, not yet implemented)">
+              ⭐ Star <span class="count">0</span>
+            </button>
+          </span>
         </div>
 
         <div class="layout">