diff --git a/web/src/crate_web/route.gleam b/web/src/crate_web/route.gleam index e3633d3..9343604 100644 --- a/web/src/crate_web/route.gleam +++ b/web/src/crate_web/route.gleam @@ -50,8 +50,8 @@ pub fn to_path(route: Route) -> String { /// Which bottom-tab section a route belongs to, so drill-downs off a tab /// (a record, the scan flow, a pressing) still show that tab active instead /// of none. `Add` owns its own section rather than folding into `Crate`, so -/// the CRATE tab doesn't light up while the visitor is on the add form (the -/// centre "+" slot has no active rendering of its own yet - see nav.add_tab). +/// the CRATE tab doesn't light up while the visitor is on the add form; the +/// centre "+" slot lights up instead, see `nav.add_tab`. /// `PublicCrate`/`PublicRecord` map to themselves since they're reached /// outside the tab bar entirely. pub fn section(route: Route) -> Route { diff --git a/web/src/crate_web/ui/nav.gleam b/web/src/crate_web/ui/nav.gleam index 3543c54..4233a5b 100644 --- a/web/src/crate_web/ui/nav.gleam +++ b/web/src/crate_web/ui/nav.gleam @@ -62,10 +62,16 @@ fn current_attr(active: Bool) -> List(attr.Attribute(msg)) { } /// The center ADD slot: a square link straight into the scan flow, replacing -/// the old floating action button. -pub fn add_tab(href: String) -> Element(msg) { +/// the old floating action button. Signals active state the same way `tab` +/// does (an `is-active` class plus `aria-current="page"`, never `"false"`). +pub fn add_tab(href: String, active: Bool) -> Element(msg) { html.a( - [attr.class("tab-add"), attr.href(href), attr.aria_label("Add a record")], + [ + attr.class(add_tab_class(active)), + attr.href(href), + attr.aria_label("Add a record"), + ..current_attr(active) + ], [text("+")], ) } @@ -77,6 +83,13 @@ fn tab_class(active: Bool) -> String { } } +fn add_tab_class(active: Bool) -> String { + case active { + True -> "tab-add is-active" + False -> "tab-add" + } +} + fn underline_class(active: Bool) -> String { case active { True -> "tab__underline is-active" diff --git a/web/src/crate_web/view.gleam b/web/src/crate_web/view.gleam index d2b3608..d46b971 100644 --- a/web/src/crate_web/view.gleam +++ b/web/src/crate_web/view.gleam @@ -214,7 +214,7 @@ fn bottom_bar(model: Model) -> Element(Msg) { nav.bottom_bar([ nav.tab("CRATE", route.to_path(Crate), section == Crate, 0), nav.tab("BROWSE", route.to_path(Browse), section == Browse, 0), - nav.add_tab(route.to_path(Scan)), + nav.add_tab(route.to_path(Scan), section == Add), nav.tab("FEED", route.to_path(Feed), section == Feed, 0), nav.tab( "YOU",