[OCaml] Mobile-friendly clone of cgit.
refactor unify filters and pagination into a single toolbar
The /commits page now has a single .toolbar containing: - .toolbar-filters (left-aligned, horizontally scrollable on overflow) - .toolbar-pagination (right-aligned, flex-shrink: 0, never obscured) This matches the semantic pattern of the /files toolbar (breadcrumb + controls in one sticky bar) and prevents filters from pushing pagination out of view on narrow screens.
Changed files
lib/static/styles.css
@@ -509,12 +509,26 @@
509
509
510
510
/* Pagination controls */
511
511
512
Removed:
.pagination {
512
Added:
.toolbar-filters {
513
513
display: flex;
514
514
align-items: center;
515
Removed:
justify-content: flex-end;
516
515
gap: 0.5em;
517
Removed:
padding: 0.5em 0;
516
Added:
overflow-x: auto;
517
Added:
scrollbar-width: none;
518
Added:
flex: 1;
519
Added:
min-width: 0;
520
Added:
}
521
Added:
522
Added:
.toolbar-filters::-webkit-scrollbar {
523
Added:
display: none;
524
Added:
}
525
Added:
526
Added:
.toolbar-pagination {
527
Added:
display: flex;
528
Added:
align-items: center;
529
Added:
gap: 0.5em;
530
Added:
flex-shrink: 0;
531
Added:
margin-left: auto;
518
532
}
519
533
520
534
.pagination-btn {
lib/views/repo.ml
@@ -556,17 +556,37 @@
556
556
"toolbar-filter-value" );
557
557
]
558
558
in
559
Removed:
let tb = match filters with [] -> HTML.null [] | _ -> toolbar ~filters [] in
560
559
let page_url page =
561
560
commits_url ?filter_type ?author ?committer ~page context.repo
562
561
in
563
562
let show_pagination = has_prev || has_next in
564
Removed:
let pagination =
563
Added:
let filters_span =
564
Added:
match filters with
565
Added:
| [] -> HTML.null []
566
Added:
| _ ->
567
Added:
let filter_el (filter_name, display, dismiss_href, value_class) =
568
Added:
HTML.(
569
Added:
span
570
Added:
[ class_ "toolbar-filter" ]
571
Added:
[
572
Added:
span [ class_ "%s" value_class ] [ txt "%s" display ];
573
Added:
a
574
Added:
[
575
Added:
href "%s" dismiss_href;
576
Added:
class_ "toolbar-dismiss";
577
Added:
Aria.label "Remove %s filter" filter_name;
578
Added:
]
579
Added:
[ txt "\xc3\x97" ];
580
Added:
])
581
Added:
in
582
Added:
HTML.(span [ class_ "toolbar-filters" ] (List.map filter_el filters))
583
Added:
in
584
Added:
let pagination_span =
565
585
if not show_pagination then HTML.null []
566
586
else
567
587
HTML.(
568
Removed:
nav
569
Removed:
[ class_ "pagination"; Aria.label "Pagination" ]
588
Added:
span
589
Added:
[ class_ "toolbar-pagination" ]
570
590
[
571
591
(if has_prev then
572
592
a
@@ -601,17 +621,21 @@
601
621
[ txt ">" ]);
602
622
])
603
623
in
624
Added:
let tb =
625
Added:
HTML.(
626
Added:
div
627
Added:
[ class_ "toolbar"; role `toolbar; Aria.label "Filters and pagination" ]
628
Added:
[ filters_span; pagination_span ])
629
Added:
in
604
630
render_page context ~active:Commits
605
631
HTML.
606
632
[
607
633
tb;
608
Removed:
pagination;
609
634
ul []
610
635
(List.map
611
636
(li_of_commit ~hide_pill ?filter_type ?author ?committer
612
637
context.repo)
613
638
commits);
614
Removed:
pagination;
615
639
]
616
640
617
641
let breadcrumb_pill repo (trail : (string * string) list) =