No notes defined.
<!-- Default -->
<div class="peopleSection has-backdrop">
<h2 class="peopleSection-title">Ich bin der Sektionstitel</h2>
<div class="peopleSection-items">
<div class="peopleSection-item">
<div class="avatar">
<span class="avatar-image" style="background-image: url(https://i.pravatar.cc/640)"></span><span class="avatar-initials">BM</span>
</div>
<h3 class="peopleSection-name">Leora Gulgowski</h3>
<div class="peopleSection-jobtitle">Direct Tactics Specialist</div>
<div class="peopleSection-description">
<p>Selfies fixie next level trust fund jean shorts photo booth raw denim butcher mixtape ethical mustache.</p>
</div>
<div class="peopleSection-links">
<div class="contactLink" data-type="linkedin">
<span class="contactLink-title">LinkedIn</span> <a class="contactLink-link" href="https://de.linkedin.com/company/psi-se"><span class="contactLink-label">@psi-se</span></a>
</div>
</div>
</div>
<div class="peopleSection-item">
<div class="avatar">
<span class="avatar-image" style="background-image: url(https://i.pravatar.cc/640)"></span><span class="avatar-initials">BM</span>
</div>
<h3 class="peopleSection-name">Leora Gulgowski</h3>
<div class="peopleSection-jobtitle">Direct Tactics Specialist</div>
<div class="peopleSection-description">
<p>Cardigan Pinterest gentrify, biodiesel locavore Echo Park bespoke tattooed mlkshk. Master cleanse actually XOXO Schlitz. Four loko disrupt jean shorts meh, normcore vegan tilde vinyl small batch organic Marfa migas Austin Schlitz. Bitters sartorial gastropub, hashtag four loko skateboard chillwave deep.</p>
</div>
<div class="peopleSection-links">
<div class="contactLink" data-type="linkedin">
<span class="contactLink-title">LinkedIn</span> <a class="contactLink-link" href="https://de.linkedin.com/company/psi-se"><span class="contactLink-label">@psi-se</span></a>
</div>
<div class="contactLink" data-type="web">
<span class="contactLink-title">Homepage</span> <a class="contactLink-link" href="#"><span class="contactLink-label">website.com</span></a>
</div>
</div>
</div>
<div class="peopleSection-item">
<div class="avatar">
<span class="avatar-image" style="background-image: url(https://i.pravatar.cc/640)"></span><span class="avatar-initials">BM</span>
</div>
<h3 class="peopleSection-name">Leora Gulgowski</h3>
<div class="peopleSection-jobtitle">Direct Tactics Specialist</div>
<div class="peopleSection-description">
<p>Bitters sartorial gastropub, hashtag four loko skateboard chillwave deep. Crucifix you probably haven’t heard of them pork belly tilde, direct trade migas cornhole meggings chambray Vice put a bird on it DIY brunch.</p>
</div>
<div class="peopleSection-links">
<div class="contactLink" data-type="linkedin">
<span class="contactLink-title">LinkedIn</span> <a class="contactLink-link" href="https://de.linkedin.com/company/psi-se"><span class="contactLink-label">@psi-se</span></a>
</div>
</div>
</div>
</div>
</div>
<!-- Dark Theme -->
<div class="peopleSection has-backdrop" data-theme="dark">
<h2 class="peopleSection-title">Ich bin der Sektionstitel</h2>
<div class="peopleSection-items">
<div class="peopleSection-item">
<div class="avatar">
<span class="avatar-image" style="background-image: url(https://i.pravatar.cc/640)"></span><span class="avatar-initials">BM</span>
</div>
<h3 class="peopleSection-name">Leora Gulgowski</h3>
<div class="peopleSection-jobtitle">Direct Tactics Specialist</div>
<div class="peopleSection-description">
<p>Selfies fixie next level trust fund jean shorts photo booth raw denim butcher mixtape ethical mustache.</p>
</div>
<div class="peopleSection-links">
<div class="contactLink" data-type="linkedin">
<span class="contactLink-title">LinkedIn</span> <a class="contactLink-link" href="https://de.linkedin.com/company/psi-se"><span class="contactLink-label">@psi-se</span></a>
</div>
</div>
</div>
<div class="peopleSection-item">
<div class="avatar">
<span class="avatar-image" style="background-image: url(https://i.pravatar.cc/640)"></span><span class="avatar-initials">BM</span>
</div>
<h3 class="peopleSection-name">Leora Gulgowski</h3>
<div class="peopleSection-jobtitle">Direct Tactics Specialist</div>
<div class="peopleSection-description">
<p>Cardigan Pinterest gentrify, biodiesel locavore Echo Park bespoke tattooed mlkshk. Master cleanse actually XOXO Schlitz. Four loko disrupt jean shorts meh, normcore vegan tilde vinyl small batch organic Marfa migas Austin Schlitz. Bitters sartorial gastropub, hashtag four loko skateboard chillwave deep.</p>
</div>
<div class="peopleSection-links">
<div class="contactLink" data-type="linkedin">
<span class="contactLink-title">LinkedIn</span> <a class="contactLink-link" href="https://de.linkedin.com/company/psi-se"><span class="contactLink-label">@psi-se</span></a>
</div>
<div class="contactLink" data-type="web">
<span class="contactLink-title">Homepage</span> <a class="contactLink-link" href="#"><span class="contactLink-label">website.com</span></a>
</div>
</div>
</div>
<div class="peopleSection-item">
<div class="avatar">
<span class="avatar-image" style="background-image: url(https://i.pravatar.cc/640)"></span><span class="avatar-initials">BM</span>
</div>
<h3 class="peopleSection-name">Leora Gulgowski</h3>
<div class="peopleSection-jobtitle">Direct Tactics Specialist</div>
<div class="peopleSection-description">
<p>Bitters sartorial gastropub, hashtag four loko skateboard chillwave deep. Crucifix you probably haven’t heard of them pork belly tilde, direct trade migas cornhole meggings chambray Vice put a bird on it DIY brunch.</p>
</div>
<div class="peopleSection-links">
<div class="contactLink" data-type="linkedin">
<span class="contactLink-title">LinkedIn</span> <a class="contactLink-link" href="https://de.linkedin.com/company/psi-se"><span class="contactLink-label">@psi-se</span></a>
</div>
</div>
</div>
</div>
</div>
<!-- Layout Samples -->
<section class="doc-section">
<section class="doc-variant">
<div class="peopleSection has-backdrop">
<h2 class="peopleSection-title">Ich bin der Sektionstitel</h2>
<div class="peopleSection-items">
<div class="peopleSection-item">
<div class="avatar">
<span class="avatar-image" style="background-image: url(https://i.pravatar.cc/640)"></span><span class="avatar-initials">BM</span>
</div>
<h3 class="peopleSection-name">Leora Gulgowski</h3>
<div class="peopleSection-jobtitle">Direct Tactics Specialist</div>
<div class="peopleSection-description">
<p>Selfies fixie next level trust fund jean shorts photo booth raw denim butcher mixtape ethical mustache.</p>
</div>
<div class="peopleSection-links">
<div class="contactLink" data-type="linkedin">
<span class="contactLink-title">LinkedIn</span> <a class="contactLink-link" href="https://de.linkedin.com/company/psi-se"><span class="contactLink-label">@psi-se</span></a>
</div>
</div>
</div>
<div class="peopleSection-item">
<div class="avatar">
<span class="avatar-image" style="background-image: url(https://i.pravatar.cc/640)"></span><span class="avatar-initials">BM</span>
</div>
<h3 class="peopleSection-name">Leora Gulgowski</h3>
<div class="peopleSection-jobtitle">Direct Tactics Specialist</div>
<div class="peopleSection-description">
<p>Bitters sartorial gastropub, hashtag four loko skateboard chillwave deep. Crucifix you probably haven’t heard of them pork belly tilde, direct trade migas cornhole meggings chambray Vice put a bird on it DIY brunch.</p>
</div>
<div class="peopleSection-links">
<div class="contactLink" data-type="linkedin">
<span class="contactLink-title">LinkedIn</span> <a class="contactLink-link" href="https://de.linkedin.com/company/psi-se"><span class="contactLink-label">@psi-se</span></a>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="doc-variant">
<div class="peopleSection has-backdrop">
<h2 class="peopleSection-title">Ich bin der Sektionstitel</h2>
<div class="peopleSection-items">
<div class="peopleSection-item">
<div class="avatar">
<span class="avatar-image" style="background-image: url(https://i.pravatar.cc/640)"></span><span class="avatar-initials">BM</span>
</div>
<h3 class="peopleSection-name">Leora Gulgowski</h3>
<div class="peopleSection-jobtitle">Direct Tactics Specialist</div>
<div class="peopleSection-description">
<p>Selfies fixie next level trust fund jean shorts photo booth raw denim butcher mixtape ethical mustache.</p>
</div>
<div class="peopleSection-links">
<div class="contactLink" data-type="linkedin">
<span class="contactLink-title">LinkedIn</span> <a class="contactLink-link" href="https://de.linkedin.com/company/psi-se"><span class="contactLink-label">@psi-se</span></a>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="doc-variant">
<div class="peopleSection has-backdrop">
<h2 class="peopleSection-title">Ich bin der Sektionstitel</h2>
<div class="peopleSection-items">
<div class="peopleSection-item">
<div class="avatar">
<span class="avatar-image" style="background-image: url(https://i.pravatar.cc/640)"></span><span class="avatar-initials">BM</span>
</div>
<h3 class="peopleSection-name">Leora Gulgowski</h3>
<div class="peopleSection-jobtitle">Direct Tactics Specialist</div>
<div class="peopleSection-description">
<p>Selfies fixie next level trust fund jean shorts photo booth raw denim butcher mixtape ethical mustache.</p>
</div>
<div class="peopleSection-links">
<div class="contactLink" data-type="linkedin">
<span class="contactLink-title">LinkedIn</span> <a class="contactLink-link" href="https://de.linkedin.com/company/psi-se"><span class="contactLink-label">@psi-se</span></a>
</div>
</div>
</div>
<div class="peopleSection-item">
<div class="avatar">
<span class="avatar-image" style="background-image: url(https://i.pravatar.cc/640)"></span><span class="avatar-initials">BM</span>
</div>
<h3 class="peopleSection-name">Leora Gulgowski</h3>
<div class="peopleSection-jobtitle">Direct Tactics Specialist</div>
<div class="peopleSection-description">
<p>Cardigan Pinterest gentrify, biodiesel locavore Echo Park bespoke tattooed mlkshk. Master cleanse actually XOXO Schlitz. Four loko disrupt jean shorts meh, normcore vegan tilde vinyl small batch organic Marfa migas Austin Schlitz. Bitters sartorial gastropub, hashtag four loko skateboard chillwave deep.</p>
</div>
<div class="peopleSection-links">
<div class="contactLink" data-type="linkedin">
<span class="contactLink-title">LinkedIn</span> <a class="contactLink-link" href="https://de.linkedin.com/company/psi-se"><span class="contactLink-label">@psi-se</span></a>
</div>
<div class="contactLink" data-type="web">
<span class="contactLink-title">Homepage</span> <a class="contactLink-link" href="#"><span class="contactLink-label">website.com</span></a>
</div>
</div>
</div>
<div class="peopleSection-item">
<div class="avatar">
<span class="avatar-image" style="background-image: url(https://i.pravatar.cc/640)"></span><span class="avatar-initials">BM</span>
</div>
<h3 class="peopleSection-name">Leora Gulgowski</h3>
<div class="peopleSection-jobtitle">Direct Tactics Specialist</div>
<div class="peopleSection-description">
<p>Bitters sartorial gastropub, hashtag four loko skateboard chillwave deep. Crucifix you probably haven’t heard of them pork belly tilde, direct trade migas cornhole meggings chambray Vice put a bird on it DIY brunch.</p>
</div>
<div class="peopleSection-links">
<div class="contactLink" data-type="linkedin">
<span class="contactLink-title">LinkedIn</span> <a class="contactLink-link" href="https://de.linkedin.com/company/psi-se"><span class="contactLink-label">@psi-se</span></a>
</div>
</div>
</div>
<div class="peopleSection-item">
<div class="avatar">
<span class="avatar-image" style="background-image: url(https://i.pravatar.cc/640)"></span><span class="avatar-initials">BM</span>
</div>
<h3 class="peopleSection-name">Leora Gulgowski</h3>
<div class="peopleSection-jobtitle">Direct Tactics Specialist</div>
<div class="peopleSection-description">
<p>Cardigan Pinterest gentrify, biodiesel locavore Echo Park bespoke tattooed mlkshk. Master cleanse actually XOXO Schlitz. Four loko disrupt jean shorts meh, normcore vegan tilde vinyl small batch organic Marfa migas Austin Schlitz. Bitters sartorial gastropub, hashtag four loko skateboard chillwave deep.</p>
</div>
<div class="peopleSection-links">
<div class="contactLink" data-type="linkedin">
<span class="contactLink-title">LinkedIn</span> <a class="contactLink-link" href="https://de.linkedin.com/company/psi-se"><span class="contactLink-label">@psi-se</span></a>
</div>
<div class="contactLink" data-type="web">
<span class="contactLink-title">Homepage</span> <a class="contactLink-link" href="#"><span class="contactLink-label">website.com</span></a>
</div>
</div>
</div>
<div class="peopleSection-item">
<div class="avatar">
<span class="avatar-image" style="background-image: url(https://i.pravatar.cc/640)"></span><span class="avatar-initials">BM</span>
</div>
<h3 class="peopleSection-name">Leora Gulgowski</h3>
<div class="peopleSection-jobtitle">Direct Tactics Specialist</div>
<div class="peopleSection-description">
<p>Selfies fixie next level trust fund jean shorts photo booth raw denim butcher mixtape ethical mustache.</p>
</div>
<div class="peopleSection-links">
<div class="contactLink" data-type="linkedin">
<span class="contactLink-title">LinkedIn</span> <a class="contactLink-link" href="https://de.linkedin.com/company/psi-se"><span class="contactLink-label">@psi-se</span></a>
</div>
</div>
</div>
</div>
</div>
</section>
</section>
<!-- Default -->
<div class="peopleSection has-backdrop{{#modifier}} {{.}}{{/modifier}}"{{#theme}} data-theme="{{.}}"{{/theme}}>
{{#title}}
<h2 class="peopleSection-title">{{{.}}}</h2>
{{/title}}
{{#if items}}
<div class="peopleSection-items">
{{#items}}
<div class="peopleSection-item">
{{#avatar}}
{{render '@avatar' (contextData '@peoplesection' this) merge=true}}
{{/avatar}}
<h3 class="peopleSection-name">{{{name}}}</h3>
{{#title}}
<div class="peopleSection-jobtitle">{{{.}}}</div>
{{/title}}
<div class="peopleSection-description">
{{{description}}}
</div>
{{#if contactlinks}}
<div class="peopleSection-links">
{{#contactlinks}}
{{render '@contactlink' (contextData '@peoplesection' this) merge=true}}
{{/contactlinks}}
</div>
{{/if}}
</div>
{{/items}}
</div>
{{/if}}
</div>
<!-- Dark Theme -->
<div class="peopleSection has-backdrop{{#modifier}} {{.}}{{/modifier}}"{{#theme}} data-theme="{{.}}"{{/theme}}>
{{#title}}
<h2 class="peopleSection-title">{{{.}}}</h2>
{{/title}}
{{#if items}}
<div class="peopleSection-items">
{{#items}}
<div class="peopleSection-item">
{{#avatar}}
{{render '@avatar' (contextData '@peoplesection' this) merge=true}}
{{/avatar}}
<h3 class="peopleSection-name">{{{name}}}</h3>
{{#title}}
<div class="peopleSection-jobtitle">{{{.}}}</div>
{{/title}}
<div class="peopleSection-description">
{{{description}}}
</div>
{{#if contactlinks}}
<div class="peopleSection-links">
{{#contactlinks}}
{{render '@contactlink' (contextData '@peoplesection' this) merge=true}}
{{/contactlinks}}
</div>
{{/if}}
</div>
{{/items}}
</div>
{{/if}}
</div>
<!-- Layout Samples -->
{{#sections}}
<section class="doc-section">
{{#title}}
<h2 class="doc-section-title">{{{.}}}</h2>
{{/title}}
{{#if modifiers}}
<div class="doc-variant-configuration">
<ul data-label="Modifier">
{{#modifiers}}
<li>{{{.}}}</li>
{{/modifiers}}
</ul>
</div>
{{/if}}
{{#variants}}
<section class="doc-variant">
{{#if title}}
<header class="doc-variant-header">
{{#title}}
<h3 class="doc-variant-title">{{{.}}}</h3>
{{/title}}
<div class="doc-variant-configuration">
{{#if modifiers}}
<ul data-label="Modifier">
{{#modifiers}}
<li>{{{.}}}</li>
{{/modifiers}}
</ul>
{{/if}}
</div>
</header>
{{/if}}
{{#samples}}
{{render '@peoplesection' (contextData '@peoplesection' this) merge=true}}
{{/samples}}
</section>
{{/variants}}
</section>
{{/sections}}
/* Default */
{
"title": "Ich bin der Sektionstitel",
"items": [
{
"avatar": {
"initials": "BM",
"image": {
"src": "https://i.pravatar.cc/640"
}
},
"name": "Leora Gulgowski",
"title": "Direct Tactics Specialist",
"description": "<p>Selfies fixie next level trust fund jean shorts photo booth raw denim butcher mixtape ethical mustache.</p>\n",
"contactlinks": [
{
"title": "LinkedIn",
"label": "@psi-se",
"url": "https://de.linkedin.com/company/psi-se",
"type": "linkedin"
}
]
},
{
"avatar": {
"initials": "BM",
"image": {
"src": "https://i.pravatar.cc/640"
}
},
"name": "Leora Gulgowski",
"title": "Direct Tactics Specialist",
"description": "<p>Cardigan Pinterest gentrify, biodiesel locavore Echo Park bespoke tattooed mlkshk. Master cleanse actually XOXO Schlitz. Four loko disrupt jean shorts meh, normcore vegan tilde vinyl small batch organic Marfa migas Austin Schlitz. Bitters sartorial gastropub, hashtag four loko skateboard chillwave deep.</p>\n",
"contactlinks": [
{
"title": "LinkedIn",
"label": "@psi-se",
"url": "https://de.linkedin.com/company/psi-se",
"type": "linkedin"
},
{
"title": "Homepage",
"label": "website.com",
"url": "#",
"type": "web"
}
]
},
{
"avatar": {
"initials": "BM",
"image": {
"src": "https://i.pravatar.cc/640"
}
},
"name": "Leora Gulgowski",
"title": "Direct Tactics Specialist",
"description": "<p>Bitters sartorial gastropub, hashtag four loko skateboard chillwave deep. Crucifix you probably haven’t heard of them pork belly tilde, direct trade migas cornhole meggings chambray Vice put a bird on it DIY brunch.</p>\n",
"contactlinks": [
{
"title": "LinkedIn",
"label": "@psi-se",
"url": "https://de.linkedin.com/company/psi-se",
"type": "linkedin"
}
]
}
]
}
/* Dark Theme */
{
"title": "Ich bin der Sektionstitel",
"items": [
{
"avatar": {
"initials": "BM",
"image": {
"src": "https://i.pravatar.cc/640"
}
},
"name": "Leora Gulgowski",
"title": "Direct Tactics Specialist",
"description": "<p>Selfies fixie next level trust fund jean shorts photo booth raw denim butcher mixtape ethical mustache.</p>\n",
"contactlinks": [
{
"title": "LinkedIn",
"label": "@psi-se",
"url": "https://de.linkedin.com/company/psi-se",
"type": "linkedin"
}
]
},
{
"avatar": {
"initials": "BM",
"image": {
"src": "https://i.pravatar.cc/640"
}
},
"name": "Leora Gulgowski",
"title": "Direct Tactics Specialist",
"description": "<p>Cardigan Pinterest gentrify, biodiesel locavore Echo Park bespoke tattooed mlkshk. Master cleanse actually XOXO Schlitz. Four loko disrupt jean shorts meh, normcore vegan tilde vinyl small batch organic Marfa migas Austin Schlitz. Bitters sartorial gastropub, hashtag four loko skateboard chillwave deep.</p>\n",
"contactlinks": [
{
"title": "LinkedIn",
"label": "@psi-se",
"url": "https://de.linkedin.com/company/psi-se",
"type": "linkedin"
},
{
"title": "Homepage",
"label": "website.com",
"url": "#",
"type": "web"
}
]
},
{
"avatar": {
"initials": "BM",
"image": {
"src": "https://i.pravatar.cc/640"
}
},
"name": "Leora Gulgowski",
"title": "Direct Tactics Specialist",
"description": "<p>Bitters sartorial gastropub, hashtag four loko skateboard chillwave deep. Crucifix you probably haven’t heard of them pork belly tilde, direct trade migas cornhole meggings chambray Vice put a bird on it DIY brunch.</p>\n",
"contactlinks": [
{
"title": "LinkedIn",
"label": "@psi-se",
"url": "https://de.linkedin.com/company/psi-se",
"type": "linkedin"
}
]
}
],
"theme": "dark"
}
/* Layout Samples */
{
"title": "Ich bin der Sektionstitel",
"items": [
{
"avatar": {
"initials": "BM",
"image": {
"src": "https://i.pravatar.cc/640"
}
},
"name": "Leora Gulgowski",
"title": "Direct Tactics Specialist",
"description": "<p>Selfies fixie next level trust fund jean shorts photo booth raw denim butcher mixtape ethical mustache.</p>\n",
"contactlinks": [
{
"title": "LinkedIn",
"label": "@psi-se",
"url": "https://de.linkedin.com/company/psi-se",
"type": "linkedin"
}
]
},
{
"avatar": {
"initials": "BM",
"image": {
"src": "https://i.pravatar.cc/640"
}
},
"name": "Leora Gulgowski",
"title": "Direct Tactics Specialist",
"description": "<p>Cardigan Pinterest gentrify, biodiesel locavore Echo Park bespoke tattooed mlkshk. Master cleanse actually XOXO Schlitz. Four loko disrupt jean shorts meh, normcore vegan tilde vinyl small batch organic Marfa migas Austin Schlitz. Bitters sartorial gastropub, hashtag four loko skateboard chillwave deep.</p>\n",
"contactlinks": [
{
"title": "LinkedIn",
"label": "@psi-se",
"url": "https://de.linkedin.com/company/psi-se",
"type": "linkedin"
},
{
"title": "Homepage",
"label": "website.com",
"url": "#",
"type": "web"
}
]
},
{
"avatar": {
"initials": "BM",
"image": {
"src": "https://i.pravatar.cc/640"
}
},
"name": "Leora Gulgowski",
"title": "Direct Tactics Specialist",
"description": "<p>Bitters sartorial gastropub, hashtag four loko skateboard chillwave deep. Crucifix you probably haven’t heard of them pork belly tilde, direct trade migas cornhole meggings chambray Vice put a bird on it DIY brunch.</p>\n",
"contactlinks": [
{
"title": "LinkedIn",
"label": "@psi-se",
"url": "https://de.linkedin.com/company/psi-se",
"type": "linkedin"
}
]
}
],
"sections": [
{
"variants": [
{
"samples": {
"items": [
{
"avatar": {
"initials": "BM",
"image": {
"src": "https://i.pravatar.cc/640"
}
},
"name": "Leora Gulgowski",
"title": "Direct Tactics Specialist",
"description": "<p>Selfies fixie next level trust fund jean shorts photo booth raw denim butcher mixtape ethical mustache.</p>\n",
"contactlinks": [
{
"title": "LinkedIn",
"label": "@psi-se",
"url": "https://de.linkedin.com/company/psi-se",
"type": "linkedin"
}
]
},
{
"avatar": {
"initials": "BM",
"image": {
"src": "https://i.pravatar.cc/640"
}
},
"name": "Leora Gulgowski",
"title": "Direct Tactics Specialist",
"description": "<p>Bitters sartorial gastropub, hashtag four loko skateboard chillwave deep. Crucifix you probably haven’t heard of them pork belly tilde, direct trade migas cornhole meggings chambray Vice put a bird on it DIY brunch.</p>\n",
"contactlinks": [
{
"title": "LinkedIn",
"label": "@psi-se",
"url": "https://de.linkedin.com/company/psi-se",
"type": "linkedin"
}
]
}
]
}
},
{
"samples": {
"items": [
{
"avatar": {
"initials": "BM",
"image": {
"src": "https://i.pravatar.cc/640"
}
},
"name": "Leora Gulgowski",
"title": "Direct Tactics Specialist",
"description": "<p>Selfies fixie next level trust fund jean shorts photo booth raw denim butcher mixtape ethical mustache.</p>\n",
"contactlinks": [
{
"title": "LinkedIn",
"label": "@psi-se",
"url": "https://de.linkedin.com/company/psi-se",
"type": "linkedin"
}
]
}
]
}
},
{
"samples": {
"items": [
{
"avatar": {
"initials": "BM",
"image": {
"src": "https://i.pravatar.cc/640"
}
},
"name": "Leora Gulgowski",
"title": "Direct Tactics Specialist",
"description": "<p>Selfies fixie next level trust fund jean shorts photo booth raw denim butcher mixtape ethical mustache.</p>\n",
"contactlinks": [
{
"title": "LinkedIn",
"label": "@psi-se",
"url": "https://de.linkedin.com/company/psi-se",
"type": "linkedin"
}
]
},
{
"avatar": {
"initials": "BM",
"image": {
"src": "https://i.pravatar.cc/640"
}
},
"name": "Leora Gulgowski",
"title": "Direct Tactics Specialist",
"description": "<p>Cardigan Pinterest gentrify, biodiesel locavore Echo Park bespoke tattooed mlkshk. Master cleanse actually XOXO Schlitz. Four loko disrupt jean shorts meh, normcore vegan tilde vinyl small batch organic Marfa migas Austin Schlitz. Bitters sartorial gastropub, hashtag four loko skateboard chillwave deep.</p>\n",
"contactlinks": [
{
"title": "LinkedIn",
"label": "@psi-se",
"url": "https://de.linkedin.com/company/psi-se",
"type": "linkedin"
},
{
"title": "Homepage",
"label": "website.com",
"url": "#",
"type": "web"
}
]
},
{
"avatar": {
"initials": "BM",
"image": {
"src": "https://i.pravatar.cc/640"
}
},
"name": "Leora Gulgowski",
"title": "Direct Tactics Specialist",
"description": "<p>Bitters sartorial gastropub, hashtag four loko skateboard chillwave deep. Crucifix you probably haven’t heard of them pork belly tilde, direct trade migas cornhole meggings chambray Vice put a bird on it DIY brunch.</p>\n",
"contactlinks": [
{
"title": "LinkedIn",
"label": "@psi-se",
"url": "https://de.linkedin.com/company/psi-se",
"type": "linkedin"
}
]
},
{
"avatar": {
"initials": "BM",
"image": {
"src": "https://i.pravatar.cc/640"
}
},
"name": "Leora Gulgowski",
"title": "Direct Tactics Specialist",
"description": "<p>Cardigan Pinterest gentrify, biodiesel locavore Echo Park bespoke tattooed mlkshk. Master cleanse actually XOXO Schlitz. Four loko disrupt jean shorts meh, normcore vegan tilde vinyl small batch organic Marfa migas Austin Schlitz. Bitters sartorial gastropub, hashtag four loko skateboard chillwave deep.</p>\n",
"contactlinks": [
{
"title": "LinkedIn",
"label": "@psi-se",
"url": "https://de.linkedin.com/company/psi-se",
"type": "linkedin"
},
{
"title": "Homepage",
"label": "website.com",
"url": "#",
"type": "web"
}
]
},
{
"avatar": {
"initials": "BM",
"image": {
"src": "https://i.pravatar.cc/640"
}
},
"name": "Leora Gulgowski",
"title": "Direct Tactics Specialist",
"description": "<p>Selfies fixie next level trust fund jean shorts photo booth raw denim butcher mixtape ethical mustache.</p>\n",
"contactlinks": [
{
"title": "LinkedIn",
"label": "@psi-se",
"url": "https://de.linkedin.com/company/psi-se",
"type": "linkedin"
}
]
}
]
}
}
]
}
]
}
@import "_peopleSection.styles";
.richtextBlock .peopleSection-name {
@include stack-spacing(0);
}
.peopleSection {
@include stack-spacing(section);
@include full-width-backdrop($set-padding: true);
.avatar {
@extend %avatar--large;
}
&-title {
@extend %sectionTitle;
@include stack-spacing(0);
@include stack-spacing(component, margin-bottom);
}
&-items {
> * + * {
@include stack-spacing(component);
}
}
&-item {
margin-left: auto;
margin-right: auto;
display: flex;
flex-direction: column;
align-items: center;
row-gap: var(--sp);
text-align: center;
max-width: $_narrow-content_max-width;
}
&-name {
@include stack-spacing(0);
@include text-size(2x-large);
}
&-jobtitle {
margin-top: calc(-1 * var(--sp));
}
&-description {
> *:first-child {
@include stack-spacing(0);
}
}
&-links {
&::before {
content: "";
display: block;
width: 50%;
margin: 0 auto;
border-top: var(--bw) solid $_gray-400;
}
}
@include only-on-desktop(){
&-items {
display: grid;
column-gap: (2 * $_grid_gutter);
row-gap: var(--sp-component);
grid-template-columns: repeat(6, 1fr);
justify-items: center;
> * {
@include stack-spacing(0);
}
}
&-item {
grid-column: auto / span 2;
position: relative;
// Single item
&:only-child {
grid-column: 1 / -1 !important;
}
// 4 items
&:nth-child(1):nth-last-child(4),
&:nth-child(3):nth-last-child(2) {
grid-column-start: 2;
}
&:nth-child(3):nth-last-child(2)::before {
display: none;
}
&:nth-child(4):nth-last-child(1)::before {
display: block;
}
// Odd count of items in last row
&:nth-child(3n-2):nth-last-child(2) {
grid-column-start: 2;
}
&:nth-child(3n-1):nth-last-child(1) {
grid-column-start: 4;
}
&:nth-child(3n-2)::before {
display: none;
}
}
}
}