Firq/firq-dev-website
Firq/firq-dev-website
1
0
Fork 0
Code Issues Pull requests Projects Releases 69 Packages Wiki Activity Actions

Link favourites fix

Browse source
This commit is contained in:
Firq 2023-03-11 00:18:33 +01:00
parent fab7041ca7
commit 4615bd5458
Signed by: Firq
GPG key ID: 3ACC61C8CEC83C20
1 changed files with 11 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
src/components/favouriteCard.astro
View file

@ -12,19 +12,14 @@ const img: string = `/favourites/${image}.webp`
--- ---
<a href={link} target="_blank" rel="noopener noreferrer"> <a href={link} target="_blank" rel="noopener noreferrer">
<article> <div class="heading">{name}</div>
<div class="heading">{name}</div> <img src={img} alt={name} />
<img src={img} alt={name} /> <h2 class="subtext">
<h2 class="subtext"> {origin}
{origin} </h2>
</h2>
</article>
</a> </a>
<style> <style>
a {
text-decoration: none;
}
.heading { .heading {
display: flex; display: flex;
height: 4rem; height: 4rem;
@ -46,11 +41,11 @@ const img: string = `/favourites/${image}.webp`
align-content: center; align-content: center;
} }
article:hover { a:hover {
transform: scale(var(--hover-scale)); transform: scale(var(--hover-scale));
} }
article { a {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
flex-direction: column; flex-direction: column;
@ -63,22 +58,23 @@ const img: string = `/favourites/${image}.webp`
align-items: center; align-items: center;
text-align: center; text-align: center;
transition: transform var(--speed) var(--ease); transition: transform var(--speed) var(--ease);
text-decoration: none;
} }
article > img { a > img {
padding: 0.25em; padding: 0.25em;
width: 120px; width: 120px;
height: auto; height: auto;
} }
@media (min-width: 512px) { @media (min-width: 512px) {
article { a {
padding: 10px 10px; padding: 10px 10px;
width: auto; width: auto;
height: auto; height: auto;
} }
article > img { a > img {
padding: 1.5em; padding: 1.5em;
width: 200px; width: 200px;
height: auto; height: auto;