tabbed talks view

This commit is contained in:
2026-04-30 13:38:32 +02:00
parent da5d905547
commit 8cc142e5a1
+62 -15
View File
@@ -39,6 +39,9 @@
margin: 0;
background-color: #fafaf7;
}
.description {
color: #444;
}
.main {
max-width: 800px;
padding: 2em;
@@ -71,9 +74,49 @@
.main em {
color: #444;
}
.main .rule {
border-top: 1px solid #aaa;
width: calc(100%-6em);
margin-left: 3em;
margin-right: 3em;
height: 0px;
}
article {
margin-bottom: 2em;
margin-left: 1em;
}
.tab-input {
position: absolute;
opacity: 0;
pointer-events: none;
}
nav.tabs {
display: flex;
gap: 2em;
border-bottom: 1px solid #aaa;
margin: 1.5em 0 1.5em;
}
nav.tabs label {
padding: 0.6em 0;
margin-bottom: -1px;
font-size: 16px;
color: #444;
border-bottom: 2px solid transparent;
cursor: pointer;
}
nav.tabs label:hover {
color: #000;
}
.panel { display: none; }
#tab-bookable:checked ~ #bookable,
#tab-talks:checked ~ #talks,
#tab-publications:checked ~ #publications {
display: block;
}
#tab-bookable:checked ~ nav.tabs label[for="tab-bookable"],
#tab-talks:checked ~ nav.tabs label[for="tab-talks"],
#tab-publications:checked ~ nav.tabs label[for="tab-publications"] {
color: #000;
border-bottom-color: #000;
}
@media(max-width: 700px) {
.main h1 {
@@ -85,12 +128,20 @@
<body>
<main class="main">
<h1>Workshops, Talks, Publications</h1>
<p class="description">I speak and write about systems of all shapes and
sizes.</p>
<h2>Bookable Talks & Workshops</h2>
<input type="radio" name="tab" id="tab-bookable" class="tab-input" checked>
<input type="radio" name="tab" id="tab-talks" class="tab-input">
<input type="radio" name="tab" id="tab-publications" class="tab-input">
<p>Talks &amp; Workshops you can book.</p>
<nav class="tabs">
<label for="tab-bookable">Bookable</label>
<label for="tab-talks">Talks</label>
<label for="tab-publications">Publications</label>
</nav>
<hr/>
<section id="bookable" class="panel">
<h3>Practical threat modelling for engineering teams</h3>
<p>Lightweight, repeatable threat modelling you can actually run in sprint cadence. We cut jargon, pick a fit-for-purpose method, and get to work quickly. <a href="https://blog.veitheller.de/Threat_Modeling_For_the_Rest_of_Us.html">Read about it here.</a></p>
@@ -100,7 +151,7 @@
</ul>
<p><a href="mailto:veit@veitheller.de?subject=threat modelling workshop inquiry">Book this workshop</a></p>
<hr/>
<div class="rule"></div>
<h3>ISMS & SSDLC that you can work with</h3>
<p>Lets turn “we should do security” into a minimal ISMS and an SSDLC that actually holds up in practice. We map controls to your workflows (code, CI/CD, infra) and prove it with artifacts. <a href="https://blog.veitheller.de/Simple_SSDLCs.html">Read about it here.</a></p>
@@ -110,7 +161,7 @@
</ul>
<p><a href="mailto:veit@veitheller.de?subject=isms and ssdlc workshop inquiry">Book this workshop</a></p>
<hr/>
<div class="rule"></div>
<h3>Funding & buyer readiness</h3>
<p>What VCs, acquirers, and enterprise buyers actually check, and how to be ready to answer. Architecture narrative, risk posture, and processes that actually give you something in return. <a href="https://blog.veitheller.de/What_good_looks_like_in_a_data_room.html">Read about it here.</a></p>
@@ -120,18 +171,15 @@
</ul>
<p><a href="mailto:veit@veitheller.de?subject=funding and buyer readiness workshop inquiry">Book this workshop</a></p>
<hr/>
<div class="rule"></div>
<p>Custom workshops are available; tell me your teams goals and Ill tell you if I can help you.</p>
<h2>Selected Talks & Publications</h2>
</section>
<p>I speak and write about systems of all shapes and sizes. Here are some of the works Im happy with.</p>
<section>
<h2 id="talks">Talks</h2>
<section id="talks" class="panel">
<article>
<h3><b>Upcoming:</b> Type Systems You Might Not Know (But Will Love)</h3>
<h3><i>Upcoming:</i> Type Systems You Might Not Know (But Will Love)</h3>
<p><em>WeAreDevelopers World Congress Europe, 2026</em><br>
<p>A tour through beautiful but lesser-known type systems.</p>
</article>
@@ -221,8 +269,7 @@
</article>
</section>
<section>
<h2>Publications</h2>
<section id="publications" class="panel">
<article>
<h3>Efficient Module-Level Dynamic Analysis for Dynamic Languages with Module Recontextualization</h3>