feat two-column summary page with README on the right

The repo summary page now shows latest commits on the left and the README on the right on wide screens (>= 960px). On narrow screens, commits appear above and the README below.

Commit
306d3b6daa867e2eb2ce7bf7ec2e5719b9fc1a01
Author
Marius Peter <dev@marius-peter.com>
Author date
Committer
Marius Peter <dev@marius-peter.com>
Committer date
Changed files
lib/handlers.ml
index 1832a1bf..fa943d98 100644..100644
@@ -127,7 +127,8 @@
127 127 let* commits =
128 128 Resolvers.Commit.recent repository config.Config.commits_max_displayed
129 129 in
130 Removed: Views.Repo.summary context commits
130 Added: let* readme = Resolvers.Repo.readme repository in
131 Added: Views.Repo.summary context ?readme commits
131 132
132 133 let commit_matches ?filter_type ?author ?committer
133 134 (commit : Resolvers.Commit.t) =
lib/static/styles.css
index e994148a..bab389ff 100644..100644
@@ -423,6 +423,24 @@
423 423 line-height: var(--target-size);
424 424 }
425 425
426 Added: /* Summary page layout */
427 Added: .summary-layout {
428 Added: display: flex;
429 Added: flex-direction: column;
430 Added: }
431 Added:
432 Added: .summary-readme:empty {
433 Added: display: none;
434 Added: }
435 Added:
436 Added: @media (min-width: 960px) {
437 Added: .summary-layout {
438 Added: display: grid;
439 Added: grid-template-columns: 2fr 1fr;
440 Added: gap: 2em;
441 Added: }
442 Added: }
443 Added:
426 444 /* "Show previous commits" link on summary page */
427 445
428 446 .summary-more {
lib/views/repo.ml
index d49cb1d7..da3c35d8 100644..100644
@@ -484,8 +484,8 @@
484 484 ];
485 485 ])
486 486
487 Removed: let summary context commits =
488 Removed: render_page context ~active:Summary
487 Added: let summary context ?readme commits =
488 Added: let commits_section =
489 489 HTML.
490 490 [
491 491 h3 [] [ txt "Latest commits" ];
@@ -494,6 +494,44 @@
494 494 [ class_ "summary-more" ]
495 495 [
496 496 Routes.link_to (Commits context.repo) (txt "Show previous commits");
497 Added: ];
498 Added: ]
499 Added: in
500 Added: let readme_section =
501 Added: match readme with
502 Added: | None -> HTML.null []
503 Added: | Some (blob : Resolvers.Blob.t) ->
504 Added: let formatted =
505 Added: String.split_on_char '\n' blob.content
506 Added: |> List.mapi (fun number line ->
507 Added: let line_number = number + 1 in
508 Added: HTML.
509 Added: [
510 Added: a
511 Added: [
512 Added: id "readme-%d" line_number;
513 Added: class_ "line-anchor";
514 Added: href "#readme-%d" line_number;
515 Added: Aria.label "Line %d" line_number;
516 Added: ]
517 Added: [ txt "%d" line_number ];
518 Added: span [ class_ "line" ] [ txt "\t%s\n" line ];
519 Added: ])
520 Added: |> List.concat
521 Added: in
522 Added: HTML.(
523 Added: section
524 Added: [ class_ "readme-inline" ]
525 Added: [ h3 [] [ txt "README" ]; div [ class_ "blob" ] formatted ])
526 Added: in
527 Added: render_page context ~active:Summary
528 Added: HTML.
529 Added: [
530 Added: div
531 Added: [ class_ "summary-layout" ]
532 Added: [
533 Added: div [ class_ "summary-commits" ] commits_section;
534 Added: div [ class_ "summary-readme" ] [ readme_section ];
497 535 ];
498 536 ]
499 537