@orangecheck/app-design 1.1.1 → 1.2.1

package/dist/chrome.mjs

@@ -570,7 +570,7 @@ function NavDropdown({ item }) {
       PopoverTrigger,
       {
         className: cn(
-          "group inline-flex items-center gap-1 rounded-full py-2 pl-3 pr-2.5 text-[0.9375rem] transition-colors",
+          "group inline-flex items-center gap-1 rounded-full py-2 pl-3 pr-2.5 text-[0.9375rem] transition-colors md:max-lg:pl-2.5 md:max-lg:pr-2",
           active ? "text-foreground" : "text-muted-foreground hover:text-foreground data-[state=open]:text-foreground"
         ),
         children: [
@@ -619,7 +619,10 @@ function SiteHeader({
     ] }) : null
   ] });
   const navigation = nav.length > 0 ? /* @__PURE__ */ jsx("nav", { "aria-label": "Main", className: "hidden items-center gap-1 md:flex", children: nav.map(
-    (n) => n.children?.length ? /* @__PURE__ */ jsx(NavDropdown, { item: n }, n.href) : /* @__PURE__ */ jsx(NavLink, { item: n, line: tool }, n.href)
+    (n) => n.children?.length ? /* @__PURE__ */ jsx(NavDropdown, { item: n }, n.href) : (
+      // Between md and lg the family menu and the actions share the row: tighter.
+      /* @__PURE__ */ jsx(NavLink, { item: n, line: tool, className: tool ? void 0 : "md:max-lg:px-2.5" }, n.href)
+    )
   ) }) : null;
   return /* @__PURE__ */ jsx(
     "header",
@@ -634,7 +637,7 @@ function SiteHeader({
         {
           className: cn(
             "flex items-center justify-between gap-4",
-            tool ? "h-14 px-4 md:px-6" : "oca-container h-16 md:h-[4.5rem]",
+            tool ? "h-14 px-4 md:px-6" : "oca-container h-16 md:h-[4.5rem] md:max-lg:gap-2",
             // Three columns, the outer two each at least their content: the
             // navigation stays centred whatever the actions hold, so it does
             // not shift when they change (signed out to signed in).
@@ -742,9 +745,9 @@ function SiteBanner({
   ] }) });
 }
 var FOOT_LINK = "inline-flex min-h-11 items-center transition-colors hover:text-foreground md:min-h-0";
-function LegalRow() {
+function LegalRow({ links }) {
   return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-x-6 gap-y-2 sm:flex-row sm:items-center sm:justify-between", children: [
-    /* @__PURE__ */ jsx("nav", { "aria-label": "Legal", children: /* @__PURE__ */ jsx("ul", { className: "flex flex-wrap gap-x-5", children: LEGAL_LINKS.map((l) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx("a", { href: l.href, className: FOOT_LINK, children: l.label }) }, l.href)) }) }),
+    /* @__PURE__ */ jsx("nav", { "aria-label": "Legal", children: /* @__PURE__ */ jsx("ul", { className: "flex flex-wrap gap-x-5", children: links.map((l) => /* @__PURE__ */ jsx("li", { children: l.href.startsWith("/") ? /* @__PURE__ */ jsx(Link5, { href: l.href, className: FOOT_LINK, children: l.label }) : /* @__PURE__ */ jsx("a", { href: l.href, className: FOOT_LINK, children: l.label }) }, l.href)) }) }),
     /* @__PURE__ */ jsxs("p", { children: [
       "\xA9 ",
       (/* @__PURE__ */ new Date()).getFullYear(),
@@ -762,14 +765,15 @@ function SiteFooter({
   signature = true,
   className
 }) {
+  const legalLinks = legal === true ? LEGAL_LINKS : legal || null;
   if (compact) {
     return /* @__PURE__ */ jsx("footer", { className: cn("border-t border-border bg-background text-[0.875rem] text-muted-foreground", className), children: /* @__PURE__ */ jsxs("div", { className: "oca-container flex flex-col gap-x-8 gap-y-3 py-5 lg:flex-row lg:items-center lg:justify-between", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-x-6 gap-y-1", children: [
         /* @__PURE__ */ jsx("a", { href: OCHK_IO, className: "rounded-lg text-foreground", children: /* @__PURE__ */ jsx(Lockup, { size: 22 }) }),
         family ? /* @__PURE__ */ jsx("nav", { "aria-label": "Protocols", children: /* @__PURE__ */ jsx("ul", { className: "flex flex-wrap gap-x-4", children: PROTOCOLS.map((p) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx("a", { href: p.pageHref, className: FOOT_LINK, children: p.label }) }, p.slug)) }) }) : null
       ] }),
-      legal || meta ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-x-6 gap-y-2 sm:flex-row sm:flex-wrap sm:items-center", children: [
-        legal ? /* @__PURE__ */ jsx(LegalRow, {}) : null,
+      legalLinks || meta ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-x-6 gap-y-2 sm:flex-row sm:flex-wrap sm:items-center", children: [
+        legalLinks ? /* @__PURE__ */ jsx(LegalRow, { links: legalLinks }) : null,
         meta
       ] }) : null
     ] }) });
@@ -827,8 +831,8 @@ function SiteFooter({
       /* @__PURE__ */ jsx("span", { className: "mb-[0.06em] inline-block w-[1.1em] shrink-0", children: /* @__PURE__ */ jsx(Mark, { className: "block h-auto w-full" }) }),
       /* @__PURE__ */ jsx("span", { children: "orangecheck" })
     ] }) }) : null,
-    legal || meta ? /* @__PURE__ */ jsx("div", { className: "oca-container", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3 border-t border-border py-6 text-[0.875rem] text-muted-foreground", children: [
-      legal ? /* @__PURE__ */ jsx(LegalRow, {}) : null,
+    legalLinks || meta ? /* @__PURE__ */ jsx("div", { className: "oca-container", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3 border-t border-border py-6 text-[0.875rem] text-muted-foreground", children: [
+      legalLinks ? /* @__PURE__ */ jsx(LegalRow, { links: legalLinks }) : null,
       meta
     ] }) }) : null
   ] });