Watch list (Merkliste)

<!--
    @desc For a proper layout, especially Typo3's own utility class "frame-layout-1" is required. It fixes a
        grid-in-grid issue and the top margin to align with context menu.
    @author Tibor Legat
-->
<div id="c11895" class=" cell small-12 medium-12 large-12 frame frame-default frame-type-list frame-layout-1">
    <header>
        <h2 class="">Merkliste</h2>
    </header>
    <div class="news">
        <!--TYPO3SEARCH_end-->
        <article class="c-teaser c-teaser--card">
            <div class="c-teaser__media">
                <a href="#" class="c-teaser__link">
                    <picture class="" title="Picture Element title">
                        <source data-srcset="https://via.placeholder.com/768x640" media="(min-width: 640px)">
                        <source data-srcset="https://via.placeholder.com/640x480" media="(min-width: 480px)">
                        <source data-srcset="https://via.placeholder.com/480x320" media="(min-width: 0px)">
                        <img itemprop="image" class="lazy lazyload" src="https://via.placeholder.com/64x32" alt="Alt Tag" />
                    </picture>
                </a>
            </div>
            <div class="c-teaser__body">
                <a href="#" class="c-teaser__link">
                    <div class="c-teaser__header">
                        <div class="c-teaser__kicker">
                            <span class="c-badge c-badge--user">HAZ+</span>
                            <span class="c-badge c-badge--prop c-badge--prop-gallery">
    12
</span>
                            <span class="c-badge">
    Anzeige
</span> Brandkatastrophe
                        </div>
                        <h2 class="c-teaser__title">Lorem ipsum dolor sit amet consectetur adipiscing elit</h2>
                    </div>
                    <div class="c-teaser__content">
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. A beatae debitis dolor, dolorem doloremque eaque esse fugit necessitatibus sit veritatis? Lorem ipsum dolor sit amet, consectetur adipisicing elit. A beatae debitis dolor,
                            dolorem doloremque eaque esse fugit necessitatibus sit veritatis?</p>
                    </div>
                </a>
            </div>
            <div class="c-teaser__footer">
                <div class="c-teaser__meta">
                    <div class="c-meta">
                        <ul cLass="c-meta__list">
                            <li class="c-meta__item"><strong>Hildesheim</strong></li>
                            <li class="c-meta__item"><strong>von Johanna Elster</strong></li>
                            <li class="c-meta__item"><time title="Veröffentlicht am" itemprop="datePublished" datetime="28.04.2019">28.04.2019</time></li>
                            <li class="c-meta__item">Aktualisiert <span class="js-last-updated" data-tstamp="1566213446">
    19.08.2019 - 13:17 Uhr
</span>
                            </li>
                            <li class="c-meta__item"><span title="Lesezeit"><i class="fa fa-book-open"></i> 10 Min.</span></li>
                            <li class="c-meta__item"> 9.523 Aufrufe</li>
                        </ul>
                    </div>
                </div>
                <div class="c-teaser__actions">
                    <button class="c-bookmark" title="Artikel merken">
    <i class="far fa-bookmark c-bookmark__icon"></i>
    </button>
                </div>
            </div>
        </article>
        <!--TYPO3SEARCH_begin-->
    </div>
</div>