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

re-arrange content

Browse Source
This commit is contained in:
Michael Czechowski
2024-10-23 00:24:34 +02:00
parent 9c29d4560b
commit a38e765194
3 changed files with 93 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

83
.pugrc
View File

@@ -53,38 +53,6 @@
},
"professional": {
"title": "Professional Approach",
"keyConcepts": [
{
"link": {
"href": "https://12factor.net/",
"title": "The twelve-factor methodology can be applied to apps written in any programming language, and which use any combination of backing services (database, queue, memory cache, etc).",
"ariaLabel": "The twelve-factor methodology can be applied to apps written in any programming language, and which use any combination of backing services (database, queue, memory cache, etc).",
"text": "The 12-Factor App"
},
"text": " Microservices and Software-as-a-Service Methodology"
},
{
"text": "Testing Pyramid"
},
{
"text": "Accessibility (a11y)"
},
{
"text": "Rapid Prototyping and Design Thinking"
},
{
"text": "Scalability and Reliability"
},
{
"text": "Continuous Integration and Continuous Deployment (CI/CD)"
},
{
"text": "DevOps and Site Reliability Engineering (SRE)"
},
{
"text": "Agile and Lean Development"
}
],
"principlesIntro": "Throughout my career, I've been guided by the philosophies and innovations of industry pioneers. These principles form the foundation of my approach to software architecture and digital transformation:",
"principlesPeople": [
{
@@ -1122,7 +1090,26 @@
"label": "Web"
}
]
}
},
{
"links": [
{
"url": "https://12factor.net/",
"title": "The twelve-factor methodology can be applied to apps written in any programming language, and which use any combination of backing services (database, queue, memory cache, etc).",
"ariaLabel": "The twelve-factor methodology can be applied to apps written in any programming language, and which use any combination of backing services (database, queue, memory cache, etc).",
"text": "The 12-Factor App (Microservices and Software-as-a-Service Methodology)"
}
]
},
{"text": "Testing Pyramid"},
{"text": "Accessibility (a11y)"},
{"text": "Rapid Prototyping and Design Thinking"},
{"text": "Scalability and Reliability"},
{
"text": "Continuous Integration and Continuous Deployment (CI/CD)"
},
{"text": "DevOps and Site Reliability Engineering (SRE)"},
{"text": "Agile and Lean Development"}
]
},
"tracking": {
@@ -1169,6 +1156,36 @@
"label": "Hotjar"
}
]
},
{
"link": {
"href": "https://12factor.net/",
"title": "The twelve-factor methodology can be applied to apps written in any programming language, and which use any combination of backing services (database, queue, memory cache, etc).",
"ariaLabel": "The twelve-factor methodology can be applied to apps written in any programming language, and which use any combination of backing services (database, queue, memory cache, etc).",
"text": "The 12-Factor App"
},
"text": " Microservices and Software-as-a-Service Methodology"
},
{
"text": "Testing Pyramid"
},
{
"text": "Accessibility (a11y)"
},
{
"text": "Rapid Prototyping and Design Thinking"
},
{
"text": "Scalability and Reliability"
},
{
"text": "Continuous Integration and Continuous Deployment (CI/CD)"
},
{
"text": "DevOps and Site Reliability Engineering (SRE)"
},
{
"text": "Agile and Lean Development"
}
]
}

45
src/components/Landingpage.pug
View File

