diff --git a/src/components/favouriteCard.astro b/src/components/favouriteCard.astro index 1e67512..83b2a87 100644 --- a/src/components/favouriteCard.astro +++ b/src/components/favouriteCard.astro @@ -1,5 +1,5 @@ --- -import { Image } from 'astro:assets'; +import { Image } from 'astro:assets' import type { GlobImage } from '../types/generic' import { plsLoadImage } from '../utils/tools' @@ -12,11 +12,18 @@ export interface Props { const { link, imageFile, origin, name } = Astro.props const imagePath = `/src/assets/favourites/${imageFile}` -const images = import.meta.glob('/src/assets/favourites/*.{png,webp}') +const images = import.meta.glob( + '/src/assets/favourites/*.{png,webp}' +) const loadedImage = plsLoadImage(images, imagePath) --- - +
{name}
{name}

@@ -38,10 +45,6 @@ const loadedImage = plsLoadImage(images, imagePath) align-items: center; } - a:hover { - transform: scale(var(--hover-scale)); - } - a { border-radius: 1rem; display: flex; @@ -57,12 +60,16 @@ const loadedImage = plsLoadImage(images, imagePath) text-align: center; transition: transform var(--speed) var(--ease); text-decoration: none; - } - a > img { - padding: 0px 0.25em; - width: 90%; - height: auto; + &:hover { + transform: scale(var(--hover-scale)); + } + + img { + padding: 0px 0.25em; + width: 90%; + height: auto; + } } @media (min-width: 512px) { @@ -70,12 +77,10 @@ const loadedImage = plsLoadImage(images, imagePath) padding: 10px 10px; width: auto; height: auto; - } - - a > img { - padding: 0px 1.5em; - width: 200px; - height: auto; + img { + padding: 0px 1.5em; + width: 200px; + } } } diff --git a/src/pages/404.astro b/src/pages/404.astro index cad8fa0..2793078 100644 --- a/src/pages/404.astro +++ b/src/pages/404.astro @@ -17,7 +17,7 @@ const description = "Error. This shouldn't happen :/" Sad Shishou

Well ... you were not supposed to end up here.

- Go back home + << Go back home @@ -50,10 +50,10 @@ const description = "Error. This shouldn't happen :/" text-decoration: none; font-size: 1.5rem; font-weight: bold; - } - a:hover { - color: var(--c-darkpurple); + &:hover { + color: var(--c-darkpurple); + } } img {