gabriel / musehub public
_commit-detail.scss
371 lines 8.9 KB
Raw
sha256:34035d72cef530c1ab9d6a6f53be18d803dde705fc3157617d70352a96d0747b Merge branch 'fix/wire-push-external-parent-manifest' into dev Human 8 days ago
1 // ─────────────────────────────────────────────────────────────────────────────
2 // Page: Commit Detail (.cmt-* prefix)
3 // File: src/scss/pages/_commit-detail.scss
4 //
5 // STRUCTURAL LAYOUT ONLY — zero colors, zero typography here.
6 // Visual rules live in components/_commit-detail.scss.
7 // ─────────────────────────────────────────────────────────────────────────────
8
9 // ── Page skeleton ─────────────────────────────────────────────────────────────
10
11 .cmt-page {
12 display: flex;
13 flex-direction: column;
14 height: calc(100dvh - var(--header-height));
15 overflow: hidden;
16 }
17
18 // ── Hero ──────────────────────────────────────────────────────────────────────
19
20 .cmt-hero { position: relative; border-bottom: 1px solid var(--border-default); overflow: hidden; }
21
22 .cmt-hero-inner {
23 position: relative;
24 max-width: 1280px;
25 margin: 0 auto;
26 padding: var(--space-7) var(--space-6) var(--space-6);
27 }
28
29 .cmt-eyebrow {
30 display: flex;
31 align-items: center;
32 justify-content: space-between;
33 gap: var(--space-3);
34 flex-wrap: wrap;
35 margin-bottom: var(--space-5);
36 }
37
38 .cmt-eyebrow-left {
39 display: flex;
40 align-items: center;
41 gap: var(--space-2);
42 flex-wrap: wrap;
43 }
44
45 .cmt-eyebrow-right {
46 display: flex;
47 align-items: center;
48 gap: var(--space-2);
49 flex-shrink: 0;
50 }
51
52 .cmt-hero-body {
53 display: flex;
54 gap: var(--space-10);
55 align-items: flex-start;
56
57 @media (max-width: 900px) { flex-direction: column; gap: var(--space-5); }
58 }
59
60 .cmt-hero-left {
61 flex: 1;
62 min-width: 0;
63 }
64
65 .cmt-hero-desc { margin-top: var(--space-3); }
66
67 // ── Manifest ──────────────────────────────────────────────────────────────────
68
69 .cmt-manifest {
70 display: flex;
71 flex-direction: column;
72 gap: 0;
73 flex-shrink: 0;
74 width: 340px;
75
76 @media (max-width: 900px) { width: 100%; }
77 }
78
79 .cmt-manifest-row {
80 display: flex;
81 align-items: baseline;
82 justify-content: space-between;
83 gap: var(--space-4);
84 padding: 6px 0;
85 border-bottom: 1px solid var(--border-subtle);
86 &:last-child { border-bottom: none; }
87 }
88
89 .cmt-manifest-val {
90 display: flex;
91 align-items: center;
92 gap: 5px;
93 flex-wrap: wrap;
94 min-width: 0;
95 font-size: 12px;
96 flex: 1;
97 }
98
99 .cmt-manifest-key {
100 font-size: 10px;
101 text-transform: uppercase;
102 letter-spacing: 0.07em;
103 font-weight: var(--weight-semibold);
104 flex-shrink: 0;
105 text-align: right;
106 }
107
108 // ── Split-pane body ───────────────────────────────────────────────────────────
109
110 .cmt-wrap {
111 flex: 1;
112 overflow: hidden;
113 display: flex;
114 flex-direction: column;
115 }
116
117 .cmt-layout {
118 display: grid;
119 grid-template-columns: 1fr 260px;
120 gap: var(--space-5);
121 flex: 1;
122 min-height: 0;
123 overflow: hidden;
124 padding: var(--space-4) var(--space-6) 0;
125 max-width: 1280px;
126 margin: 0 auto;
127 width: 100%;
128
129 @media (max-width: 900px) { grid-template-columns: 1fr; }
130 }
131
132 .cmt-main {
133 min-width: 0;
134 height: 100%;
135 overflow-y: auto;
136 scrollbar-width: thin;
137 scrollbar-color: var(--border-default) transparent;
138 padding-bottom: var(--space-10);
139 display: flex;
140 flex-direction: column;
141 gap: var(--space-3);
142 }
143
144 .cmt-sidebar {
145 height: 100%;
146 overflow-y: auto;
147 scrollbar-width: thin;
148 scrollbar-color: var(--border-default) transparent;
149 padding-bottom: var(--space-10);
150
151 @media (max-width: 900px) { height: auto; overflow-y: visible; }
152 }
153
154 // ── Badge row inside eyebrow ──────────────────────────────────────────────────
155
156 .cmt-badges {
157 display: flex;
158 align-items: center;
159 gap: var(--space-2);
160 flex-wrap: wrap;
161 }
162
163 // ── Dimension strip ───────────────────────────────────────────────────────────
164
165 .cmt-dims {
166 display: flex;
167 gap: var(--space-2);
168 flex-wrap: wrap;
169 }
170
171 .cmt-dim {
172 display: flex;
173 flex-direction: column;
174 align-items: center;
175 justify-content: center;
176 padding: var(--space-3) var(--space-4);
177 gap: 4px;
178 min-width: 80px;
179 }
180
181 // ── Sections ──────────────────────────────────────────────────────────────────
182
183 .cmt-section-hd {
184 display: flex;
185 align-items: center;
186 gap: var(--space-2);
187 padding: 10px 14px;
188 }
189
190 .cmt-section-title-row {
191 display: flex;
192 align-items: center;
193 gap: 8px;
194 flex: 1;
195 min-width: 0;
196 }
197
198 .cmt-tally {
199 display: flex;
200 gap: 5px;
201 margin-left: auto;
202 }
203
204 // ── File cards (semantic changes) ─────────────────────────────────────────────
205
206 .cmt-file-hd {
207 display: flex;
208 align-items: center;
209 gap: var(--space-2);
210 padding: 8px 14px;
211 }
212
213 .cmt-file-summary { margin-left: auto; }
214
215 .cmt-sym-tree {
216 display: flex;
217 flex-direction: column;
218 gap: 1px;
219 padding: 4px 14px 8px;
220 }
221
222 .cmt-sym-row {
223 display: flex;
224 align-items: center;
225 gap: 6px;
226 padding: 3px 4px;
227 }
228
229 .cmt-sym-row--child { padding-left: 16px; }
230 .cmt-sym-indent { display: inline-flex; align-items: center; }
231
232 // ── Flat file list ────────────────────────────────────────────────────────────
233
234 .cmt-file-list {
235 display: flex;
236 flex-direction: column;
237 gap: 2px;
238 padding: 8px 14px 12px;
239 }
240
241 .cmt-fl-row {
242 display: flex;
243 align-items: center;
244 gap: 8px;
245 padding: 3px 4px;
246 }
247
248 .cmt-fl-dot {
249 width: 14px;
250 text-align: center;
251 flex-shrink: 0;
252 }
253
254 // ── Commit navigation ─────────────────────────────────────────────────────────
255
256 .cmt-nav {
257 display: grid;
258 grid-template-columns: 1fr auto 1fr;
259 align-items: center;
260 gap: var(--space-3);
261 }
262
263 .cmt-nav-card {
264 display: flex;
265 flex-direction: column;
266 gap: 4px;
267 padding: var(--space-3) var(--space-4);
268 }
269
270 .cmt-nav-card--newer { align-items: flex-end; text-align: right; }
271 .cmt-nav-all { text-align: center; }
272
273 // ── Discussion ────────────────────────────────────────────────────────────────
274
275 .cmt-disc-hd {
276 display: flex;
277 align-items: center;
278 gap: var(--space-2);
279 margin-bottom: var(--space-3);
280 }
281
282 .cmt-comment-list {
283 display: flex;
284 flex-direction: column;
285 gap: var(--space-3);
286 margin-bottom: var(--space-4);
287 }
288
289 .cmt-cli-hint {
290 display: flex;
291 align-items: center;
292 gap: var(--space-2);
293 padding: var(--space-3) var(--space-4);
294 border-radius: var(--radius-sm);
295 font-size: 13px;
296
297 .cmt-cli-hint-icon { flex-shrink: 0; opacity: 0.6; }
298 }
299
300 // ── Sidebar ───────────────────────────────────────────────────────────────────
301
302 .cmt-side-panel { position: relative; }
303
304 .cmt-scard {
305 border-bottom: 1px solid var(--border-subtle);
306 &:last-child { border-bottom: none; }
307 }
308
309 .cmt-scard-hd {
310 display: flex;
311 align-items: center;
312 gap: 7px;
313 padding: 10px 14px;
314 border-bottom: 1px solid var(--border-subtle);
315 }
316
317 .cmt-scard-identity {
318 display: flex;
319 flex-direction: column;
320 gap: 4px;
321 padding: 10px 14px 8px;
322 border-bottom: 1px solid var(--border-subtle);
323 }
324
325 .cmt-scard-row {
326 display: flex;
327 align-items: flex-start;
328 gap: var(--space-2);
329 padding: 5px 14px;
330 border-bottom: 1px solid var(--border-subtle);
331 &:last-child { border-bottom: none; }
332 }
333
334 .cmt-scard-label {
335 min-width: 58px;
336 flex-shrink: 0;
337 padding-top: 1px;
338 }
339
340 .cmt-scard-val {
341 display: flex;
342 align-items: center;
343 gap: 5px;
344 flex: 1;
345 min-width: 0;
346 flex-wrap: wrap;
347
348 &.cmt-scard-val--col {
349 flex-direction: column;
350 align-items: flex-start;
351 gap: 2px;
352 }
353 }
354
355 .cmt-parents {
356 display: flex;
357 flex-direction: column;
358 gap: 3px;
359 }
360
361 .cmt-reviewers {
362 display: flex;
363 flex-wrap: wrap;
364 gap: 3px;
365 }
366
367 .cmt-scard-action {
368 padding: var(--space-2) var(--space-3) var(--space-3);
369
370 .btn { width: 100%; font-size: 11px; }
371 }
File History 14 commits
sha256:34035d72cef530c1ab9d6a6f53be18d803dde705fc3157617d70352a96d0747b Merge branch 'fix/wire-push-external-parent-manifest' into dev Human 8 days ago
sha256:fc04e4cae9e1774d6a21b65c45daeed0e6787eb581d13aa1b03bfe9384a34226 Merge branch 'fix/two-column-scroll-layout' into dev Human 8 days ago
sha256:408916fc5973ba59c6e4eebaa80ebdcc801c0a63205651e25009d11548f79454 chore: bump version to 0.2.0.dev2 — nightly.2, matching muse Sonnet 4.6 patch 11 days ago
sha256:d035733f21ccff27735fddebfbbe0ed24565a32a22db8de5885402262671ecd2 chore: bump version to 0.2.0rc15 for musehub#113 fix release Sonnet 4.6 patch 14 days ago
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 29 days ago
sha256:a59da49c4611b970fc4b6ae48678ce4943261c213a07ddbd73ce9201df869b4a fix: remove false-positive proposal_comments index drop fro… Sonnet 4.6 patch 33 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 35 days ago
sha256:d1122d21e73471879b460037b22c0b50fded7c423444a176f248428f75dac39c Merge 'task/fix-issue-pagination-cursor' into 'dev' — propo… Human 35 days ago
sha256:01e18975e73d2b3cd5b6db7929c895bef9aa6e0d4391dc5b2adfc548b41318dd Merge 'feat/adding-debug-logs-to-staging' into 'dev' — prop… Human 35 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