diff options
| author | ivarlovlie <git@ivarlovlie.no> | 2023-02-18 15:25:29 +0100 |
|---|---|---|
| committer | ivarlovlie <git@ivarlovlie.no> | 2023-02-18 15:25:29 +0100 |
| commit | 69d345b334c7a3fecdb0cd5f440fabd83a755309 (patch) | |
| tree | 09de5c21f7989a98397e6e700f8d4e9347e8bd90 /src/components/card-v4.svelte | |
| parent | c709aa638c7d3458dd73c3aabadb4924cb1cb80e (diff) | |
| download | auroraklinikken.no-69d345b334c7a3fecdb0cd5f440fabd83a755309.tar.xz auroraklinikken.no-69d345b334c7a3fecdb0cd5f440fabd83a755309.zip | |
.
Diffstat (limited to 'src/components/card-v4.svelte')
| -rw-r--r-- | src/components/card-v4.svelte | 25 |
1 files changed, 25 insertions, 0 deletions
diff --git a/src/components/card-v4.svelte b/src/components/card-v4.svelte new file mode 100644 index 0000000..d067357 --- /dev/null +++ b/src/components/card-v4.svelte @@ -0,0 +1,25 @@ +<script lang="ts"> + export let title; + export let description; +</script> + +<div class="card"> + <div class="p-6"> + <h3 class="mt-0">I have a dream</h3> + <p class="text-contrast-medium mt-3 mx-0 mb-4"> + Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quia minus culpa commodi. + </p> + <div class="flex flex-wrap gap-3"> + <a href="#0" class="btn btn--subtle">Learn more</a> + <a href="#0" class="btn btn--primary">Buy</a> + </div> + </div> +</div> + +<style lang="postcss"> + .card { + @apply flex flex-col bg-floor rounded-xl overflow-hidden; + box-shadow: 0 0 0 1px hsla(230, 13%, 9%, 0.05), 0 0.3px 0.4px hsla(230, 13%, 9%, 0.02), + 0 0.9px 1.5px hsla(230, 13%, 9%, 0.045), 0 3.5px 6px hsla(230, 13%, 9%, 0.09); + } +</style> |