denizk0461/pages
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added new blog post

Browse Source
This commit is contained in:
denizk0461
2026-01-31 20:24:26 +01:00
parent 01e455d3bf
commit 21059a4d2e
7 changed files with 39 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/lib/lists/gallery.svelte
View File

@@ -25,7 +25,11 @@
{#snippet galleryEntry({entry, reverseTextOrder}: {entry: GalleryEntry, reverseTextOrder?: boolean})}
<!-- {#snippet galleryEntry({key, post, index}: {key: string, post: DevlogPost, index: number})} -->
<a class="gallery-container" href="{entry.link}">
<img class="gallery-img" src="{entry.img}" alt="{entry.imgAlt}">
{#if entry.img && entry.img !== ""}
<img class="gallery-img" src="{entry.img}" alt="{entry.imgAlt}">
{:else}
<div class="gallery-img-placeholder"></div>
{/if}
<div class="gallery-text-container">
{#if reverseTextOrder}
<p class="gallery-subtitle">{@html entry.subtitle}</p>
@@ -60,7 +64,7 @@
margin: 6px 0;
}
.gallery-img {
.gallery-img, .gallery-img-placeholder {
width: 145px;
min-width: 145px;
height: 100%;
@@ -70,6 +74,10 @@
transition: filter 0.1s ease-out;
}
.gallery-img-placeholder {
background-color: var(--color-highlight-dark);
}
.gallery-text-container {
display: flex;
flex-direction: column;
@@ -101,7 +109,7 @@
.gallery-container:hover .gallery-text-container {
border-color: var(--color-highlight);
}
.gallery-container:hover .gallery-img {
.gallery-container:hover .gallery-img, .gallery-container:hover .gallery-img-placeholder {
filter: grayscale(0%);
}
.gallery-container:hover p {