mirror of
https://github.com/mauriceboe/TREK.git
synced 2026-10-22 23:16:46 +00:00
Maurice
0a2fa32fc1
The card was a flat list: two key fields, four Google switches and a large weather panel, all at the same level. That gave a switch you set once the same weight as the key it depends on, and gave the loudest treatment on the page to the one thing with nothing to configure. Now three comparable provider blocks. The TREK index carries the accent and the recommendation, because a key should be the exception rather than the expected setup. Google carries no border badge, so it does not stand out, and says plainly what it costs beyond money. Weather has left the card: it needs no key and had nothing to set. The "recommended" badge moved from Google to the index, which is the whole point of the change. Also here, and both are their own thing: - The settings tab is two columns from xl up. Nearly every card is "label left, switch right", so the middle stayed empty while the page scrolled for ages. Explicit columns rather than a grid over the flat list, because a grid pairs cards row by row and leaves a hole under the shorter one, and these differ by hundreds of pixels. - Pictures: the nearby fallback drops from 300m to 60m and is skipped entirely for shops and gastronomy. Measured across 600 places in six cities, 2 percent of ordinary businesses have a picture on Wikimedia against 70 percent of churches, so for a cafe the curated rungs never fire and the fallback always does. That is how the town hall ended up over the doner shop. It fails open on an unknown category, so landmarks keep the fallback that works for them. vite.config reads the dev port and the API target from the environment, defaulting to what they were. Several worktrees could not run side by side.
22 lines
8.0 KiB
TypeScript
22 lines
8.0 KiB
TypeScript
import React from 'react'
|
|
|
|
/**
|
|
* The TREK wordmark, including the pill.
|
|
*
|
|
* `fill="currentColor"` on the mark and the two pill classes below are what let
|
|
* one file serve both themes: the letters take the surrounding text colour, the
|
|
* pill inverts against it. No second asset, no dark-mode variant to keep in
|
|
* sync, and it stays correct if the accent or the surface ever changes.
|
|
*/
|
|
export default function TrekMark(props: React.SVGProps<SVGSVGElement>): React.ReactElement {
|
|
return (
|
|
<>
|
|
<style>{`
|
|
.trek-mark .pill-bg { fill: currentColor; }
|
|
.trek-mark .pill-fg { fill: var(--bg-card); }
|
|
`}</style>
|
|
<svg {...props} className={`trek-mark ${props.className ?? ''}`} xmlns="http://www.w3.org/2000/svg" viewBox="1524.6 76.2 1138.0 285.8" fill="currentColor" role="img" aria-label="TREK Places API"><defs><g/><clipPath id="737cc381ca"><rect x="0" width="653" y="0" height="450"/></clipPath><clipPath id="21cafe8b17"><path d="M 2287.46875 169.585938 L 2656.628906 169.585938 L 2656.628906 314.753906 L 2287.46875 314.753906 Z M 2287.46875 169.585938 " clipRule="nonzero"/></clipPath><clipPath id="ad29c73ee0"><path d="M 2308.46875 169.585938 L 2635.550781 169.585938 C 2647.148438 169.585938 2656.550781 178.984375 2656.550781 190.585938 L 2656.550781 293.753906 C 2656.550781 305.351562 2647.148438 314.753906 2635.550781 314.753906 L 2308.46875 314.753906 C 2296.871094 314.753906 2287.46875 305.351562 2287.46875 293.753906 L 2287.46875 190.585938 C 2287.46875 178.984375 2296.871094 169.585938 2308.46875 169.585938 Z M 2308.46875 169.585938 " clipRule="nonzero"/></clipPath><clipPath id="4c9feae353"><path d="M 0.46875 0.585938 L 369.558594 0.585938 L 369.558594 145.753906 L 0.46875 145.753906 Z M 0.46875 0.585938 " clipRule="nonzero"/></clipPath><clipPath id="2b51a6604b"><path d="M 21.46875 0.585938 L 348.550781 0.585938 C 360.148438 0.585938 369.550781 9.984375 369.550781 21.585938 L 369.550781 124.753906 C 369.550781 136.351562 360.148438 145.753906 348.550781 145.753906 L 21.46875 145.753906 C 9.871094 145.753906 0.46875 136.351562 0.46875 124.753906 L 0.46875 21.585938 C 0.46875 9.984375 9.871094 0.585938 21.46875 0.585938 Z M 21.46875 0.585938 " clipRule="nonzero"/></clipPath><clipPath id="95c2d63342"><rect x="0" width="370" y="0" height="146"/></clipPath></defs><g transform="matrix(1, 0, 0, 1, 1526, 0)"><g clipPath="url(#737cc381ca)"><g><g transform="translate(0.514823, 355.998939)"><g><path d="M 92.25 0 C 74.5 0 60.625 -5.0625 50.625 -15.1875 C 40.625 -25.3125 35.625 -39 35.625 -56.25 L 35.625 -239.265625 L 94.140625 -239.265625 L 94.140625 -59.625 C 94.140625 -56.625 95.203125 -54.0625 97.328125 -51.9375 C 99.453125 -49.8125 102.015625 -48.75 105.015625 -48.75 L 147.015625 -48.75 L 147.015625 0 Z M 4.125 -144.765625 L 4.125 -192.390625 L 147.015625 -192.390625 L 147.015625 -144.765625 Z M 4.125 -144.765625 "/></g></g></g><g><g transform="translate(135.525372, 355.998939)"><g><path d="M 20.25 0 L 20.25 -135.765625 C 20.25 -153.265625 25.25 -167.015625 35.25 -177.015625 C 45.25 -187.015625 59.125 -192.015625 76.875 -192.015625 L 132.765625 -192.015625 L 132.765625 -144.765625 L 91.125 -144.765625 C 87.625 -144.765625 84.625 -143.578125 82.125 -141.203125 C 79.625 -138.828125 78.375 -135.765625 78.375 -132.015625 L 78.375 0 Z M 20.25 0 "/></g></g></g><g><g transform="translate(246.533968, 355.998939)"><g><path d="M 122.265625 0 C 100.503906 0 81.375 -4.0625 64.875 -12.1875 C 48.375 -20.3125 35.5625 -31.5625 26.4375 -45.9375 C 17.3125 -60.3125 12.75 -77.003906 12.75 -96.015625 C 12.75 -117.015625 17.125 -135.015625 25.875 -150.015625 C 34.625 -165.015625 46.3125 -176.578125 60.9375 -184.703125 C 75.5625 -192.828125 91.753906 -196.890625 109.515625 -196.890625 C 129.765625 -196.890625 146.703125 -192.640625 160.328125 -184.140625 C 173.953125 -175.640625 184.265625 -164.078125 191.265625 -149.453125 C 198.265625 -134.828125 201.765625 -118.140625 201.765625 -99.390625 C 201.765625 -96.140625 201.578125 -92.320312 201.203125 -87.9375 C 200.828125 -83.5625 200.390625 -80.125 199.890625 -77.625 L 73.875 -77.625 C 75.375 -71.125 78.25 -65.625 82.5 -61.125 C 86.75 -56.625 92.125 -53.3125 98.625 -51.1875 C 105.132812 -49.0625 112.390625 -48 120.390625 -48 L 179.265625 -48 L 179.265625 0 Z M 72.375 -114.015625 L 145.515625 -114.015625 C 145.015625 -118.015625 144.265625 -121.890625 143.265625 -125.640625 C 142.265625 -129.390625 140.703125 -132.703125 138.578125 -135.578125 C 136.453125 -138.453125 134.015625 -140.953125 131.265625 -143.078125 C 128.515625 -145.203125 125.328125 -146.890625 121.703125 -148.140625 C 118.078125 -149.390625 114.015625 -150.015625 109.515625 -150.015625 C 103.765625 -150.015625 98.632812 -149.015625 94.125 -147.015625 C 89.625 -145.015625 85.875 -142.328125 82.875 -138.953125 C 79.875 -135.578125 77.5625 -131.703125 75.9375 -127.328125 C 74.3125 -122.953125 73.125 -118.515625 72.375 -114.015625 Z M 72.375 -114.015625 "/></g></g></g><g><g transform="translate(434.423849, 355.998939)"><g><path d="M 21.75 0 L 21.75 -273.765625 L 79.875 -273.765625 L 79.875 -119.640625 L 105.390625 -119.640625 L 149.265625 -192.390625 L 214.140625 -192.390625 L 162.390625 -112.140625 C 177.390625 -105.890625 189.078125 -96.320312 197.453125 -83.4375 C 205.828125 -70.5625 210.015625 -55.5 210.015625 -38.25 L 210.015625 0 L 151.515625 0 L 151.515625 -38.25 C 151.515625 -45.25 149.828125 -51.5625 146.453125 -57.1875 C 143.078125 -62.8125 138.640625 -67.25 133.140625 -70.5 C 127.640625 -73.75 121.390625 -75.375 114.390625 -75.375 L 79.875 -75.375 L 79.875 0 Z M 21.75 0 "/></g></g></g></g></g><g clipPath="url(#21cafe8b17)"><g clipPath="url(#ad29c73ee0)"><g transform="matrix(1, 0, 0, 1, 2287, 169)"><g clipPath="url(#95c2d63342)"><g clipPath="url(#4c9feae353)"><g clipPath="url(#2b51a6604b)"><path className="pill-bg" d="M 0.46875 0.585938 L 369.628906 0.585938 L 369.628906 145.753906 L 0.46875 145.753906 Z M 0.46875 0.585938 " fillRule="nonzero"/></g></g></g></g></g></g><g className="pill-fg"><g transform="translate(2399.041752, 268.584017)"><g><path d="M 0 0 L 17.703125 -48.28125 C 18.585938 -50.675781 20.039062 -52.484375 22.0625 -53.703125 C 24.09375 -54.921875 26.382812 -55.53125 28.9375 -55.53125 C 31.488281 -55.53125 33.773438 -54.945312 35.796875 -53.78125 C 37.828125 -52.613281 39.285156 -50.804688 40.171875 -48.359375 L 57.953125 0 L 43.84375 0 L 40.40625 -10.53125 L 17.234375 -10.53125 L 13.65625 0 Z M 20.59375 -21.375 L 37.046875 -21.375 L 30.109375 -43.140625 C 30.003906 -43.453125 29.859375 -43.671875 29.671875 -43.796875 C 29.492188 -43.921875 29.273438 -43.984375 29.015625 -43.984375 C 28.753906 -43.984375 28.53125 -43.90625 28.34375 -43.75 C 28.164062 -43.601562 28.050781 -43.398438 28 -43.140625 Z M 20.59375 -21.375 "/></g></g></g><g className="pill-fg"><g transform="translate(2455.817146, 268.584017)"><g><path d="M 4.765625 0 L 4.765625 -54.59375 L 28.234375 -54.59375 C 31.878906 -54.59375 35.222656 -53.757812 38.265625 -52.09375 C 41.304688 -50.4375 43.734375 -48.140625 45.546875 -45.203125 C 47.367188 -42.265625 48.28125 -38.867188 48.28125 -35.015625 C 48.28125 -31.171875 47.367188 -27.753906 45.546875 -24.765625 C 43.734375 -21.773438 41.316406 -19.445312 38.296875 -17.78125 C 35.285156 -16.113281 31.929688 -15.28125 28.234375 -15.28125 L 17.859375 -15.28125 L 17.859375 0 Z M 17.859375 -26.28125 L 26.75 -26.28125 C 28.3125 -26.28125 29.71875 -26.617188 30.96875 -27.296875 C 32.21875 -27.972656 33.226562 -28.960938 34 -30.265625 C 34.78125 -31.566406 35.171875 -33.125 35.171875 -34.9375 C 35.171875 -36.757812 34.78125 -38.320312 34 -39.625 C 33.226562 -40.925781 32.203125 -41.925781 30.921875 -42.625 C 29.648438 -43.332031 28.257812 -43.6875 26.75 -43.6875 L 17.859375 -43.6875 Z M 17.859375 -26.28125 "/></g></g></g><g className="pill-fg"><g transform="translate(2506.041587, 268.584017)"><g><path d="M 3.515625 0 L 3.515625 -10.921875 L 12.953125 -10.921875 L 12.953125 -43.6875 L 3.515625 -43.6875 L 3.515625 -54.59375 L 35.40625 -54.59375 L 35.40625 -43.6875 L 25.96875 -43.6875 L 25.96875 -10.921875 L 35.40625 -10.921875 L 35.40625 0 Z M 3.515625 0 "/></g></g></g></svg>
|
|
</>
|
|
)
|
|
}
|