<div class="o-teaser-collection teaser-collection--searchresult">
<div class="teaser-collection__teaser-wrapper">
<div class="o-teaser teaser--searchresult">
<a href="/components/preview/article" class="a-link teaser__headline-wrapper">
<span class="teaser__image">
<i class="a-icon icon--website" aria-hidden="true"></i>
</span>
<h3 class="teaser__headline">
<span class="link__inner">Kleine Fremdkörper im Auge</span> <i class="a-icon icon--lock" aria-label="Geschützter Inhalt"></i> <i class="a-icon icon--chevron-right" aria-hidden="true"></i>
</h3>
</a>
<div class="teaser__content">
<div class="teaser__text teaser__text--richtext">
Ob beim Radeln oder Renovieren – schnell fliegt einem etwas ins Auge. Wenn ein Fremdkörper hineingelangt, kann er die <b>Hornhaut</b> verletzen. Eine oberflächliche Verletzung heilt meist innerhalb weniger Stunden oder Tage ...
</div>
<div class="m-breadcrumb ">
<span class="breadcrumb__label ">Gefunden in:</span>
<ul class="a-list-basic list--breadcrumb">
<li class="list__item list__item--breadcrumb">
<a href="/components/preview/homepage" class="a-link ">Barmer Startseite</a><i class="a-icon icon--chevron-right" aria-hidden="true"></i>
</li>
<li class="list__item list__item--breadcrumb">
<a href="/components/preview/article" class="a-link ">Übersichtsseite eines Themas</a><i class="a-icon icon--chevron-right" aria-hidden="true"></i>
</li>
<li class="list__item list__item--breadcrumb">
<a href="/components/preview/article" class="a-link ">Barmer So ein Unterthema</a><i class="a-icon icon--chevron-right" aria-hidden="true"></i>
</li>
</ul>
</div>
<div class="m-timestamp "><span class="timestamp__label">Erstellt am:</span> <time class="a-datetime ">06.03.2020</time>
</div>
</div>
</div>
<div class="o-teaser teaser--searchresult">
<a href="/components/preview/article" class="a-link teaser__headline-wrapper">
<span class="teaser__image">
<i class="a-icon icon--download" aria-label="Dateiformat: PDF"></i>
</span>
<h3 class="teaser__headline">
<span class="link__inner">Barmer eCare: die elektronische Patientenakte (ePA) mit einer etwas längeren, umbrucherzwingenden Headline</span> <i class="a-icon icon--lock" aria-label="Geschützter Inhalt"></i> <i class="a-icon icon--chevron-right" aria-hidden="true"></i>
</h3>
</a>
<div class="teaser__content">
<div class="teaser__text teaser__text--richtext">
Mit der elektronischen Patientenakte eCare haben wir eine digitale Plattform geschaffen. Auf der Testen wir auch Abkürzungen wie z.B. WHO um zu sehen, ob das ABBR-Tag ...
</div>
<div class="m-breadcrumb ">
<span class="breadcrumb__label ">Gefunden in:</span>
<ul class="a-list-basic list--breadcrumb">
<li class="list__item list__item--breadcrumb">
<a href="/components/preview/homepage" class="a-link ">Barmer Startseite</a><i class="a-icon icon--chevron-right" aria-hidden="true"></i>
</li>
<li class="list__item list__item--breadcrumb">
<a href="/components/preview/article" class="a-link "><span class="link__inner">Gesundheit verstehen</span><i class="a-icon icon--lock" aria-label=""></i></a><i class="a-icon icon--chevron-right" aria-hidden="true"></i>
</li>
<li class="list__item list__item--breadcrumb">
<a href="/components/preview/article" class="a-link ">Die Barmer packt alle wichtigen Themen, wie z.B. lange, mehrzeilig laufende Breadcrumbs, an</a><i class="a-icon icon--chevron-right" aria-hidden="true"></i>
</li>
<li class="list__item list__item--breadcrumb">
<a href="/components/preview/article" class="a-link ">Zukunftsplattformen</a><i class="a-icon icon--chevron-right" aria-hidden="true"></i>
</li>
</ul>
</div>
<div class="m-timestamp "><span class="timestamp__label">Erstellt am:</span> <time class="a-datetime ">06.03.2020</time>
</div>
</div>
</div>
</div>
</div>
<div class="o-teaser-collection {{viewtypes.specifier}}" {{#content.id}}id="{{this}}"{{/content.id}}>
{{# switches.hasHeadline }}
<h3 class="teaser-collection__headline {{viewtypes.headlineSpecifier}}">{{ content.headline }}</h3>
{{/switches.hasHeadline}}
{{# switches.hasDetailText }}
<div class="teaser-collection__text">
{{# switches.isPlaintext }}
{{ content.plaintext }}
{{/ switches.isPlaintext }}
{{^ switches.isPlaintext }}
{{ render '@richtext' partials.richtext merge=true }}
{{/ switches.isPlaintext }}
</div>
{{/switches.hasDetailText}}
<div class="teaser-collection__teaser-wrapper" {{{ content.attributes }}}>
{{# each partials.teaserItems }}
{{#ifcond @index '<' ../switches.teaserItemAmount}}
{{#ifcond switches.isColumnPosition '==' 1}}
{{ render (stringToPartial ../partials.includedItemType) this merge=true }}
{{/ifcond}}
{{/ifcond}}
{{/each}}
</div>
{{# switches.hasTwoColumns }}
<div class="teaser-collection__teaser-wrapper" {{{ content.attributes }}}>
{{# each partials.teaserItems }}
{{#ifcond @index '<' ../switches.teaserItemAmount}}
{{#ifcond switches.isColumnPosition '==' 2}}
{{ render (stringToPartial ../partials.includedItemType) this merge=true }}
{{/ifcond}}
{{/ifcond}}
{{/each}}
</div>
{{/switches.hasTwoColumns}}
{{# switches.hasFooter }}
<div class="teaser-collection__footer">
{{content.footertext}}
</div>
{{/switches.hasFooter}}
{{# switches.hasCTA }}
<div class="teaser-collection__cta-row">
{{ render '@button' this.partials.button merge=true }}
</div>
{{/switches.hasCTA}}
</div>
{
"switches": {
"hasHeadline": false,
"hasDetailText": false,
"hasTwoColumns": false,
"isPlaintext": true,
"teaserItemAmount": 2,
"hasCTA": false,
"hasButton": false,
"hasFooter": false
},
"viewtypes": {
"specifier": "teaser-collection--searchresult",
"headlineSpecifier": "teaser-collection__headline--h3"
},
"content": {
"headline": "Entspannung, Abwechslung und Inspiration - mit unseren digitalen Angeboten",
"plaintext": "Dies ist ein bißchen Plaintext",
"badge": "",
"button": "",
"footertext": ""
},
"partials": {
"includedItemType": "teaser--searchresult",
"teaserItems": [
{
"switches": {
"hasLock": "false",
"isColumnPosition": 1
},
"content": {
"headline": "Kleine Fremdkörper im Auge",
"richtext": "Ob beim Radeln oder Renovieren – schnell fliegt einem etwas ins Auge. Wenn ein Fremdkörper hineingelangt, kann er die <b>Hornhaut</b> verletzen. Eine oberflächliche Verletzung heilt meist innerhalb weniger Stunden oder Tage ..."
},
"partials": {
"iconType": "icon--website"
}
},
{
"switches": {
"hasLock": "true",
"isColumnPosition": 1
},
"content": {
"headline": "Barmer eCare: die elektronische Patientenakte (ePA) mit einer etwas längeren, umbrucherzwingenden Headline",
"richtext": "Mit der elektronischen Patientenakte eCare haben wir eine digitale Plattform geschaffen. Auf der Testen wir auch Abkürzungen wie z.B. WHO um zu sehen, ob das ABBR-Tag ..."
},
"partials": {
"iconType": "icon--download",
"icon": {
"switches": {
"isAriaHidden": false
},
"content": {
"text": "Dateiformat: PDF"
}
},
"breadcrumb": {
"switches": {
"hasLabel": true
},
"viewtypes": {},
"content": {
"label": "Gefunden in:"
},
"partials": {
"linklist": {
"viewtypes": {
"specifier": "list--breadcrumb"
},
"partials": {
"listitems": [
{
"switches": {
"hasTextContent": false
},
"viewtypes": {
"specifier": "list__item--breadcrumb"
},
"type": "link--breadcrumb",
"partials": {
"item": {
"content": {
"text": "Barmer Startseite",
"url": "/components/preview/homepage"
}
}
}
},
{
"switches": {
"hasTextContent": false
},
"viewtypes": {
"specifier": "list__item--breadcrumb"
},
"type": "link--breadcrumb",
"partials": {
"item": {
"content": {
"text": "<span class=\"link__inner\">Gesundheit verstehen</span><i class=\"a-icon icon--lock\" aria-label=\"\"></i>",
"url": "/components/preview/article"
}
}
}
},
{
"switches": {
"hasTextContent": false
},
"viewtypes": {
"specifier": "list__item--breadcrumb"
},
"type": "link--breadcrumb",
"partials": {
"item": {
"content": {
"text": "Die Barmer packt alle wichtigen Themen, wie z.B. lange, mehrzeilig laufende Breadcrumbs, an",
"url": "/components/preview/article"
}
}
}
},
{
"switches": {
"hasTextContent": false
},
"viewtypes": {
"specifier": "list__item--breadcrumb"
},
"type": "link--breadcrumb",
"partials": {
"item": {
"content": {
"text": "Zukunftsplattformen",
"url": "/components/preview/article"
}
}
}
}
]
}
}
}
}
}
}
],
"richtext": {
"switches": {
"hasDefaultText": false
},
"content": {
"text": "<p>Hier steht dann eine kurzer Richtext, der nicht soviele Styling-Optionen hat. Im Studio lässt sich dort wohl nur strong, kursiv und noch irgendetwas auszeichnen.</p>"
}
},
"button": {
"switches": {
"asLink": true
},
"viewtypes": {
"specifier": "btn--primary"
},
"content": {
"label": "Hier zu den Neuigkeiten"
}
}
}
}
Headline Tag is default rendered as a H3, but styling is controlled by headlineSpecifier.