Barmer Fractal

Teaser: Searchresult 

<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>&nbsp;<i class="a-icon icon--lock" aria-label="Geschützter Inhalt"></i>&nbsp;<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 {{viewtypes.specifier}}">

    {{# this.switches.hasTeaserHeadline }}
      <a href="/components/preview/article" class="a-link teaser__headline-wrapper">
        {{# this.switches.hasTeaserImage }}
          <span class="teaser__image">
            {{render (stringToPartial partials.iconType) partials.icon merge=true}}
          </span>
        {{/ this.switches.hasTeaserImage }}

        <h3 class="teaser__headline">
          <span class="link__inner">{{ content.headline }}</span>{{#switches.hasLock~}}&nbsp;{{~ render '@icon--lock'~}}{{~/switches.hasLock~}}&nbsp;{{~ render '@icon--chevron-right' merge=true}}
        </h3>
      </a>
    {{/this.switches.hasTeaserHeadline}}

  <div class="teaser__content">

    {{# this.switches.hasTeaserRichtext }}
      <div class="teaser__text teaser__text--richtext">
        {{{ content.richtext }}}
      </div>
    {{/this.switches.hasTeaserRichtext}}

    {{ render '@breadcrumb' partials.breadcrumb merge=true }}

    {{ render '@timestamp' partials.timestamp merge=true}}

  </div>

</div>
 
{
  "switches": {
    "isLinkable": false,
    "hasButton": false,
    "hasTestimonialButton": false,
    "hasDockingPlacement": false,
    "hasTestimonialPlacement": false,
    "hasHeadlineChevron": false,
    "hasIconAsImage": false,
    "hasInternalVideo": false,
    "hasPictureWithSrcset": true,
    "hasPlayButton": false,
    "hasSecondTarget": false,
    "hasTeaserHeadline": true,
    "hasTeaserContentWrapper": true,
    "hasTeaserHeadlineAsLink": false,
    "hasTeaserHeadlineWrapper": false,
    "hasTeaserImage": true,
    "hasTeaserImageLazyLoadingDisabled": false,
    "hasTeaserOverline": false,
    "hasTeaserRichtext": true,
    "hasTeaserText": true,
    "hasTextChevron": false,
    "hasTestimonial": false,
    "linkAsButtonView": false,
    "linkAsButtonView2": false,
    "hasMultipleButtons": false,
    "hasRatingStars": false,
    "hasActor": false,
    "hasTeaserGradient": false,
    "hasLock": "false"
  },
  "viewtypes": {
    "specifier": "teaser--searchresult"
  },
  "content": {
    "targetUrl": "http://tagesschau.de",
    "overline": "Dies ist eine Overline, die im Studio als Subtitle geführt wird",
    "headline": "Kleine Fremdkörper im Auge",
    "headlineTag": "h4",
    "badge": "52%",
    "videoTemplateId": "123",
    "videoType": "video--external",
    "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": {
    "teaserText": {
      "content": {
        "text": "Dies ist ein kurzer Teaser-Text"
      }
    },
    "image": {
      "content": {
        "sourceUrl": "../../images/eine-frau-sitzt-auf-der-fensterbank-und-schaut-auf-ein-tablet.jpg"
      }
    },
    "picture": {
      "content": {
        "sources": [
          {
            "media": "(max-width: 640px)",
            "srcset": "../../images/1x1/barmer-app-yeah.jpg"
          },
          {
            "media": "(min-width: 641px)",
            "srcset": "../../images/16x9/barmer-app-yeah.jpg"
          }
        ],
        "img": {
          "src": "../../images/16x9/barmer-app-yeah.jpg",
          "alt": ""
        }
      }
    },
    "textlink": {},
    "playButton": {
      "viewtypes": {
        "specifier": "btn--play js-modal-trigger"
      }
    },
    "iconType": "icon--website",
    "breadcrumb": {
      "switches": {
        "hasLabel": true
      },
      "viewtypes": {},
      "content": {
        "label": "Gefunden in:"
      },
      "partials": {}
    }
  }
}

No notes defined.