[OCaml] Mobile-friendly clone of cgit.
refactor flatten commit list items, stretch title anchor to li height
Remove the commit-left wrapper span from li_of_commit so that timestamp, pill, and commit-title are direct children of the li. The commit-title anchor uses height:100% + line-height to fill the enclosing li while preserving text-overflow ellipsis behavior.
Changed files
lib/static/styles.css
@@ -273,41 +273,22 @@
273
273
font-size: 0.85em;
274
274
}
275
275
276
Removed:
/* Commit list items — aligned with directory list items: anchors fill the row height */
276
Added:
/* Commit list items — flat layout, commit-title anchor fills the li height */
277
277
278
Removed:
div#main ul li:has(.commit-left) {
278
Added:
div#main ul li:has(.commit-title) {
279
279
display: flex;
280
Removed:
align-items: stretch;
281
Removed:
justify-content: space-between;
280
Added:
align-items: center;
282
281
line-height: 1.5rem;
283
282
min-height: var(--target-size);
284
283
box-sizing: border-box;
285
Removed:
gap: 1em;
284
Added:
gap: 0.5em;
285
Added:
padding: 0 0.75em;
286
286
}
287
287
288
Removed:
div#main ul li:has(.commit-left):hover {
288
Added:
div#main ul li:has(.commit-title):hover {
289
289
background-color: #252525;
290
290
}
291
291
292
Removed:
.commit-left {
293
Removed:
display: flex;
294
Removed:
align-items: center;
295
Removed:
gap: 0.5em;
296
Removed:
flex: 1;
297
Removed:
min-width: 0;
298
Removed:
overflow: hidden;
299
Removed:
padding: 0.5em 0.75em;
300
Removed:
}
301
Removed:
302
Removed:
.commit-left a {
303
Removed:
border-radius: 0.25rem;
304
Removed:
line-height: 1.5rem;
305
Removed:
}
306
Removed:
307
Removed:
.commit-left a:hover {
308
Removed:
text-decoration: underline;
309
Removed:
}
310
Removed:
311
292
.commit-ago {
312
293
display: flex;
313
294
align-items: center;
@@ -374,15 +355,18 @@
374
355
flex: 1;
375
356
min-width: 0;
376
357
overflow: hidden;
358
Added:
align-self: stretch;
377
359
}
378
360
379
361
.commit-title a {
380
362
display: block;
381
363
flex: 1;
382
364
min-width: 0;
365
Added:
height: 100%;
383
366
overflow: hidden;
384
367
text-overflow: ellipsis;
385
368
white-space: nowrap;
369
Added:
line-height: var(--target-size);
386
370
}
387
371
388
372
/* Pill color variants — WCAG AA contrast against their backgrounds */
lib/views/repo.ml
@@ -430,13 +430,7 @@
430
430
commit.author;
431
431
])
432
432
in
433
Removed:
HTML.(
434
Removed:
li []
435
Removed:
[
436
Removed:
span [ class_ "commit-left" ] [ timestamp_span; pill; title_span ];
437
Removed:
ago_span;
438
Removed:
author_span;
439
Removed:
])
433
Added:
HTML.(li [] [ timestamp_span; pill; title_span; ago_span; author_span ])
440
434
441
435
let rec li_of_tree_node repo (pe : Resolvers.Tree.tree_node) =
442
436
let entry = pe.entry in
lib/views/root.ml
@@ -10,8 +10,7 @@
10
10
in
11
11
let desc_span =
12
12
if description = Resolvers.default_repo_description then HTML.null []
13
Removed:
else
14
Removed:
HTML.(span [ class_ "repo-description" ] [ txt "%s" description ])
13
Added:
else HTML.(span [ class_ "repo-description" ] [ txt "%s" description ])
15
14
in
16
15
let ago_span =
17
16
match List.assoc_opt full_path dates with