{place.address && {place.address}}
{/* Same picker as inside a trip (#1455). A saved place is somewhere
you intend to go, and until now the only way to get directions
was to add it to a trip first. */}
- {navigationTargets.length > 0 && (
- <>
-
- {navOpen && (
- setNavOpen(false)}
- />
- )}
- >
- )}
)}
@@ -371,6 +348,32 @@ export default function CollectionPlaceDetail({
<>
{canEdit && }
+ {/* Beside the other two rather than up by the address: getting directions is
+ something you DO with the place, like editing it or copying it into a
+ trip, and the row of things you do belongs in one place. */}
+ {navigationTargets.length > 0 && (
+ <>
+
+ {navOpen && (
+ setNavOpen(false)}
+ />
+ )}
+ >
+ )}
{canDelete && }
>
diff --git a/client/src/styles/collections.css b/client/src/styles/collections.css
index 8171c8e2b..1586e6b2d 100644
--- a/client/src/styles/collections.css
+++ b/client/src/styles/collections.css
@@ -444,9 +444,6 @@
.trek-dash .col-detail-addr svg { flex-shrink: 0; }
/* Directions (#1455): sits on the meta line beside the address, quieter than
the link chips below — it is an action on the place, not a piece of it. */
-.trek-dash .col-detail-nav { display: inline-flex; align-items: center; gap: 5px; padding: 5px 11px; border-radius: 999px; font-size: 12px; font-weight: 600; color: var(--ink-2); background: var(--surface-2); border: 1px solid var(--line); transition: background .12s, color .12s; white-space: nowrap; }
-.trek-dash .col-detail-nav:hover { background: var(--surface-3, var(--surface-2)); color: var(--ink); }
-.trek-dash .col-detail-nav svg { flex-shrink: 0; }
/* status segmented control */
.trek-dash .col-detail-seg { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; padding: 4px; border-radius: 12px; background: var(--surface-2); }
@@ -482,8 +479,11 @@
/* footer action bar */
.trek-dash .col-detail-footer { display: flex; align-items: center; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--line); flex-shrink: 0; }
.trek-dash .col-detail-footer-spacer { flex: 1 1 auto; }
-.trek-dash .col-detail-btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 10px; font-size: 12.5px; font-weight: 600; color: var(--ink-2); background: var(--surface-2); border: 1px solid var(--line-2); transition: background .12s, color .12s; }
+/* Pill-shaped, the way the navigation button already was: the footer is one row of
+ things you do with the place, and it should read as one row. */
+.trek-dash .col-detail-btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 999px; font-size: 12.5px; font-weight: 600; color: var(--ink-2); background: var(--surface-2); border: 1px solid var(--line); transition: background .12s, color .12s; white-space: nowrap; }
.trek-dash .col-detail-btn:hover { background: var(--surface); color: var(--ink); }
+.trek-dash .col-detail-btn svg { flex-shrink: 0; }
.trek-dash .col-detail-btn.primary { background: var(--accent); border-color: var(--accent); color: var(--accent-text); }
.trek-dash .col-detail-btn.danger { color: oklch(0.6 0.2 25); border-color: transparent; background: transparent; }
.trek-dash .col-detail-btn.danger:hover { background: oklch(0.6 0.2 25 / .12); }