<main role="main">
<header class="image-header image-header--no-padding bg-image-podcast-01">
<div class="image-header__body">
<div class="image-header__content">
<h1 class="image-header__title bg-image-podcast-01">Unsere Podcasts</h1>
<span class="icon icon-arrow-long-down icon--brand-secondary"></span>
</div>
</div>
</header>
<div class="podcast-overview-grid">
<a href="#" class="podcast-overview-teaser static-tile-teaser static-tile-teaser-bg-color">
<div class="static-tile-teaser__content">
<div class="static-tile-teaser__body">
<h2 class="static-tile-teaser__headline">Der INNOQ Podcast</h2>
<p class="static-tile-teaser__text">
In dieser Serie diskutieren wir interessante Themen aus Software-Entwicklung und -Architektur – immer mit dem Fokus auf Praxistauglichkeit.
</p>
</div>
<div class="static-tile-teaser__goto">
<span class="link-teaser">Alle Episoden</span>
</div>
</div>
</a>
<div class="podcast-overview-samples">
<a href="#" class="podcast-teaser podcast-teaser--default flex-grow">
<div class="podcast-teaser__body">
<div class="podcast-teaser__caption">Podcast</div>
<h2 class="podcast-teaser__headline">PIM-Systeme</h2>
<h3 class="podcast-teaser__subheadline">
Oder: die Datenkomplexität eines T-Shirts
</h3>
<span class="icon icon-arrow-long-right icon--brand-white"></span>
</div>
<div class="podcast-teaser__footer">
<div class="podcast-author" itemscope itemtype="http://schema.org/Person">
Heribert Innoq
</div>
</div>
</a>
<a href="#" class="podcast-teaser podcast-teaser--avatar flex-grow" style="background-image: url(../../assets/example-content/heribert-rechts.png)">
<div class="podcast-teaser__body">
<div class="podcast-teaser__caption">Podcast</div>
<h2 class="podcast-teaser__headline">faucet-pipeline</h2>
<h3 class="podcast-teaser__subheadline">
JavaScript, CSS, Bilder und Fonts bereit zum Ausliefern
</h3>
<span class="icon icon-arrow-long-right icon--brand-blue"></span>
</div>
<div class="podcast-teaser__footer">
<div class="podcast-author" itemscope itemtype="http://schema.org/Person">
Heribert Innoq
</div>
</div>
</a>
<a href="#" class="podcast-teaser podcast-teaser--avatar--overlay flex-grow" style="background-image: url(../../assets/example-content/heribert-rechts.png)">
<div class="podcast-teaser__body">
<div class="podcast-teaser__caption">Podcast</div>
<h2 class="podcast-teaser__headline">MLOps</h2>
<h3 class="podcast-teaser__subheadline">
Entwurf, Entwicklung, Betrieb
</h3>
<span class="icon icon-arrow-long-right icon--brand-white"></span>
</div>
<div class="podcast-teaser__footer">
<div class="podcast-author" itemscope itemtype="http://schema.org/Person">
Heribert Innoq
</div>
</div>
</a>
</div>
<a href="#" class="podcast-overview-teaser static-tile-teaser static-tile-teaser-bg-color--security">
<div class="static-tile-teaser__content">
<div class="static-tile-teaser__body">
<h2 class="static-tile-teaser__headline podcast-overview-teaser__headline--security">Der Security Podcast</h2>
<p class="static-tile-teaser__text podcast-overview-teaser__text--security">
In dieser Serie sprechen wir über die Grundlagen von IT-Security. Ein praktischer Einstieg für alle, die an Software arbeiten.
</p>
</div>
<div class="static-tile-teaser__goto">
<span class="link-teaser link-teaser--security">Alle Episoden</span>
</div>
</div>
</a>
<div class="podcast-overview-samples">
<a href="#" class="podcast-teaser podcast-teaser--avatar--overlay podcast-teaser--avatar--overlay--security flex-grow" style="background-image: url(../../assets/example-content/heribert-rechts.png)">
<div class="podcast-teaser__body">
<div class="podcast-teaser__caption podcast-teaser__caption--security">Security Podcast</div>
<h2 class="podcast-teaser__headline podcast-teaser__headline--security">CAs und Let’s Encrypt</h2>
<h3 class="podcast-teaser__subheadline podcast-teaser__subheadline--security">
Wer zertifiziert hier eigentlich wen?
</h3>
<span class="icon icon-arrow-long-right icon--brand-black"></span>
</div>
<div class="podcast-teaser__footer">
<div class="podcast-author" itemscope itemtype="http://schema.org/Person">
Heribert Innoq
</div>
</div>
</a>
<a href="#" class="podcast-teaser podcast-teaser--avatar podcast-teaser--avatar--security flex-grow">
<div class="podcast-teaser__body">
<div class="podcast-teaser__caption">Security-Podcast</div>
<h2 class="podcast-teaser__headline podcast-teaser__headline--security">TLS</h2>
<h3 class="podcast-teaser__subheadline podcast-teaser__subheadline--security">
Der sichere Weg von A nach B
</h3>
<span class="icon icon-arrow-long-right icon--brand-black"></span>
</div>
<div class="podcast-teaser__footer">
<div class="podcast-author" itemscope itemtype="http://schema.org/Person">
Heribert Innoq
</div>
<div class="podcast-author" itemscope itemtype="http://schema.org/Person">
Heribert Innoq
</div>
</div>
</a>
<a href="#" class="podcast-teaser podcast-teaser--default podcast-teaser--default--security flex-grow">
<div class="podcast-teaser__body">
<div class="podcast-teaser__caption">Security-Podcast</div>
<h2 class="podcast-teaser__headline podcast-teaser__headline--security">Zertifikate</h2>
<h3 class="podcast-teaser__subheadline podcast-teaser__subheadline--security">
Ich bräuchte dann noch eine digitale Unterschrift von Ihnen
</h3>
<span class="icon icon-arrow-long-right icon--brand-yellow"></span>
</div>
<div class="podcast-teaser__footer">
<div class="podcast-author" itemscope itemtype="http://schema.org/Person">
Heribert Innoq
</div>
<div class="podcast-author" itemscope itemtype="http://schema.org/Person">
Heribert Innoq
</div>
</div>
</a>
</div>
</div>
</main>
<main role="main">
<header class="image-header image-header--no-padding bg-image-podcast-01">
<div class="image-header__body">
<div class="image-header__content">
<h1 class="image-header__title bg-image-podcast-01">Unsere Podcasts</h1>
<span class="icon icon-arrow-long-down icon--brand-secondary"></span>
</div>
</div>
</header>
<div class="podcast-overview-grid">
<a href="#" class="podcast-overview-teaser static-tile-teaser static-tile-teaser-bg-color">
<div class="static-tile-teaser__content">
<div class="static-tile-teaser__body">
<h2 class="static-tile-teaser__headline">Der INNOQ Podcast</h2>
<p class="static-tile-teaser__text">
In dieser Serie diskutieren wir interessante Themen aus Software-Entwicklung und -Architektur – immer mit dem Fokus auf Praxistauglichkeit.
</p>
</div>
<div class="static-tile-teaser__goto">
<span class="link-teaser">Alle Episoden</span>
</div>
</div>
</a>
<div class="podcast-overview-samples">
<a href="#" class="podcast-teaser podcast-teaser--default flex-grow">
<div class="podcast-teaser__body">
<div class="podcast-teaser__caption">Podcast</div>
<h2 class="podcast-teaser__headline">PIM-Systeme</h2>
<h3 class="podcast-teaser__subheadline">
Oder: die Datenkomplexität eines T-Shirts
</h3>
<span class="icon icon-arrow-long-right icon--brand-white"></span>
</div>
<div class="podcast-teaser__footer">
<div class="podcast-author" itemscope itemtype="http://schema.org/Person" >
Heribert Innoq
</div>
</div>
</a>
<a href="#" class="podcast-teaser podcast-teaser--avatar flex-grow" style="background-image: url({{ path '/assets/example-content/heribert-rechts.png' }})">
<div class="podcast-teaser__body">
<div class="podcast-teaser__caption">Podcast</div>
<h2 class="podcast-teaser__headline">faucet-pipeline</h2>
<h3 class="podcast-teaser__subheadline">
JavaScript, CSS, Bilder und Fonts bereit zum Ausliefern
</h3>
<span class="icon icon-arrow-long-right icon--brand-blue"></span>
</div>
<div class="podcast-teaser__footer">
<div class="podcast-author" itemscope itemtype="http://schema.org/Person" >
Heribert Innoq
</div>
</div>
</a>
<a href="#" class="podcast-teaser podcast-teaser--avatar--overlay flex-grow" style="background-image: url({{ path '/assets/example-content/heribert-rechts.png' }})">
<div class="podcast-teaser__body">
<div class="podcast-teaser__caption">Podcast</div>
<h2 class="podcast-teaser__headline">MLOps</h2>
<h3 class="podcast-teaser__subheadline">
Entwurf, Entwicklung, Betrieb
</h3>
<span class="icon icon-arrow-long-right icon--brand-white"></span>
</div>
<div class="podcast-teaser__footer">
<div class="podcast-author" itemscope itemtype="http://schema.org/Person" >
Heribert Innoq
</div>
</div>
</a>
</div>
<a href="#" class="podcast-overview-teaser static-tile-teaser static-tile-teaser-bg-color--security">
<div class="static-tile-teaser__content">
<div class="static-tile-teaser__body">
<h2 class="static-tile-teaser__headline podcast-overview-teaser__headline--security">Der Security Podcast</h2>
<p class="static-tile-teaser__text podcast-overview-teaser__text--security">
In dieser Serie sprechen wir über die Grundlagen von IT-Security. Ein praktischer Einstieg für alle, die an Software arbeiten.
</p>
</div>
<div class="static-tile-teaser__goto">
<span class="link-teaser link-teaser--security">Alle Episoden</span>
</div>
</div>
</a>
<div class="podcast-overview-samples">
<a href="#" class="podcast-teaser podcast-teaser--avatar--overlay podcast-teaser--avatar--overlay--security flex-grow" style="background-image: url({{ path '/assets/example-content/heribert-rechts.png' }})">
<div class="podcast-teaser__body">
<div class="podcast-teaser__caption podcast-teaser__caption--security">Security Podcast</div>
<h2 class="podcast-teaser__headline podcast-teaser__headline--security">CAs und Let’s Encrypt</h2>
<h3 class="podcast-teaser__subheadline podcast-teaser__subheadline--security">
Wer zertifiziert hier eigentlich wen?
</h3>
<span class="icon icon-arrow-long-right icon--brand-black"></span>
</div>
<div class="podcast-teaser__footer">
<div class="podcast-author" itemscope itemtype="http://schema.org/Person" >
Heribert Innoq
</div>
</div>
</a>
<a href="#" class="podcast-teaser podcast-teaser--avatar podcast-teaser--avatar--security flex-grow">
<div class="podcast-teaser__body">
<div class="podcast-teaser__caption">Security-Podcast</div>
<h2 class="podcast-teaser__headline podcast-teaser__headline--security">TLS</h2>
<h3 class="podcast-teaser__subheadline podcast-teaser__subheadline--security">
Der sichere Weg von A nach B
</h3>
<span class="icon icon-arrow-long-right icon--brand-black"></span>
</div>
<div class="podcast-teaser__footer">
<div class="podcast-author" itemscope itemtype="http://schema.org/Person" >
Heribert Innoq
</div>
<div class="podcast-author" itemscope itemtype="http://schema.org/Person" >
Heribert Innoq
</div>
</div>
</a>
<a href="#" class="podcast-teaser podcast-teaser--default podcast-teaser--default--security flex-grow">
<div class="podcast-teaser__body">
<div class="podcast-teaser__caption">Security-Podcast</div>
<h2 class="podcast-teaser__headline podcast-teaser__headline--security">Zertifikate</h2>
<h3 class="podcast-teaser__subheadline podcast-teaser__subheadline--security">
Ich bräuchte dann noch eine digitale Unterschrift von Ihnen
</h3>
<span class="icon icon-arrow-long-right icon--brand-yellow"></span>
</div>
<div class="podcast-teaser__footer">
<div class="podcast-author" itemscope itemtype="http://schema.org/Person" >
Heribert Innoq
</div>
<div class="podcast-author" itemscope itemtype="http://schema.org/Person" >
Heribert Innoq
</div>
</div>
</a>
</div>
</div>
</main>
/* No context defined. */
$tile-teaser-width: ms(33);
.podcast-overview-samples {
display: none;
}
.podcast-overview-teaser__headline--security,
.podcast-overview-teaser__text--security {
color: $podcast-teaser-default-bg-sec;
}
.link-teaser--security {
color: $podcast-teaser-default-bg-sec;
border-bottom: 3px solid $podcast-teaser-overlay-color-sec;
}
@media screen and (min-width: $grid-breakpoint-md) {
.podcast-overview-grid {
display: grid;
grid-gap: $spacer-sm 0;
grid-template-columns: 1fr;
grid-template-rows: auto;
}
.podcast-overview-samples {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
> * {
margin: $spacer-xs;
}
}
.flex-grow {
flex: 1 $tile-teaser-width;
}
}
@media screen and (min-width: $grid-breakpoint-lg) {
.podcast-overview-grid {
display: grid;
grid-template-columns: 1fr 1fr;
max-width: $default-page-layout-content-width-xl;
margin: auto;
}
.podcast-overview-samples {
grid-row: 2;
}
}
No notes defined.