libretech/M6C9.de
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Activity

fix format

Browse Source
This commit is contained in:
Michael Czechowski
2025-06-14 13:46:47 +02:00
parent 917bf40e6d
commit 61df9dc052
4 changed files with 35 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/Academia.pug
View File

@@ -38,4 +38,4 @@ section#academia
.grid.grid-cols-1.gap-6.mb-8(class="md:grid-cols-1")
each institution in academia.institutions
+Collapsable("academia", institution)
// endregion
// endregion

32
src/components/Carousel.pug
View File

@@ -26,14 +26,23 @@ mixin Carousel(items, options)
path(stroke-linecap="round", stroke-linejoin="round", stroke-width="2", d="M9 5l7 7-7 7")
//- Carousel track
.carousel-track.flex.overflow-x-auto.rounded-lg.scroll-smooth.scrollbar-hide(style="scroll-snap-type: x mandatory", role="region", aria-label="Image carousel")
.carousel-track.flex.overflow-x-auto.rounded-lg.scroll-smooth.scrollbar-hide(
style="scroll-snap-type: x mandatory",
role="region",
aria-label="Image carousel"
)
each item, index in items
- const href = item?.href || "#";
.carousel-slide.flex-none.w-full.relative(class=slideClasses, style="scroll-snap-align: start")
if item.type === "image"
.flex.flex-col.aspect-video.relative.overflow-hidden.rounded-lg.mx-2.mb-4(class="sm:flex-row sm:gap-6")
img.w-full.h-full.object-cover.transition-transform.rounded-lg.duration-300(class="hover:scale-105 sm:w-1/2", src=item.src, alt=item.alt, loading=index < 3 ? "eager" : "lazy")
img.w-full.h-full.object-cover.transition-transform.rounded-lg.duration-300(
class="hover:scale-105 sm:w-1/2",
src=item.src,
alt=item.alt,
loading=index < 3 ? "eager" : "lazy"
)
if item.caption
.absolute.bottom-0.left-0.right-0.bg-gradient-to-t.p-4(class="sm:static sm:bg-gradient-unset from-black/70 sm:text-nls-white dark:sm:text-nls-black")
p.text-white.text-xl.font-large= item.caption
@@ -43,12 +52,15 @@ mixin Carousel(items, options)
if autoScroll
script.
document.addEventListener("DOMContentLoaded", () => {
setInterval(() => {
const track = document.querySelector(`##{id} .carousel-track`);
if (track.scrollLeft + track.clientWidth >= track.scrollWidth) {
track.scrollTo({left: 0, behavior: "smooth"});
} else {
carouselNext("#{id}");
}
}, #{autoScroll});
setInterval(
() => {
const track = document.querySelector(`##{id} .carousel-track`);
if (track.scrollLeft + track.clientWidth >= track.scrollWidth) {
track.scrollTo({left: 0, behavior: "smooth"});
} else {
carouselNext("#{id}");
}
},
#{autoScroll},
);
});

14
src/components/Footer.pug
View File

@@ -5,7 +5,15 @@ mixin Link(href, label, target, rel)
- const eventCategory = "footer";
- const onclick = `umami.track('${eventName}', { category: 'icons', position: 'footer', label: '${label}', visitDuration: getVisitDuration() })`;
a.transition-colors.text-nls-black.rounded.ring-offset-2(href=href, class="dark:text-white hover:ring-2 ring-nls-black dark:ring-nls-white", target=target, rel=rel, onclick=onclick, aria-label=label, title=label)
a.transition-colors.text-nls-black.rounded.ring-offset-2.ring-nls-black(
href=href,
class="dark:text-white hover:ring-2 dark:ring-nls-white",
target=target,
rel=rel,
onclick=onclick,
aria-label=label,
title=label
)
block
mixin Svg
@@ -44,9 +52,9 @@ footer#footer
style="fill: currentColor"
)
a.transition-colors.text-nls-black.uppercase.font-semibold.rounded.ring-offset-2(
a.transition-colors.text-nls-black.uppercase.font-semibold.rounded.ring-offset-2.ring-nls-black(
href=footer.emailLink,
class="dark:text-white hover:ring-2 ring-nls-black dark:ring-nls-white",
class="dark:text-white hover:ring-2 dark:ring-nls-white",
rel="noopener noreferrer",
title=footer.emailText,
aria-label=footer.emailText,

8
src/components/Portfolio.pug
View File

@@ -9,10 +9,4 @@ section#portfolio
p.text-center.pb-12
| Free and Open Source Software, Customer Projects and other useful Applications
.max-w-screen.mx-auto(class="sm:max-w-80vw")
+Carousel([...portfolio, ...portfolio, ...portfolio], {
id: "portfolio-carousel",
color: "black",
category: "portfolio",
slideClasses: "w-full",
autoScroll: false
})
+Carousel([...portfolio, ...portfolio, ...portfolio], {id: "portfolio-carousel", color: "black", category: "portfolio", slideClasses: "w-full", autoScroll: false})