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

upgrade parcel

Browse Source
This commit is contained in:
Michael Czechowski
2025-06-12 15:40:41 +02:00
parent cb191a42fd
commit 1111e56b2c
12 changed files with 2707 additions and 9921 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@@ -3,6 +3,7 @@ node_modules
# Distributed built files # Distributed built files
dist dist
# Temporary files # Temporary files
.parcel-cache
.cache .cache
.idea .idea
# Secrets # Secrets

2
.nvmrc
View File

@@ -1 +1 @@
v22.9.0 v22.16.0

3
.pugrc
View File

@@ -138,7 +138,8 @@
}, },
"courses": { "courses": {
"dhbw": [ "dhbw": [
"2025 (upcoming) „Einführung in die Webentwicklung II“ (Introduction to Web Development)", "2025 „Einführung in die Webentwicklung“ (Introduction to Web Development)",
"2025 „Einführung in die Webentwicklung II“ (Introduction to Web Development)",
"2024 „Einführung in die Webentwicklung II“ (Introduction to Web Development)" "2024 „Einführung in die Webentwicklung II“ (Introduction to Web Development)"
], ],
"lfh": [ "lfh": [

21
index.pug
View File

@@ -13,8 +13,8 @@ html.scroll-smooth(lang=lang)
script. script.
const footerEl = document.querySelector("#footer"); const footerEl = document.querySelector("#footer");
const footerObserver = new IntersectionObserver((payload) => { const footerObserver = new IntersectionObserver((payload) => {
const hasScrolltedTo = payload.pop().isIntersecting; const hasScrolledTo = payload.pop().isIntersecting;
if (hasScrolltedTo && window.hasOwnProperty("umami")) { if (hasScrolledTo && window.hasOwnProperty("umami")) {
umami.track("scrolled to", {position: "footer", id: "footer", visitDuration: getVisitDuration()}); umami.track("scrolled to", {position: "footer", id: "footer", visitDuration: getVisitDuration()});
console.debug("scrolled to footer", {visitDuration: getVisitDuration()}); console.debug("scrolled to footer", {visitDuration: getVisitDuration()});
} }
@@ -24,23 +24,10 @@ html.scroll-smooth(lang=lang)
const sections = document.querySelectorAll("section"); const sections = document.querySelectorAll("section");
const sectionObserver = (id) => const sectionObserver = (id) =>
new IntersectionObserver((payload) => { new IntersectionObserver((payload) => {
const hasScrolltedTo = payload.pop().isIntersecting; const hasScrolledTo = payload.pop().isIntersecting;
if (hasScrolltedTo && window.hasOwnProperty("umami")) { if (hasScrolledTo && window.hasOwnProperty("umami")) {
umami.track("scrolled to", {position: "section", id, visitDuration: getVisitDuration()}); umami.track("scrolled to", {position: "section", id, visitDuration: getVisitDuration()});
console.debug("scrolled to section with id", {id, visitDuation: getVisitDuration()}); console.debug("scrolled to section with id", {id, visitDuation: getVisitDuration()});
} }
}); });
sections.forEach((section) => sectionObserver(section.id).observe(section)); sections.forEach((section) => sectionObserver(section.id).observe(section));
// tailwindcss set correct dark/light theme depending on client preference
// https://tailwindcss.com/docs/dark-mode#toggling-dark-mode
// let yearsOfAge = 0;
// let yearsOfDeveloping = 0;
//
// setInterval(() => {
// yearsOfAge = (new Date().getTime() - new Date("1988-10-07").getTime()) / 1000 / 60 / 60 / 24 / 365.25;
// yearsOfDeveloping = (new Date().getTime() - new Date("2005-07-07").getTime()) / 1000 / 60 / 60 / 24 / 365.25;
// document.getElementById("yearsOfAge").innerText = yearsOfAge.toFixed(6);
// document.getElementById("yearsOfDeveloping").innerText = yearsOfDeveloping.toFixed(6);
// }, 500);

12448
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

7
package.json
View File

@@ -2,7 +2,6 @@
"name": "nls-parcel-dailyshit", "name": "nls-parcel-dailyshit",
"version": "1.0.0-0", "version": "1.0.0-0",
"description": "", "description": "",
"main": "index.pug",
"scripts": { "scripts": {
"test": "echo \"Error: no test specified\" && exit 1", "test": "echo \"Error: no test specified\" && exit 1",
"start": "parcel --public-url / index.pug --open", "start": "parcel --public-url / index.pug --open",
@@ -13,8 +12,12 @@
"author": "Michael Werner Czechowski <mail@dailysh.it>", "author": "Michael Werner Czechowski <mail@dailysh.it>",
"license": "Apache-2.0", "license": "Apache-2.0",
"devDependencies": { "devDependencies": {
"@parcel/packager-raw-url": "^2.15.2",
"@parcel/transformer-jsonld": "^2.15.2",
"@parcel/transformer-pug": "^2.15.2",
"@parcel/transformer-webmanifest": "^2.15.2",
"@prettier/plugin-pug": "^3.1.0", "@prettier/plugin-pug": "^3.1.0",
"parcel-bundler": "^1.10.3", "parcel": "^2.15.2",
"prettier": "^3.3.3", "prettier": "^3.3.3",
"pug": "^3.0.3", "pug": "^3.0.3",
"sass": "^1.16.0", "sass": "^1.16.0",

14
src/components/Academia.pug
View File

@@ -15,13 +15,13 @@ section#academia
// region Expertise // region Expertise
.grid.grid-cols-1.gap-6.mb-8(class="md:grid-cols-1") .grid.grid-cols-1.gap-6.mb-8(class="md:grid-cols-1")
+Collapsable(academia.expertise.frontendTechnologies, true) +Collapsable("academia", academia.expertise.frontendTechnologies, true)
+Collapsable(academia.expertise.devopsAndCloud) +Collapsable("academia", academia.expertise.devopsAndCloud)
+Collapsable(academia.expertise.backendTechnologies) +Collapsable("academia", academia.expertise.backendTechnologies)
+Collapsable(academia.expertise.databaseAndData) +Collapsable("academia", academia.expertise.databaseAndData)
+Collapsable(academia.expertise.crossPlatform) +Collapsable("academia", academia.expertise.crossPlatform)
+Collapsable(academia.expertise.bestPractices) +Collapsable("academia", academia.expertise.bestPractices)
+Collapsable(academia.expertise.tracking) +Collapsable("academia", academia.expertise.tracking)
// endregion // endregion
+Container +Container

7
src/components/Collapsable.pug
View File

@@ -1,11 +1,10 @@
mixin Collapsable(data, open) mixin Collapsable(name, data, open)
- const isExpanded = open || false; - const isExpanded = open || false;
- const color = data.color || "orange"; - const color = data.color || "orange";
- const category = data.category || "default"; - const category = data.category || "default";
- const linkEventName = "external link clicked"; - const linkEventName = "external link clicked";
div details.mb-4(open=isExpanded, name=name)
details.mb-4(open=isExpanded)
summary( summary(
class=`rounded-sm transition mb-2 cursor-pointer text-md font-semibold mb-2 cursor-pointer sm:text-lg text-nls-${color} dark:text-nls-${color} focus:outline-none focus:z-10 focus:ring-4 focus:ring-nls-${color} focus:bg-nls-${color} focus:text-black focus:no-underline`, class=`rounded-sm transition mb-2 cursor-pointer text-md font-semibold mb-2 cursor-pointer sm:text-lg text-nls-${color} dark:text-nls-${color} focus:outline-none focus:z-10 focus:ring-4 focus:ring-nls-${color} focus:bg-nls-${color} focus:text-black focus:no-underline`,
onclick=`umami.track('collapsable clicked', { category: '${category}', visitDuration: getVisitDuration() })` onclick=`umami.track('collapsable clicked', { category: '${category}', visitDuration: getVisitDuration() })`
@@ -19,7 +18,7 @@ mixin Collapsable(data, open)
if item.links if item.links
each link, index in item.links each link, index in item.links
a( a(
class=`transition underline-offset-2 underline text-nls-${color} hover:text-nls-black dark:hover:text-white hover:decoration-2`, class=`transition underline-offset-2 underline text-nls-${color} hover:text-nls-black dark:hover:text-white hover:decoration-2 focus:text-nls-black dark:focus:text-white focus:decoration-2`,
href=link.url, href=link.url,
title=link.description, title=link.description,
target="_blank", target="_blank",

6
src/components/Footer.pug
View File

@@ -19,7 +19,7 @@ footer#footer
h2.text-5xl.mb-4 #{footer.title} h2.text-5xl.mb-4 #{footer.title}
p.mb-8.max-w-prose #{footer.content} p.mb-8.max-w-prose #{footer.content}
.flex.flex-col.items-center.space-y-12.mb-8(class="sm:flex-row sm:space-x-6 sm:space-y-0") .flex.flex-col.items-center.space-y-12.mb-8(class="sm:flex-row sm:space-x-6 sm:space-y-0")
+Link(footer.githubUrl, 'github', '_blank', 'noopener noreferrer') +Link(footer.githubUrl, "github", "_blank", "noopener noreferrer")
+Svg +Svg
path( path(
clip-rule="evenodd", clip-rule="evenodd",
@@ -28,7 +28,7 @@ footer#footer
style="fill: currentColor" style="fill: currentColor"
) )
+Link(footer.linkedinUrl, 'linkedin', '_blank', 'noopener noreferrer') +Link(footer.linkedinUrl, "linkedin", "_blank", "noopener noreferrer")
+Svg +Svg
path( path(
clip-rule="evenodd", clip-rule="evenodd",
@@ -37,7 +37,7 @@ footer#footer
style="fill: currentColor" style="fill: currentColor"
) )
+Link(footer.xingUrl, 'xing', '_blank', 'noopener noreferrer') +Link(footer.xingUrl, "xing", "_blank", "noopener noreferrer")
+Svg +Svg
path( path(
d="M18.188 0c-.517 0-.741.325-.927.66 0 0-7.455 13.224-7.702 13.657.015.024 4.919 9.023 4.919 9.023.17.308.436.66.967.66h3.454c.211 0 .375-.078.463-.22.089-.151.089-.346-.009-.536l-4.879-8.916c-.004-.006-.004-.016 0-.022L22.139.756c.095-.191.097-.387.006-.535C22.056.078 21.894 0 21.686 0h-3.498zM3.648 4.74c-.211 0-.385.074-.473.216-.09.149-.078.339.02.531l2.34 4.05c.004.01.004.016 0 .021L1.86 16.051c-.099.188-.093.381 0 .529.085.142.239.234.45.234h3.461c.518 0 .766-.348.945-.667l3.734-6.609-2.378-4.155c-.172-.315-.434-.659-.962-.659H3.648v.016z", d="M18.188 0c-.517 0-.741.325-.927.66 0 0-7.455 13.224-7.702 13.657.015.024 4.919 9.023 4.919 9.023.17.308.436.66.967.66h3.454c.211 0 .375-.078.463-.22.089-.151.089-.346-.009-.536l-4.879-8.916c-.004-.006-.004-.016 0-.022L22.139.756c.095-.191.097-.387.006-.535C22.056.078 21.894 0 21.686 0h-3.498zM3.648 4.74c-.211 0-.385.074-.473.216-.09.149-.078.339.02.531l2.34 4.05c.004.01.004.016 0 .021L1.86 16.051c-.099.188-.093.381 0 .529.085.142.239.234.45.234h3.461c.518 0 .766-.348.945-.667l3.734-6.609-2.378-4.155c-.172-.315-.434-.659-.962-.659H3.648v.016z",

4
src/components/Head.pug
View File

@@ -88,6 +88,10 @@ head
// region Custom CSS // region Custom CSS
style. style.
p a {
@apply underline;
}
/* Afacad Flux */ /* Afacad Flux */
@font-face { @font-face {
font-family: "Afacad Flux"; font-family: "Afacad Flux";

15
src/components/Landingpage.pug
View File

@@ -1,14 +1,4 @@
header.bg-white.text-nls-black(class="dark:text-white dark:bg-nls-black") header.bg-white.text-nls-black(class="dark:text-white dark:bg-nls-black")
//button.absolute.top-0.right-0.w-8.h-8.m-3.p-3.rounded-full.bg-slate-300(
// onclick="toggleDarkMode()"
//)
// div(class="block dark:hidden")
// span.sr-only Toggle dark mode
// | 🌙
// div(class="hidden dark:block")
// span.sr-only Toggle light mode
// | ☀️
.teaser.p-8.flex.flex-col.items-center.justify-center(class="sm:p-20") .teaser.p-8.flex.flex-col.items-center.justify-center(class="sm:p-20")
.max-w-3xl.mb-8.relative(class="w-4/5 min-h-[90vh]") .max-w-3xl.mb-8.relative(class="w-4/5 min-h-[90vh]")
.peer.absolute.bottom-0.left-0.right-0.z-40.text-center.max-w-3xl.center.py-8 .peer.absolute.bottom-0.left-0.right-0.z-40.text-center.max-w-3xl.center.py-8
@@ -21,11 +11,6 @@ header.bg-white.text-nls-black(class="dark:text-white dark:bg-nls-black")
| |
| &amp; #{landingpage.jobTitle[1]} | &amp; #{landingpage.jobTitle[1]}
//img.absolute.z-10.left-0.right-0.mx-auto.opacity-0.transition(
// class="top-[30vh] max-h-[37vh] peer-hover:opacity-100 peer-hover:scale-150",
// src=landingpage.emojiSvg
//)
img.absolute.z-0.left-0.right-0.mx-auto.transition.invisible(class="dark:visible h-[54vh]", src=landingpage.logoSvg) img.absolute.z-0.left-0.right-0.mx-auto.transition.invisible(class="dark:visible h-[54vh]", src=landingpage.logoSvg)
img.absolute.z-0.left-0.right-0.mx-auto.transition.visible(class="dark:invisible h-[54vh]", src=landingpage.logoSvgInverted) img.absolute.z-0.left-0.right-0.mx-auto.transition.visible(class="dark:invisible h-[54vh]", src=landingpage.logoSvgInverted)

2
src/components/Professional.pug
View File

@@ -10,7 +10,7 @@ section#professional.bg-white.text-nls-black(class="dark:bg-nls-black dark:text-
each person, i in professional.principlesPeople each person, i in professional.principlesPeople
- const data = {summary: `${person.name} — ${person.concept}`, color: "text-nls-black dark:text-white", category: "professional"}; - const data = {summary: `${person.name} — ${person.concept}`, color: "text-nls-black dark:text-white", category: "professional"};
- const isOpen = i === 0; - const isOpen = i === 0;
+Collapsable(data, isOpen) +Collapsable("professional", data, isOpen)
each paragraph, j in person.paragraphs each paragraph, j in person.paragraphs
- const additionalClasses = j !== 0 ? "indent-3" : "mt-4"; - const additionalClasses = j !== 0 ? "indent-3" : "mt-4";
p.pl-4(class=`sm:w-5/6 ${additionalClasses}`)= paragraph p.pl-4(class=`sm:w-5/6 ${additionalClasses}`)= paragraph