diff --git a/web/css/09-record.css b/web/css/09-record.css index 1be5d2a..d245177 100644 --- a/web/css/09-record.css +++ b/web/css/09-record.css @@ -158,10 +158,40 @@ flex-direction: column; gap: 8px; } +.record-actions { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 12px; +} +.record-actions .btn { + width: 100%; + min-height: 64px; + border-width: 2.5px; + box-shadow: var(--shadow-md); + padding: 14px 12px; + text-align: center; + line-height: 1.15; +} .actions-footnote { margin: 0; font: 400 12px/1.4 var(--mono); font-style: italic; color: var(--ink-muted); } +.share-block { + display: flex; +} +.share-block .btn { + min-width: 144px; +} + +@media (max-width: 520px) { + .record-actions { + grid-template-columns: 1fr; + } + .record-actions .btn, + .share-block .btn { + width: 100%; + } +} diff --git a/web/src/crate_web/pages/record.gleam b/web/src/crate_web/pages/record.gleam index a967382..b141252 100644 --- a/web/src/crate_web/pages/record.gleam +++ b/web/src/crate_web/pages/record.gleam @@ -65,14 +65,11 @@ pub fn view(model: Model, detail: EntryDetail) -> Element(Msg) { /// practice, since this page requires a session). fn share_block(model: Model, entry_id: String) -> Element(Msg) { case model.auth { - LoggedIn(handle) -> + LoggedIn(_) -> html.div([attr.class("share-block")], [ - ctl.button("COPY SHARE LINK", ctl.Ghost, [ + ctl.button("COPY LINK", ctl.Ghost, [ event.on_click(CopyRecordLink(entry_id)), ]), - html.span([attr.class("share-block__hint")], [ - text(route.to_path(model.PublicRecord(handle, entry_id))), - ]), ]) LoggedOut -> element.none() } @@ -273,7 +270,7 @@ fn actions( True -> #("CONFIRM REMOVE", EntryAction(entry_id, "dropped")) False -> #("REMOVE", ArmRemove) } - html.div([attr.class("actions")], [ + html.div([attr.class("record-actions")], [ ctl.button(edit_label, ctl.Primary, [event.on_click(ToggleEdit)]), ctl.link_button( amend_label, diff --git a/web/test/record_test.gleam b/web/test/record_test.gleam index 5795f66..7f25573 100644 --- a/web/test/record_test.gleam +++ b/web/test/record_test.gleam @@ -189,10 +189,10 @@ pub fn route_change_to_record_sets_entry_detail_loading_test() { assert after.entry_detail == EntryDetailLoading } -pub fn record_view_shows_a_copy_share_link_button_with_the_public_path_test() { +pub fn record_view_shows_copy_link_without_exposing_the_public_path_test() { let html = record.view(logged_in(), a_detail()) |> element.to_string - assert string.contains(html, "COPY SHARE LINK") - assert string.contains(html, "/u/alice.test/record/e1") + assert string.contains(html, "COPY LINK") + assert !string.contains(html, "/u/alice.test/record/e1") } // The fold-out is gone: AMEND/SUGGEST A FIX is now a plain nav link to the