Mergin dev - new header, updated servants #29

Merged
Firq merged 7 commits from dev into main 2024-06-15 17:20:52 +00:00
2 changed files with 27 additions and 22 deletions
Showing only changes of commit 449006320c - Show all commits

View file

@ -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<GlobImage>('/src/assets/favourites/*.{png,webp}')
const images = import.meta.glob<GlobImage>(
'/src/assets/favourites/*.{png,webp}'
)
const loadedImage = plsLoadImage(images, imagePath)
---
<a href={link} target="_blank" rel="noopener noreferrer" aria-label=`${name} - new window`>
<a
href={link}
target="_blank"
rel="noopener noreferrer"
aria-label=`${name} - new window`
>
<div class="heading">{name}</div>
<Image src={loadedImage} alt={name} />
<h2 class="subtext">
@ -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;
}
}
}

View file

@ -17,7 +17,7 @@ const description = "Error. This shouldn't happen :/"
<Image src={sadshishou} alt="Sad Shishou" />
<h2>Well ... you were not supposed to end up here.</h2>
<a href="/" aria-label="Home" rel="noopener noreferrer">
<i class="iconoir-fast-arrow-left"></i>Go back home
&lt;&lt; Go back home
</a>
</div>
</BaseSection>
@ -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 {