diff options
| author |  aFuzzyBear <drgaud@hotmail.com>
| 2021-08-10 01:24:25 +0100 |
|---|---|---|
| committer |  Fred K. Schott <fkschott@gmail.com>
| 2021-09-06 01:21:39 -0700 |
| commit | d321d8366b597e46ff8e3fc63d17622a9297505c (patch) | |
| tree | 339775403be469fdc9c53c4f9484c8ba7c23811a /docs/src/components/Examples/CardImage.astro | |
| parent | e686c3c50469d18db93da7ce79ddcac8659c3166 (diff) | |
| download | astro-d321d8366b597e46ff8e3fc63d17622a9297505c.tar.gz astro-d321d8366b597e46ff8e3fc63d17622a9297505c.tar.zst astro-d321d8366b597e46ff8e3fc63d17622a9297505c.zip | |
Adds examples page
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 |