gabriel / musehub public
_clones.scss
241 lines 7.2 KB
Raw
sha256:0032d6cfa33bc3c8367436ad768e7dd0e339b4332153160247da8266cb5fa352 Merge branch 'task/version-tags-phase3-server' into dev Human 17 days ago
1 // ─────────────────────────────────────────────────────────────────────────────
2 // Component: Clones (.cl-* visuals)
3 // File: src/scss/components/_clones.scss
4 //
5 // VISUAL RULES ONLY — no layout or sizing here.
6 // Structural layout lives in pages/_clones.scss.
7 // ─────────────────────────────────────────────────────────────────────────────
8
9 // ── Stat chips ────────────────────────────────────────────────────────────────
10
11 .cl-stat {
12 background: var(--bg-card);
13 border: 1px solid var(--border-default);
14 border-radius: var(--radius-md);
15 }
16
17 .cl-stat__val {
18 font-size: 1.5rem;
19 font-weight: 600;
20 color: var(--color-accent);
21 font-variant-numeric: tabular-nums;
22 }
23
24 .cl-stat__lbl {
25 font-size: 0.7rem;
26 text-transform: uppercase;
27 letter-spacing: 0.06em;
28 color: var(--fg-muted);
29 }
30
31 // ── Tier badge ────────────────────────────────────────────────────────────────
32
33 .cl-badge {
34 display: inline-flex;
35 align-items: center;
36 justify-content: center;
37 padding: 0.15em 0.55em;
38 border-radius: 3px;
39 font-size: 0.65rem;
40 font-weight: 600;
41 letter-spacing: 0.05em;
42 text-transform: uppercase;
43 white-space: nowrap;
44 }
45
46 .cl-badge--exact {
47 background: color-mix(in srgb, var(--color-accent) 18%, transparent);
48 color: var(--color-accent);
49 border: 1px solid color-mix(in srgb, var(--color-accent) 35%, transparent);
50 }
51
52 .cl-badge--near {
53 background: color-mix(in srgb, var(--color-warning) 18%, transparent);
54 color: var(--color-warning);
55 border: 1px solid color-mix(in srgb, var(--color-warning) 35%, transparent);
56 }
57
58 // ── Cross-file badge ──────────────────────────────────────────────────────────
59
60 .cl-cross-file {
61 font-size: 0.62rem;
62 color: var(--color-warning);
63 opacity: 0.85;
64 }
65
66 // ── File hotspots ─────────────────────────────────────────────────────────────
67
68 .cl-hotspot-section-title {
69 font-size: 0.65rem;
70 text-transform: uppercase;
71 letter-spacing: 0.06em;
72 color: var(--fg-muted);
73 }
74
75 .cl-hotspot-row:hover { background: var(--bg-overlay); }
76
77 .cl-hotspot-file {
78 font-family: var(--font-mono);
79 font-size: 0.8rem;
80 color: var(--fg-default);
81 }
82
83 .cl-hotspot-track { background: var(--bg-overlay); }
84 .cl-hotspot-fill { background: var(--color-warning); opacity: 0.7; }
85
86 .cl-hotspot-val {
87 font-size: 0.75rem;
88 font-variant-numeric: tabular-nums;
89 color: var(--fg-muted);
90 }
91
92 // ── Cluster list ──────────────────────────────────────────────────────────────
93
94 .cl-list {
95 border: 1px solid var(--border-default);
96 border-radius: var(--radius-md);
97 overflow: hidden;
98 }
99
100 .cl-row {
101 border-bottom: 1px solid var(--border-subtle);
102 color: var(--fg-default);
103 transition: background 0.1s;
104
105 &:last-child { border-bottom: none; }
106 &:hover { background: var(--bg-overlay); }
107 }
108
109 .cl-row__hash {
110 font-family: var(--font-mono);
111 font-size: 0.78rem;
112 color: var(--fg-muted);
113 }
114
115 .cl-row__bar-track { background: var(--bg-overlay); }
116 .cl-row__bar-fill--exact { background: var(--color-accent); opacity: 0.7; }
117 .cl-row__bar-fill--near { background: var(--color-warning); opacity: 0.7; }
118
119 .cl-row__count {
120 font-size: 0.78rem;
121 font-variant-numeric: tabular-nums;
122 color: var(--fg-default);
123 font-weight: 500;
124 }
125
126 // ── Language + kind pills ─────────────────────────────────────────────────────
127
128 .cl-lang-pill {
129 font-size: 0.62rem;
130 padding: 0.1em 0.45em;
131 border-radius: 3px;
132 background: color-mix(in srgb, var(--color-teal) 15%, transparent);
133 color: var(--color-teal);
134 white-space: nowrap;
135 }
136
137 .cl-kind-badge {
138 font-size: 0.62rem;
139 padding: 0.1em 0.4em;
140 border-radius: 3px;
141 background: var(--bg-overlay);
142 color: var(--fg-muted);
143 text-transform: lowercase;
144 white-space: nowrap;
145 }
146
147 // ── Detail page ───────────────────────────────────────────────────────────────
148
149 .cl-detail-hash {
150 font-family: var(--font-mono);
151 font-size: 0.95rem;
152 color: var(--fg-muted);
153 margin-bottom: 0.25rem;
154 }
155
156 .cl-detail-meta {
157 font-size: 0.8rem;
158 color: var(--fg-muted);
159 }
160
161 .cl-detail-chip {
162 background: var(--bg-card);
163 border: 1px solid var(--border-default);
164 border-radius: var(--radius-md);
165 min-width: 80px;
166 }
167
168 .cl-detail-chip__val {
169 font-size: 1.35rem;
170 font-weight: 600;
171 color: var(--fg-default);
172 font-variant-numeric: tabular-nums;
173
174 &--accent { color: var(--color-accent); }
175 &--warn { color: var(--color-warning); }
176 }
177
178 .cl-detail-chip__lbl {
179 font-size: 0.65rem;
180 text-transform: uppercase;
181 letter-spacing: 0.06em;
182 color: var(--fg-muted);
183 }
184
185 .cl-section-title {
186 font-size: 0.65rem;
187 text-transform: uppercase;
188 letter-spacing: 0.06em;
189 color: var(--fg-muted);
190 }
191
192 // ── Member list ───────────────────────────────────────────────────────────────
193
194 .cl-member-list {
195 border: 1px solid var(--border-default);
196 border-radius: var(--radius-md);
197 overflow: hidden;
198 }
199
200 .cl-member-row {
201 border-bottom: 1px solid var(--border-subtle);
202
203 &:last-child { border-bottom: none; }
204 &:hover { background: var(--bg-overlay); }
205 }
206
207 .cl-member-addr {
208 font-family: var(--font-mono);
209 font-size: 0.8rem;
210 color: var(--fg-default);
211 }
212
213 // ── File breakdown ────────────────────────────────────────────────────────────
214
215 .cl-file-breakdown {
216 border: 1px solid var(--border-default);
217 border-radius: var(--radius-md);
218 overflow: hidden;
219 padding: 0.5rem 0;
220 }
221
222 .cl-file-row:hover { background: var(--bg-overlay); }
223
224 .cl-file-name {
225 font-family: var(--font-mono);
226 font-size: 0.8rem;
227 color: var(--fg-default);
228 }
229
230 .cl-file-track { background: var(--bg-overlay); }
231 .cl-file-fill { background: var(--color-accent); opacity: 0.5; }
232
233 .cl-file-count {
234 font-size: 0.75rem;
235 color: var(--fg-muted);
236 font-variant-numeric: tabular-nums;
237 }
238
239 // ── Empty state ───────────────────────────────────────────────────────────────
240
241 .cl-empty { color: var(--fg-muted); }
File History 10 commits
sha256:0032d6cfa33bc3c8367436ad768e7dd0e339b4332153160247da8266cb5fa352 Merge branch 'task/version-tags-phase3-server' into dev Human 17 days ago
sha256:4669620efda9ff41c55bdefd1f7bfe1c239d468428744c84ead9957e5a003a53 merge: rescue snapshot-recovery hardening (c00aa21d) into d… Opus 4.8 minor 30 days ago
sha256:a59da49c4611b970fc4b6ae48678ce4943261c213a07ddbd73ce9201df869b4a fix: remove false-positive proposal_comments index drop fro… Sonnet 4.6 patch 34 days ago
sha256:0a240d6dbff234f07d98a28a4a9a68db702f3f9ff9260196f24219bdb1c0b6f3 feat: render markdown mists as HTML with heading anchor links Sonnet 4.6 patch 34 days ago
sha256:24a7d47486ebc4ebd1832830580e177ec6f877b48dced8c000e198cdec4ce9d6 Merge 'task/bump-version-rc12' into 'dev' — proposal: Bump … Human 35 days ago
sha256:b9ff931d147e0114a1f17060f415b89ed551c170a91ff226c70437aa5c85f9ee Merge 'task/bump-version-rc12' into 'dev' — proposal: Bump … Human 36 days ago
sha256:d1122d21e73471879b460037b22c0b50fded7c423444a176f248428f75dac39c Merge 'task/fix-issue-pagination-cursor' into 'dev' — propo… Human 36 days ago
sha256:01e18975e73d2b3cd5b6db7929c895bef9aa6e0d4391dc5b2adfc548b41318dd Merge 'feat/adding-debug-logs-to-staging' into 'dev' — prop… Human 36 days ago
sha256:6b1949fc2797ca4c1936a637a4cbfec828ef56cf52398a2e74ca3c4f494e728f fix: use wire_bytes not mpack_bytes_raw in compute_object_b… Sonnet 4.6 patch 48 days ago
sha256:b99f2455dc346966d040133f5203297e6e3ef5803a93728a2c30568d0a0f7583 rename: delta_add → delta_upsert across wire format, models… Sonnet 4.6 patch 50 days ago