diff options
| author |  Matthew Phillips <matthew@skypack.dev>
| 2022-02-14 12:48:52 -0500 |
|---|---|---|
| committer |  GitHub <noreply@github.com>
| 2022-02-14 12:48:52 -0500 |
| commit | ba5e2b5e6c20207955991775dc4aa8879331542c (patch) | |
| tree | 28e68347035a534f8b56991ede570dfcf830cb01 /examples/ssr/src/components/AddToCart.svelte | |
| parent | 61f438fdcbab7163bc3399e623a80d283e018371 (diff) | |
| download | astro-ba5e2b5e6c20207955991775dc4aa8879331542c.tar.gz astro-ba5e2b5e6c20207955991775dc4aa8879331542c.tar.zst astro-ba5e2b5e6c20207955991775dc4aa8879331542c.zip | |
Flagged SSR support (#2548)
* Checkpoint, basics are working
* Add the `--experimental-ssr` flag
* Adds the changeset
* Fixes population of getStaticPaths results
* Pass through the imported module
* Route manifest test
* Fix remaining tests
* Fix remaining tests
* Copy server assets over
* Fix types
* Allowing passing in the request to the Node version of App
* Improve the example app
* Gets CI to pass
Diffstat (limited to 'examples/ssr/src/components/AddToCart.svelte')
| -rw-r--r-- | examples/ssr/src/components/AddToCart.svelte | 47 |
1 files changed, 47 insertions, 0 deletions
diff --git a/examples/ssr/src/components/AddToCart.svelte b/examples/ssr/src/components/AddToCart.svelte new file mode 100644 index 000000000..b03b8180a --- /dev/null +++ b/examples/ssr/src/components/AddToCart.svelte @@ -0,0 +1,47 @@ +<script> + export let id = 0; + + function addToCart() { + window.dispatchEvent(new CustomEvent('add-to-cart', { + detail: id + })); + } +</script> +<style> + button { + display:block; + padding:0.5em 1em 0.5em 1em; + border-radius:100px; + border:none; + font-size: 1.4em; + position:relative; + background:#0652DD; + cursor:pointer; + height:2em; + width:10em; + overflow:hidden; + transition:transform 0.1s; + z-index:1; +} +button:hover { + transform:scale(1.1); +} + +.pretext { + color:#fff; + background:#0652DD; + position:absolute; + top:0; + left:0; + height:100%; + width:100%; + display:flex; + justify-content:center; + align-items:center; + font-family: 'Quicksand', sans-serif; + text-transform: uppercase; +} +</style> +<button on:click={addToCart}> + <span class="pretext">Add to cart</span> +</button> |