diff --git a/package.json b/package.json index 541099ba98..fe08c807bc 100644 --- a/package.json +++ b/package.json @@ -49,6 +49,7 @@ "@typescript-eslint/parser": "^7.13.1", "analytics": "^0.8.14", "clsx": "^2.1.1", + "cobe": "^0.6.3", "cva": "npm:class-variance-authority@^0.7.0", "date-fns": "^3.6.0", "dequal": "^2.0.3", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 09f5c6318d..bef7431cdd 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -81,6 +81,9 @@ importers: clsx: specifier: ^2.1.1 version: 2.1.1 + cobe: + specifier: ^0.6.3 + version: 0.6.3 cva: specifier: npm:class-variance-authority@^0.7.0 version: class-variance-authority@0.7.0 @@ -2104,6 +2107,9 @@ packages: resolution: {integrity: sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==} engines: {node: '>=6'} + cobe@0.6.3: + resolution: {integrity: sha512-WHr7X4o1ym94GZ96h7b1pNemZJacbOzd02dZtnVwuC4oWBaLg96PBmp2rIS1SAhUDhhC/QyS9WEqkpZIs/ZBTg==} + code-red@1.0.4: resolution: {integrity: sha512-7qJWqItLA8/VPVlKJlFXU+NBlo/qyfs39aJcuMT/2ere32ZqvF5OSxgdM5xOfJJ7O429gg2HM47y8v9P+9wrNw==} @@ -3371,6 +3377,9 @@ packages: resolution: {integrity: sha512-qTAAlrEsl8s4OiEQY69wDvcMIdQN6wdz5ojQiOy6YRMuynxenON0O5oCpJI6lshc6scgAY8qvJ2On/p+CXY0GA==} engines: {node: '>=4'} + phenomenon@1.6.0: + resolution: {integrity: sha512-7h9/fjPD3qNlgggzm88cY58l9sudZ6Ey+UmZsizfhtawO6E3srZQXywaNm2lBwT72TbpHYRPy7ytIHeBUD/G0A==} + phin@2.9.3: resolution: {integrity: sha512-CzFr90qM24ju5f88quFC/6qohjC144rehe5n6DH900lgXmUe86+xCKc10ev56gRKC4/BkHUoG4uSiQgBiIXwDA==} deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info. @@ -6446,6 +6455,10 @@ snapshots: clsx@2.1.1: {} + cobe@0.6.3: + dependencies: + phenomenon: 1.6.0 + code-red@1.0.4: dependencies: '@jridgewell/sourcemap-codec': 1.5.0 @@ -7744,6 +7757,8 @@ snapshots: postgres-date: 1.0.7 postgres-interval: 1.2.0 + phenomenon@1.6.0: {} + phin@2.9.3: {} phin@3.7.1: diff --git a/src/app.css b/src/app.css index e4496d66cd..2e5af9fb73 100644 --- a/src/app.css +++ b/src/app.css @@ -77,8 +77,11 @@ /* Animations */ --animate-scale-in: scale-in 200ms ease-out forwards; + --animate-fade-in: fade-in 500ms ease-out forwards; --animate-text: fade-in 0.75s ease-in-out both, blur 0.75s ease-in-out both, up 0.75s ease-in-out both; + --animate-map: map 0.75s ease-in-out both; + --animate-marker: marker 1.5s ease-in-out both infinite; /* Pink polyfills */ --transition: 0.2s; @@ -120,6 +123,28 @@ } } + @keyframes map { + 0% { + opacity: 0; + transform: scale(0.98); + } + 100% { + opacity: 1; + transform: scale(1); + } + } + + @keyframes marker { + 0% { + opacity: 0.75; + r: var(--radius); + } + 100% { + opacity: 0; + r: calc(var(--radius) * 2); + } + } + /* Fonts */ --font-family-sans: 'Inter', arial, sans-serif; --font-family-mono: 'Fira Code', monospace; diff --git a/src/lib/components/regions/(assets)/australia.png b/src/lib/components/regions/(assets)/australia.png new file mode 100644 index 0000000000..026a3d342b Binary files /dev/null and b/src/lib/components/regions/(assets)/australia.png differ diff --git a/src/lib/components/regions/(assets)/france.png b/src/lib/components/regions/(assets)/france.png new file mode 100644 index 0000000000..bbabc3bae2 Binary files /dev/null and b/src/lib/components/regions/(assets)/france.png differ diff --git a/src/lib/components/regions/(assets)/germany.png b/src/lib/components/regions/(assets)/germany.png new file mode 100644 index 0000000000..78ed01f600 Binary files /dev/null and b/src/lib/components/regions/(assets)/germany.png differ diff --git a/src/lib/components/regions/(assets)/india.png b/src/lib/components/regions/(assets)/india.png new file mode 100644 index 0000000000..ad02450629 Binary files /dev/null and b/src/lib/components/regions/(assets)/india.png differ diff --git a/src/lib/components/regions/(assets)/singapore.png b/src/lib/components/regions/(assets)/singapore.png new file mode 100644 index 0000000000..ac570cc8e5 Binary files /dev/null and b/src/lib/components/regions/(assets)/singapore.png differ diff --git a/src/lib/components/regions/(assets)/usa.png b/src/lib/components/regions/(assets)/usa.png new file mode 100644 index 0000000000..700322fb12 Binary files /dev/null and b/src/lib/components/regions/(assets)/usa.png differ diff --git a/src/lib/components/regions/Globe.svelte b/src/lib/components/regions/Globe.svelte new file mode 100644 index 0000000000..38c3452aec --- /dev/null +++ b/src/lib/components/regions/Globe.svelte @@ -0,0 +1,61 @@ + + +
+
+ +
+
diff --git a/src/lib/components/regions/Map.svelte b/src/lib/components/regions/Map.svelte new file mode 100644 index 0000000000..2c99445a66 --- /dev/null +++ b/src/lib/components/regions/Map.svelte @@ -0,0 +1,279 @@ + + +
+
+ {#if showTooltip} +
+ {tooltip.city} + ({tooltip.code}) + {#if tooltip.available} +
+ Available now +
+ {:else} +
+ {tooltip.release} +
+ {/if} +
+ {/if} +
+ {#each pins as pin} +
+ {pin.city} + ({pin.code}) + {#if pin.available} +
+ Available now +
+ {:else} +
+ {pin.release} +
+ {/if} +
+ {/each} +
+ + + + + + {#each pins as pin, index} + {@const radius = 8} + { + handleTooltip({ + event, + city: pin.city, + code: pin.code, + available: pin.available, + release: pin.release + }); + }} + on:mouseleave={() => (showTooltip = false)} + > + + + + + + + + + + + {/each} + + +
+ + diff --git a/src/markdoc/tags/Regions_Map.svelte b/src/markdoc/tags/Regions_Map.svelte new file mode 100644 index 0000000000..3cf9ffcf94 --- /dev/null +++ b/src/markdoc/tags/Regions_Map.svelte @@ -0,0 +1,5 @@ + + + diff --git a/src/markdoc/tags/_Module.svelte b/src/markdoc/tags/_Module.svelte index 63302e19d3..7206536a0f 100644 --- a/src/markdoc/tags/_Module.svelte +++ b/src/markdoc/tags/_Module.svelte @@ -19,4 +19,5 @@ export { default as Accordion_Item } from './Accordion_Item.svelte'; export { default as Youtube } from './Youtube.svelte'; export { default as Call_To_Action } from './Call_To_Action.svelte'; + export { default as Regions_Map } from './Regions_Map.svelte'; diff --git a/src/routes/maps/+page.svelte b/src/routes/maps/+page.svelte new file mode 100644 index 0000000000..ed8bdbde82 --- /dev/null +++ b/src/routes/maps/+page.svelte @@ -0,0 +1,8 @@ + + +
+ +
diff --git a/src/routes/maps/+page.ts b/src/routes/maps/+page.ts new file mode 100644 index 0000000000..a3d15781a7 --- /dev/null +++ b/src/routes/maps/+page.ts @@ -0,0 +1 @@ +export const ssr = false;