@@ -1,29 +1,36 @@
header.bg-nls-black.text-white
.teaser.p-8.flex.flex-col.items-center.justify-center(class="sm:p-20")
.max-w-3xl.group.mb-8.relative(class="w-4/5 min-h-[90vh]")
.max-w-3xl.mb-8.relative(class="w-4/5 min-h-[90vh]")
img.absolute.z-10.left-0.right-0.mx-auto.opacity-0.transition(
class="top-[30vh] max-h-[37vh] group-hover:opacity-100 group-hover:scale-150",
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(class="h-[54vh] group-hover:opacity-60 group-hover:scale-50", src=landingpage.logoSvg)
img.absolute.z-0.left-0.right-0.mx-auto.transition(class="h-[54vh] peer-hover:opacity-60 peer-hover:scale-50", src=landingpage.logoSvg)
.absolute.bottom-0.left-0.right-0.z-40
.bottom-0.text-center.max-w-3xl.center.py-8
h2.text-xl.font-semibold.opacity-80.transition(class="sm:text-2xl group-hover:opacity-100", itemprop="name")= landingpage.name
h1.text-md.opacity-80.transition(class="sm:text-lg group-hover:opacity-100", itemprop="jobTitle")
| #{landingpage.jobTitle[0]}
|
wbr
|
| & #{landingpage.jobTitle[1]}
h2.text-2xl.mt-8(class="sm:text-5xl sm:mt-16", itemprop="email")
.whitespace-nowrap.items-center.transition(class="group-hover:opacity-100")
span(class="group-hover:opacity-100") #{landingpage.email[0]}
span.opacity-20 –
span.opacity-90(class="group-hover:opacity-20") #{landingpage.email[1]}
span.opacity-20 –
span.opacity-90(class="group-hover:opacity-20") #{landingpage.email[2]}
.peer.absolute.bottom-0.left-0.right-0.z-40.text-center.max-w-3xl.center.py-8
h2.tracking-widest.text-xl.font-semibold.opacity-80.transition(class="sm:text-2xl peer-hover:opacity-100", itemprop="name")= landingpage.name
h1.tracking-normal.text-md.mb-16.opacity-80.transition(class="sm:text-lg peer-hover:opacity-100", itemprop="jobTitle")
| #{landingpage.jobTitle[0]}
|
wbr
|
| & #{landingpage.jobTitle[1]}
a.group.text-2xl.mt-8(
class="sm:text-5xl sm:mt-16",
onclick="umami.track('email clicked', { position: 'title', visitDuration: getVisitDuration() })",
onmouseover="umami.track('email hovered', { position: 'title', visitDuration: getVisitDuration() })",
href=footer.emailLink,
rel="noopener noreferrer",
itemprop="email"
)
.whitespace-nowrap.items-center.transition(class="group-hover:opacity-100")
span(class="group-hover:opacity-100") #{landingpage.email[0]}
span.opacity-20 –
span.opacity-90(class="group-hover:opacity-20") #{landingpage.email[1]}
span.opacity-20 –
span.opacity-90(class="group-hover:opacity-20") #{landingpage.email[2]}
.hidden
| Years of age:
span#yearsOfAge

34
src/components/Professional.pug
View File

@@ -6,24 +6,24 @@ section#professional.bg-nls-black.text-white
.p-8(class="sm:p-20 min-h-[120vh]")
+Container
+Title("h2")= professional.title
p.mb-8.max-w-prose.prose.indent-3(class="lg:prose-xl")
p.mb-4.max-w-prose.prose.indent-3(class="lg:prose-xl")
| #{professional.description}
ul.list-disc.list-inside.mb-8
each item, i in professional.keyConcepts
li
if item.link
a.rounded-sm.transition.underline-offset-2.mb-2.cursor-pointer.text-md.font-semibold.mb-2.cursor-pointer.text-white.underline(
href=item.link.href,
class="focus:outline-none focus:z-10 focus:ring-4 focus:ring-white focus:bg-white focus:text-black focus:no-underline",
title=item.link.title,
target="_blank",
rel="noopener noreferrer",
onclick=`umami.track('external link clicked', { position: 'professional', label: '${item.link.label}', visitDuration: getVisitDuration() })`,
aria-label=item.link.ariaLabel
) #{item.link.text}
| #{item.text}
p.mb-8.mt-12.max-w-prose.prose(class="lg:prose-xl")
| #{professional.principlesIntro}
//ul.list-disc.list-inside.mb-8
// each item, i in professional.keyConcepts
// li
// if item.link
// a.rounded-sm.transition.underline-offset-2.mb-2.cursor-pointer.text-md.font-semibold.mb-2.cursor-pointer.text-white.underline(
// href=item.link.href,
// class="focus:outline-none focus:z-10 focus:ring-4 focus:ring-white focus:bg-white focus:text-black focus:no-underline",
// title=item.link.title,
// target="_blank",
// rel="noopener noreferrer",
// onclick=`umami.track('external link clicked', { position: 'professional', label: '${item.link.label}', visitDuration: getVisitDuration() })`,
// aria-label=item.link.ariaLabel
// ) #{item.link.text}
// | #{item.text}
p.mb-8.max-w-prose.prose(class="lg:prose-xl")
| #{professional.principlesIntro}
.list-disc.list-inside.mb-8
each person, i in professional.principlesPeople
- const data = {summary: `${person.name} — ${person.concept}`, color: "white", category: "professional"};