// _repo-home.scss — Repository home page + tree browser (.rh-*, .ft-*, .tree-* prefixes) // ── Tree page path pills ────────────────────────────────────────────────────── .tree-path-pills { display: flex; align-items: center; gap: 4px; margin-left: var(--space-2); font-size: 12px; } .tree-path-sep { color: var(--text-muted); } .tree-path-pill { display: inline-flex; align-items: center; gap: 3px; padding: 1px 6px; border-radius: 4px; text-decoration: none; color: var(--color-accent); &:hover { text-decoration: underline; } &--root { padding: 2px 5px; color: var(--text-muted); &:hover { color: var(--text-primary); } } &--current { color: var(--text-primary); font-weight: 600; pointer-events: none; } } // ── Sidebar pulse rows ──────────────────────────────────────────────────────── .rh-pulse-row--sidebar { display: flex; flex-direction: column; gap: 6px; .rh-pulse-content { flex: unset; width: 100%; } svg.rh-spark { width: 100%; height: 32px; } } .rh-pulse-row--top-gap { margin-top: 10px; } .rh-pulse-langs--sidebar { flex-wrap: wrap; gap: 6px 10px; } // ── README below file tree ──────────────────────────────────────────────────── .rh-readme { margin-top: var(--space-4); border-top: 1px solid var(--border-subtle); padding-top: var(--space-3); } .rh-readme-hd { display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-3); font-size: 12px; font-weight: 600; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.06em; } .rh-readme-body { font-size: 13.5px; line-height: 1.65; color: var(--text-primary); h1, h2 { font-size: 15px; font-weight: 600; margin: 1.2em 0 0.4em; border-bottom: 1px solid var(--border-subtle); padding-bottom: 0.3em; } h3, h4 { font-size: 13px; font-weight: 600; margin: 1em 0 0.3em; } p { margin: 0.5em 0; } code { font-size: 12px; background: var(--bg-inset); padding: 1px 5px; border-radius: 3px; } pre { background: var(--bg-inset); padding: var(--space-3); border-radius: 6px; overflow-x: auto; margin: 0.8em 0; } pre code { background: none; padding: 0; } a { color: var(--color-accent); } ul, ol { padding-left: 1.4em; margin: 0.5em 0; } blockquote { border-left: 3px solid var(--border-subtle); margin: 0.5em 0; padding-left: 0.8em; color: var(--text-muted); } img { max-width: 100%; height: auto; } } // README header badges .rh-readme-badges { display: flex; align-items: center; gap: 5px; margin-left: auto; } .rh-readme-badge { font-size: 10px; font-weight: 600; padding: 2px 6px; border-radius: 3px; text-decoration: none; white-space: nowrap; background: var(--bg-inset); color: var(--text-muted); &--good { color: var(--color-success); } &--fair { color: var(--color-warning); } &--poor { color: var(--color-danger); } &--agent { color: var(--color-accent); } } .rh-readme-agent-note { display: inline-flex; align-items: center; gap: 3px; font-size: 10px; color: var(--color-accent); font-weight: 400; text-transform: none; letter-spacing: 0; margin-left: 8px; } // ── Sidebar about section ───────────────────────────────────────────────────── .rh-about-desc { font-size: 12.5px; color: var(--text-secondary); line-height: 1.5; margin-bottom: var(--space-2); } .rh-about-pills { display: flex; flex-direction: column; gap: 4px; } .rh-about-pill { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--text-muted); a { color: var(--color-accent); text-decoration: none; &:hover { text-decoration: underline; } } } // ── Branch bar: inline intel items ─────────────────────────────────────────── .rh-branch-intel { display: flex; align-items: center; gap: 10px; padding: 0 4px; } .rh-bi-item { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; color: var(--text-muted); white-space: nowrap; text-decoration: none; &:hover { color: var(--text-primary); } } .rh-bi-val { font-weight: 600; color: var(--text-secondary); } .rh-bi-health--good { color: var(--color-success); .rh-bi-val { color: var(--color-success); } } .rh-bi-health--fair { color: var(--color-warning); .rh-bi-val { color: var(--color-warning); } } .rh-bi-health--poor { color: var(--color-danger); .rh-bi-val { color: var(--color-danger); } } .rh-bi-item.rh-bi-hotspot { .rh-bi-val { color: #f0883e; } } .rh-bi-item.rh-bi-agent { color: var(--color-accent); .rh-bi-val { color: var(--color-accent); } } .rh-bi-sep { color: var(--border-default); font-size: 10px; } // ── Latest commit header row (file tree) ───────────────────────────────────── .ft-latest-commit { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px; background: var(--bg-subtle, var(--bg-card, var(--bg-surface))); border: 1px solid var(--border-subtle); border-radius: 6px 6px 0 0; border-bottom: none; font-size: 12px; } .ft-lc-left { display: flex; align-items: center; gap: 7px; min-width: 0; overflow: hidden; } .ft-lc-avatar { width: 20px; height: 20px; font-size: 10px; flex-shrink: 0; } .ft-lc-author { font-weight: 600; color: var(--text-primary); white-space: nowrap; } .ft-lc-author-link { display: flex; align-items: center; gap: 7px; flex-shrink: 0; text-decoration: none; color: inherit; } .ft-lc-message { color: var(--text-secondary); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: clamp(180px, 40vw, 520px); &:hover { color: var(--color-accent); } } .ft-lc-right { display: flex; align-items: center; gap: 10px; flex-shrink: 0; } .ft-lc-sha { font-family: var(--font-mono, monospace); font-size: 11px; color: var(--color-accent); text-decoration: none; background: var(--bg-inset); padding: 1px 6px; border-radius: 3px; &:hover { text-decoration: underline; } } .ft-lc-ts { color: var(--text-muted); font-size: 11px; white-space: nowrap; } // ── File tree table ─────────────────────────────────────────────────────────── .file-tree-table { width: 100%; border-collapse: collapse; table-layout: fixed; border: 1px solid var(--border-subtle); border-top: none; // ft-latest-commit provides the top border border-radius: 0 0 6px 6px; overflow: hidden; } .file-tree-row { border-bottom: 1px solid var(--border-subtle); &:last-child { border-bottom: none; } &:hover { background: var(--bg-hover, #30363d); } td { padding: 6px 0 6px 12px; vertical-align: middle; } td:last-child { padding-right: 12px; } } // Name column — flexible, takes leftover space .file-tree-cell-name { overflow: hidden; min-width: 140px; } .file-tree-link { display: inline-flex; align-items: center; gap: 7px; text-decoration: none; color: var(--text-primary); white-space: nowrap; overflow: hidden; &:hover { color: var(--color-accent); } } .file-tree-name { overflow: hidden; text-overflow: ellipsis; font-size: 13.5px; } .file-icon { display: inline-flex; align-items: center; flex-shrink: 0; } .file-icon-folder { color: var(--color-accent); } .file-icon-code { color: #58a6ff; } .file-icon-text, .file-icon-score { color: var(--text-muted); } .file-icon-midi, .file-icon-audio { color: var(--color-purple); } .file-icon-data { color: var(--color-warning); } .file-icon-default { color: var(--text-muted); } // Commit message column — 44% of table width .file-tree-cell-commit { width: 44%; overflow: hidden; padding-right: 8px; } .ft-row-commit-msg { color: var(--text-muted); font-size: 12px; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: inline; &:hover { color: var(--color-accent); } } // Commit type micro-badge .ft-ct { display: inline-block; font-size: 9px; font-weight: 700; padding: 1px 4px; border-radius: 3px; margin-right: 5px; vertical-align: middle; text-transform: uppercase; letter-spacing: 0.04em; } .ft-ct-feat { background: #1a3a52; color: #58a6ff; } .ft-ct-fix { background: #2a1f1f; color: #f85149; } .ft-ct-test { background: #1a2e1a; color: #3fb950; } .ft-ct-docs { background: #252010; color: #d29922; } .ft-ct-refactor { background: #2a1f3a; color: #bc8cff; } .ft-ct-perf { background: #2a2010; color: #f0883e; } .ft-ct-chore, .ft-ct-build, .ft-ct-ci, .ft-ct-style { background: #1e1e2e; color: #8b949e; } // Provenance column — fixed width .file-tree-cell-provenance { width: 88px; white-space: nowrap; padding-right: 8px; } .ft-prov { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; white-space: nowrap; } .ft-prov-agent { display: inline-flex; align-items: center; gap: 3px; color: var(--text-muted); svg { flex-shrink: 0; } } .ft-prov-human { display: inline-flex; align-items: center; gap: 3px; color: var(--text-muted); text-decoration: none; svg { flex-shrink: 0; } } // ── Clone section — MCP variant ────────────────────────────────────────────── .clone-input-wrap--mcp { margin-top: 6px; } .clone-input--mcp { font-size: 10.5px; color: var(--color-accent); } // ── Commit activity stream (sidebar) ───────────────────────────────────────── .rh-act-see-all { margin-left: auto; font-size: 10px; font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--color-accent); text-decoration: none; &:hover { text-decoration: underline; } } .rh-act-stream { display: flex; flex-direction: column; gap: 0; } .rh-act-row { padding: 7px 0; border-bottom: 1px solid var(--border-subtle); &:last-child { border-bottom: none; } } .rh-act-top { display: flex; align-items: baseline; gap: 5px; flex-wrap: nowrap; overflow: hidden; margin-bottom: 3px; } .rh-act-msg { font-size: 12px; color: var(--text-secondary); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; flex: 1; &:hover { color: var(--color-accent); } } .rh-act-sv { font-size: 9px; font-weight: 700; white-space: nowrap; flex-shrink: 0; padding: 1px 4px; border-radius: 3px; } .rh-act-sv--major { background: #2a1f1f; color: #f85149; } .rh-act-sv--minor { background: #252010; color: #d29922; } .rh-act-sv--patch { background: #1a3a52; color: #58a6ff; } .rh-act-breaking { font-size: 10px; color: var(--color-danger); flex-shrink: 0; } .rh-act-meta { display: flex; align-items: center; gap: 5px; font-size: 10.5px; color: var(--text-muted); } .rh-act-agent-icon { color: var(--color-accent); flex-shrink: 0; } .rh-act-author { white-space: nowrap; } .rh-act-author--agent { color: var(--color-accent); } .rh-act-ts { margin-left: auto; white-space: nowrap; } // Timestamp column — fixed width, right-aligned .file-tree-cell-ts { width: 72px; color: var(--text-muted); font-size: 11px; white-space: nowrap; text-align: right; padding-right: 12px; } .ft-row-ts { color: var(--text-muted); }