tony
cff52b4b9e
- Travel dates: TopBar chip + popover (outbound/return/travellers); sent to Grok prompt; itinerary.needsTravelDates drives a nudge banner; cache and prefetch ledger invalidate when dates change - Sea crossings: CrossingOption schema (Eurotunnel, DFDS, P&O, Brittany, Stena Line); CrossingSwapBlock under tunnel/ferry/crossing stops with trip-impact deltas and Book links; prompt requires 3-5 real options for every UK ↔ mainland route; picking a crossing triggers silent re-plan - Tesla in-car polish: UA + heuristic detection sets <html class="incar">; CSS overrides kill backdrop-filter, scale fonts, enforce 44px tap targets, disable hover flicker; geolocation + reverse geocode + crosshair button inside the From input; up/down arrow reorder buttons replace touch-broken HTML5 drag-and-drop - Tesla Fleet API stub: /.well-known/appspecific/com.tesla.3p.public-key.pem served from TESLA_FLEET_PUBLIC_KEY for partner domain verification; OAuth callback + vehicle_data stub return 503 until partner approval - Dockerfile + .dockerignore for Dokku deployment; server now serves client/dist in production
151 lines
4.5 KiB
CSS
151 lines
4.5 KiB
CSS
@import url('https://fonts.googleapis.com/css2?family=Geist:wght@300;400;500;600;700&family=Geist+Mono:wght@400;500&display=swap');
|
|
|
|
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
:root {
|
|
/* Direction B palette */
|
|
--gd-bg: #0a0a0c;
|
|
--gd-bg-2: #111114;
|
|
--gd-panel: #15151a;
|
|
--gd-panel-2: #1c1c22;
|
|
--gd-border: rgba(255, 255, 255, 0.08);
|
|
--gd-border-2: rgba(255, 255, 255, 0.14);
|
|
--gd-text: #f5f5f7;
|
|
--gd-text-2: #a8a8b0;
|
|
--gd-text-3: #6c6c75;
|
|
--gd-red: #e31937;
|
|
--gd-red-soft: rgba(227, 25, 55, 0.14);
|
|
--gd-red-line: rgba(227, 25, 55, 0.32);
|
|
--gd-green: #4ade80;
|
|
--gd-amber: #fbbf24;
|
|
--gd-blue: #60a5fa;
|
|
--gd-purple: #c084fc;
|
|
|
|
/* Legacy aliases (still referenced in a few places) */
|
|
--tesla-red: var(--gd-red);
|
|
--bg: var(--gd-bg);
|
|
--bg-elevated: var(--gd-bg-2);
|
|
--bg-card: var(--gd-panel);
|
|
--border: var(--gd-border);
|
|
}
|
|
|
|
html, body, #root {
|
|
margin: 0;
|
|
padding: 0;
|
|
height: 100%;
|
|
background: var(--gd-bg);
|
|
color: var(--gd-text);
|
|
font-family: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
letter-spacing: -0.01em;
|
|
-webkit-font-smoothing: antialiased;
|
|
}
|
|
|
|
.mono { font-family: 'Geist Mono', ui-monospace, monospace; }
|
|
.num { font-variant-numeric: tabular-nums; font-feature-settings: 'tnum'; }
|
|
|
|
::-webkit-scrollbar {
|
|
width: 6px;
|
|
height: 6px;
|
|
}
|
|
::-webkit-scrollbar-track { background: transparent; }
|
|
::-webkit-scrollbar-thumb {
|
|
background: rgba(255, 255, 255, 0.12);
|
|
border-radius: 3px;
|
|
}
|
|
::-webkit-scrollbar-thumb:hover {
|
|
background: rgba(255, 255, 255, 0.22);
|
|
}
|
|
|
|
.leaflet-container {
|
|
background: #0a0f1a !important;
|
|
font-family: inherit;
|
|
}
|
|
|
|
/* Override Leaflet popup styling to match Direction B */
|
|
.leaflet-popup-content-wrapper {
|
|
background: rgba(20, 20, 24, 0.95);
|
|
color: var(--gd-text);
|
|
border: 1px solid var(--gd-border-2);
|
|
border-radius: 10px;
|
|
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
|
|
}
|
|
.leaflet-popup-tip {
|
|
background: rgba(20, 20, 24, 0.95);
|
|
}
|
|
.leaflet-popup-content {
|
|
margin: 10px 12px;
|
|
font-size: 12px;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
/* ─── In-car browser overrides ─────────────────────────────────────────────
|
|
* Triggered when <html class="incar"> is set by client/src/lib/incar.ts.
|
|
* Goals: bigger fonts, larger tap targets, no expensive blurs (MCU1/MCU2
|
|
* fall off a cliff with backdrop-filter), no accidental hover-only states.
|
|
* Scoped to .incar so it never affects desktop builds.
|
|
*/
|
|
html.incar {
|
|
font-size: 17px; /* baseline bump — most leaf text uses px values
|
|
so this primarily affects rem-based things */
|
|
}
|
|
html.incar body {
|
|
/* Slightly thicker base text colour for readability at arm's length */
|
|
color: var(--gd-text);
|
|
}
|
|
|
|
/* Kill backdrop-filter entirely — it murders frame rate on MCU2 */
|
|
html.incar *,
|
|
html.incar *::before,
|
|
html.incar *::after {
|
|
backdrop-filter: none !important;
|
|
-webkit-backdrop-filter: none !important;
|
|
}
|
|
|
|
/* Bump every interactive control to 44px minimum tap target. */
|
|
html.incar button,
|
|
html.incar [role="button"],
|
|
html.incar input[type="date"],
|
|
html.incar input[type="text"],
|
|
html.incar input[type="number"] {
|
|
min-height: 44px;
|
|
font-size: 15px;
|
|
}
|
|
|
|
/* Scale tiny utility text up — Tailwind ships these as fixed px values so
|
|
* we override them globally inside .incar. */
|
|
html.incar .text-\[10px\],
|
|
html.incar .text-\[10\.5px\],
|
|
html.incar .text-\[11px\] { font-size: 13px !important; }
|
|
html.incar .text-\[11\.5px\],
|
|
html.incar .text-\[12px\] { font-size: 14px !important; }
|
|
html.incar .text-\[12\.5px\],
|
|
html.incar .text-\[13px\],
|
|
html.incar .text-\[13\.5px\] { font-size: 15px !important; }
|
|
html.incar .text-\[14px\] { font-size: 16px !important; }
|
|
html.incar .text-\[15px\] { font-size: 17px !important; }
|
|
html.incar .text-\[16px\] { font-size: 18px !important; }
|
|
html.incar .text-\[18px\] { font-size: 20px !important; }
|
|
html.incar .text-\[20px\] { font-size: 22px !important; }
|
|
|
|
/* Native date input is a tiny target on touch — fatten it. */
|
|
html.incar input[type="date"] {
|
|
padding: 12px 14px;
|
|
font-size: 16px;
|
|
}
|
|
|
|
/* Bigger scrollbars — finger-friendly */
|
|
html.incar ::-webkit-scrollbar {
|
|
width: 12px;
|
|
height: 12px;
|
|
}
|
|
|
|
/* Hover states cause flicker on touch — disable on the incar build. */
|
|
html.incar .hover\:bg-white\/\[0\.04\]:hover,
|
|
html.incar .hover\:bg-white\/\[0\.03\]:hover,
|
|
html.incar .hover\:bg-white\/\[0\.025\]:hover,
|
|
html.incar .hover\:bg-white\/\[0\.02\]:hover {
|
|
background: transparent !important;
|
|
}
|