diff --git a/src/components/CatCard.astro b/src/components/CatCard.astro index abecb87..6b56fa6 100644 --- a/src/components/CatCard.astro +++ b/src/components/CatCard.astro @@ -10,7 +10,7 @@ const { cat } = Astro.props;
-
+
{cat.data.image.alt} + {cat.data.passedAway && Rest In Peace}

{cat.data.name}

{cat.data.owner.name}

@@ -60,6 +61,8 @@ const { cat } = Astro.props; } .img-wrapper { + position: relative; + overflow: hidden; width: 100%; padding: 2rem; padding-bottom: 0.6rem; @@ -70,4 +73,20 @@ const { cat } = Astro.props; width: 100%; object-fit: cover; } + + .passed-away > img { + filter: grayscale(100%); + } + + .card span.rip { + display: block; + position: absolute; + bottom: 0; + left: 0; + width: calc(100% - 4rem); + margin: 0 2rem; + padding: 0.2rem; + background-color: #000; + text-align: center; + } diff --git a/src/pages/submit.astro b/src/pages/submit.astro index 734ab19..7db0817 100644 --- a/src/pages/submit.astro +++ b/src/pages/submit.astro @@ -58,6 +58,10 @@ import BaseLayout from '../layouts/BaseLayout.astro'; Some ideas: nicknames, age, breed(s), where you adopted this cat
+
+ + +