diff --git a/src/client/styles/browser.css b/src/client/styles/browser.css index ceb24ec..372cc8e 100644 --- a/src/client/styles/browser.css +++ b/src/client/styles/browser.css @@ -31,7 +31,7 @@ .lc-map-num { font-size: 10px; color: var(--dsw-alias-label-secondary); line-height: 1.2; font-variant-numeric: tabular-nums; } .lc-map-tip { display: flex; flex-direction: column; max-width: 240px; padding: 5px 8px; line-height: 1.45; white-space: nowrap; } .lc-map-tip-on { opacity: 1; } -.lc-br-pick { font: inherit; font-size: 12px; color: var(--dsw-alias-label-primary); background: var(--dsw-alias-bg-layer-2); border: 1px solid var(--dsw-alias-border-l2); border-radius: 6px; padding: 3px 6px; max-width: 240px; } +.lc-br-pick { font: inherit; font-size: 12px; color: var(--dsw-alias-label-primary); background: var(--dsw-alias-bg-layer-2); border: 0.5px solid var(--dsw-alias-border-l4); border-radius: 6px; padding: 3px 6px; max-width: 240px; } /* The right figure sits at the main column's edge — the button column takes its own slack, so the figures no longer sit beside the button. */ .lc-br-meta { display: flex; flex-wrap: wrap; gap: 6px 16px; color: var(--dsw-alias-label-secondary); } .lc-br-meta b { color: var(--dsw-alias-label-primary); } diff --git a/src/client/styles/fleet.css b/src/client/styles/fleet.css index ce351b6..c9f4d12 100644 --- a/src/client/styles/fleet.css +++ b/src/client/styles/fleet.css @@ -8,7 +8,7 @@ .lc-fleet-filters { display: inline-flex; flex-wrap: wrap; gap: 2px; padding: 2px; border-radius: 7px; background: var(--dsw-alias-bg-layer-2); border: 1px solid var(--dsw-alias-border-l2); } .lc-fleet-search { flex: 1 1 140px; min-width: 120px; max-width: 240px; font: inherit; font-size: 11.5px; padding: 4px 9px; border-radius: 7px; border: 1px solid var(--dsw-alias-border-l2); background: var(--dsw-alias-bg-layer-2); color: var(--dsw-alias-label-primary); outline: none; } .lc-fleet-search:focus-visible { border-color: var(--dsw-alias-brand-primary, var(--color-blue-500)); } -.lc-fleet-sort { font: inherit; font-size: 11.5px; padding: 3px 6px; border-radius: 7px; border: 1px solid var(--dsw-alias-border-l2); background: var(--dsw-alias-bg-layer-2); color: var(--dsw-alias-label-primary); } +.lc-fleet-sort { font: inherit; font-size: 11.5px; padding: 3px 6px; border-radius: 7px; border: 0.5px solid var(--dsw-alias-border-l4); background: var(--dsw-alias-bg-layer-2); color: var(--dsw-alias-label-primary); } /* ---- Overview strip ---- */ .lc-summary { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; } diff --git a/src/client/styles/overview.css b/src/client/styles/overview.css index 591adcd..7e440dc 100644 --- a/src/client/styles/overview.css +++ b/src/client/styles/overview.css @@ -165,8 +165,9 @@ button.lc-heat-cell:hover { box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--col .lc-ov-search { flex: 1 1 150px; min-width: 110px; border: 1px solid var(--dsw-alias-border-l2); background: var(--dsw-alias-bg-layer-2); border-radius: 6px; padding: 4px 10px; font: inherit; font-size: 12px; color: var(--dsw-alias-label-primary); outline: none; transition: border-color var(--ds-transition-duration, 0.2s) var(--ds-ease-in-out, ease-in-out); } .lc-ov-search:focus { border-color: var(--dsw-alias-label-secondary); } .lc-ov-search::placeholder { color: var(--dsw-alias-label-secondary); } -/* The coverage picker neighbors the search box; the search recipe keeps the two one height. */ -.lc-ov-cover { flex: none; border: 1px solid var(--dsw-alias-border-l2); background: var(--dsw-alias-bg-layer-2); border-radius: 6px; padding: 4px 8px; font: inherit; font-size: 12px; color: var(--dsw-alias-label-primary); } +/* The coverage picker neighbors the search box; the search recipe keeps the two one height. + The 0.5px border-l4 hairline is dsh's own form-field border: l2 at 1px reads as borderless on white. */ +.lc-ov-cover { flex: none; border: 0.5px solid var(--dsw-alias-border-l4); background: var(--dsw-alias-bg-layer-2); border-radius: 6px; padding: 4px 8px; font: inherit; font-size: 12px; color: var(--dsw-alias-label-primary); } .lc-ov-groups { display: flex; gap: 6px; flex-wrap: wrap; margin: -2px 0 10px; } .lc-ov-chip { display: inline-flex; align-items: baseline; gap: 5px; border: 1px solid var(--dsw-alias-border-l2); background: transparent; color: var(--dsw-alias-label-secondary); border-radius: 999px; font: inherit; font-size: 11px; line-height: 1.5; padding: 2px 10px; cursor: pointer; max-width: 220px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: color var(--ds-transition-duration, 0.2s) var(--ds-ease-in-out, ease-in-out), border-color var(--ds-transition-duration, 0.2s) var(--ds-ease-in-out, ease-in-out), background-color var(--ds-transition-duration, 0.2s) var(--ds-ease-in-out, ease-in-out); }