diff options
Diffstat (limited to 'docs/src/components/Examples/CardImage.astro')
| -rw-r--r-- | docs/src/components/Examples/CardImage.astro | 20 |
1 files changed, 20 insertions, 0 deletions
diff --git a/docs/src/components/Examples/CardImage.astro b/docs/src/components/Examples/CardImage.astro new file mode 100644 index 000000000..d785b6ce8 --- /dev/null +++ b/docs/src/components/Examples/CardImage.astro @@ -0,0 +1,20 @@ +--- +import getHeroImg from './Functions/get-hero-img.js' +const getImg = await getHeroImg() || 'https://source.unsplash.com/600x300/?space,cosmos' +--- + + <img src={getImg} class='heroImg' alt="A Image of Space"/> + +<style lang='scss'> +.heroImg{ + display: block; + --hero-radius: 50px 50px 100px 100px / 60px 60px 20px 20px; + border-radius: var(--hero-radius); + width: 100%; + height:15rem; + box-shadow: inset 5px -2px 7px 0px rgb(185 188 231 / 37%), + 0px 8px 0px 0px var(--theme-divider); + border-radius: var(--hero-radius); + object-fit: cover; + } +</style>
\ No newline at end of file |