Listen @list
Suchergebnisse @list--search
<!-- Suchergebnisse -->
<div class="list">
<div class="list__inner">
<div class="list__header">
<h2 class="headline headline--6">324 Suchergebnisse zu
<mark class="mark">„Student“</mark>
</h2>
<div class="list__filter">
<div class="inline-dropdown"><span class="inline-dropdown__label" id="inline-dropdown-5316-label">Sortieren:</span>
<button class="inline-dropdown__control js-inline-dropdown" id="inline-dropdown-5316-control" aria-label="Sortierung wählen. Aktuell: Name A-Z" aria-expanded="false" aria-controls="inline-dropdown-5316-list" type="button"><span class="inline-dropdown__control-inner"><span class="inline-dropdown__control-label">Name A-Z</span><span class="inline-dropdown__control-indicator"><svg class="icon icon--angle-down inline-dropdown__control-icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-angle-down"></use>
</svg></span></span>
</button>
<ul class="inline-dropdown__list" id="inline-dropdown-5316-list" tabindex="-1">
<li class="inline-dropdown__item">
<a class="inline-dropdown__link" href="#" tabindex="-1">Datum</a>
</li>
<li class="inline-dropdown__item">
<a class="inline-dropdown__link" href="#" tabindex="-1">Beliebtheit</a>
</li>
<li class="inline-dropdown__item">
<a class="inline-dropdown__link" href="#" tabindex="-1">Zufällig</a>
</li>
</ul>
</div>
<div class="inline-dropdown"><span class="inline-dropdown__label" id="inline-dropdown-f445-label">Anzeigen:</span>
<button class="inline-dropdown__control js-inline-dropdown" id="inline-dropdown-f445-control" aria-label="Sortierung wählen. Aktuell: 25 Ergebnisse" aria-expanded="false" aria-controls="inline-dropdown-f445-list" type="button"><span class="inline-dropdown__control-inner"><span class="inline-dropdown__control-label">25 Ergebnisse</span><span class="inline-dropdown__control-indicator"><svg class="icon icon--angle-down inline-dropdown__control-icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-angle-down"></use>
</svg></span></span>
</button>
<ul class="inline-dropdown__list" id="inline-dropdown-f445-list" tabindex="-1">
<li class="inline-dropdown__item">
<a class="inline-dropdown__link" href="#" tabindex="-1">50 Ergebnisse</a>
</li>
<li class="inline-dropdown__item">
<a class="inline-dropdown__link" href="#" tabindex="-1">alle Ergebnisse</a>
</li>
</ul>
</div>
</div>
</div>
<div class="list__items">
<div class="list-content">
<div class="list-content__item">
<article class="list-item list-item--search">
<div class="list-item__content">
<div class="list-item__kicker">Seite</div>
<div class="list-item__headline">
<h3 class="headline headline--7">Bewerbung für das Studium als
<mark class="mark">Student</mark>ische Mitarbeiter Bewerbung für das Studium als
<mark class="mark">Student</mark>ische Mitarbeiter</h3>
</div>
<p>… em ipsum
<mark class="mark">Student</mark> sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor inviduntet dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum…</p>
<div class="list-item__link" aria-hidden="true">http://www.uni-halle.de/dieURLzumSuchergebnis</div>
</div>
<a class="list-item__overlay-link" href="#">
<svg class="icon icon--angle-right" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-angle-right"></use>
</svg><span class="u-hidden-visually">Zum Suchergebnis</span></a>
</article>
</div>
<div class="list-content__item">
<article class="list-item list-item--search">
<div class="list-item__content">
<div class="list-item__kicker">Download</div>
<div class="list-item__headline">
<h3 class="headline headline--7">Dokument mit
<mark class="mark">Student</mark> im Dateinamen</h3>
</div><span class="u-hidden-visually"> (</span>PDF, 12KB, barrierefrei<span class="u-hidden-visually">)</span>
<div class="list-item__link" aria-hidden="true">http://www.uni-halle.de/dieURLzumSuchergebnis</div>
</div>
<a class="list-item__overlay-link" href="#">
<svg class="icon icon--download" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-download"></use>
</svg>
</a>
</article>
</div>
<div class="list-content__item">
<article class="list-item list-item--search">
<div class="list-item__content">
<div class="list-item__kicker">Seite</div>
<div class="list-item__headline">
<h3 class="headline headline--7">Bewerbung für das Studium als
<mark class="mark">Student</mark>ische Mitarbeiter Bewerbung für das Studium als
<mark class="mark">Student</mark>ische Mitarbeiter</h3>
</div>
<p>… em ipsum
<mark class="mark">Student</mark> sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor inviduntet dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum…</p>
<div class="list-item__link" aria-hidden="true">http://www.uni-halle.de/dieURLzumSuchergebnis</div>
</div>
<a class="list-item__overlay-link" href="#">
<svg class="icon icon--angle-right" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-angle-right"></use>
</svg><span class="u-hidden-visually">Zum Suchergebnis</span></a>
</article>
</div>
<div class="list-content__item">
<article class="list-item list-item--search">
<div class="list-item__content">
<div class="list-item__kicker">Download</div>
<div class="list-item__headline">
<h3 class="headline headline--7">Dokument mit
<mark class="mark">Student</mark> im Dateinamen</h3>
</div><span class="u-hidden-visually"> (</span>PDF, 12KB, barrierefrei<span class="u-hidden-visually">)</span>
<div class="list-item__link" aria-hidden="true">http://www.uni-halle.de/dieURLzumSuchergebnis</div>
</div>
<a class="list-item__overlay-link" href="#">
<svg class="icon icon--download" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-download"></use>
</svg>
</a>
</article>
</div>
<div class="list-content__item">
<article class="list-item list-item--search">
<div class="list-item__content">
<div class="list-item__kicker">Seite</div>
<div class="list-item__headline">
<h3 class="headline headline--7">Bewerbung für das Studium als
<mark class="mark">Student</mark>ische Mitarbeiter Bewerbung für das Studium als
<mark class="mark">Student</mark>ische Mitarbeiter</h3>
</div>
<p>… em ipsum
<mark class="mark">Student</mark> sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor inviduntet dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum…</p>
<div class="list-item__link" aria-hidden="true">http://www.uni-halle.de/dieURLzumSuchergebnis</div>
</div>
<a class="list-item__overlay-link" href="#">
<svg class="icon icon--angle-right" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-angle-right"></use>
</svg><span class="u-hidden-visually">Zum Suchergebnis</span></a>
</article>
</div>
<div class="list-content__item">
<article class="list-item list-item--search">
<div class="list-item__content">
<div class="list-item__kicker">Download</div>
<div class="list-item__headline">
<h3 class="headline headline--7">Dokument mit
<mark class="mark">Student</mark> im Dateinamen</h3>
</div><span class="u-hidden-visually"> (</span>PDF, 12KB, barrierefrei<span class="u-hidden-visually">)</span>
<div class="list-item__link" aria-hidden="true">http://www.uni-halle.de/dieURLzumSuchergebnis</div>
</div>
<a class="list-item__overlay-link" href="#">
<svg class="icon icon--download" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-download"></use>
</svg>
</a>
</article>
</div>
</div>
</div>
<div class="list__footer">
<nav class="pagination" role="navigation" aria-label="Seitennummerierung">
<div class="pagination__next">
<a class="button button--primary" href="#" value="test" rel="next"><span class="button__text">Nächste Seite</span></a>
</div>
<div class="pagination__previous">
<a class="link link--internal" href="#" rel="prev">Vorherige Seite</a>
</div>
<ul class="pagination__list">
<li class="pagination__item">
<a class="link pagination__link" href="#"><span class="u-hidden-visually">Zur Seite</span> 1</a>
</li>
<li class="pagination__item">
<a class="link pagination__link pagination__link--current" href="#" aria-current="page"><span class="u-hidden-visually">Aktuelle Seite:</span> 2</a>
</li>
<li class="pagination__item">
<a class="link pagination__link" href="#"><span class="u-hidden-visually">Zur Seite</span> 3</a>
</li>
<li class="pagination__item">
<a class="link pagination__link" href="#"><span class="u-hidden-visually">Zur Seite</span> 4</a>
</li>
<li class="pagination__item">…</li>
<li class="pagination__item">
<a class="link pagination__link" href="#"><span class="u-hidden-visually">Zur Seite</span> 120</a>
</li>
</ul>
</nav>
</div>
</div>
</div>{
"headline": {
"text": "324 Suchergebnisse zu #[mark.mark „Student“]\n"
},
"filter": true,
"sectioned": null,
"number": true,
"items": [
{
"use": "list-content--search"
}
]
}
Personen @list--persons
<!-- Personen -->
<div class="list">
<div class="list__inner">
<div class="list__header">
<h2 class="headline headline--6">324 Personen</h2>
<div class="list__filter">
<div class="inline-dropdown"><span class="inline-dropdown__label" id="inline-dropdown-c7a8-label">Sortieren:</span>
<button class="inline-dropdown__control js-inline-dropdown" id="inline-dropdown-c7a8-control" aria-label="Sortierung wählen. Aktuell: Name A-Z" aria-expanded="false" aria-controls="inline-dropdown-c7a8-list" type="button"><span class="inline-dropdown__control-inner"><span class="inline-dropdown__control-label">Name A-Z</span><span class="inline-dropdown__control-indicator"><svg class="icon icon--angle-down inline-dropdown__control-icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-angle-down"></use>
</svg></span></span>
</button>
<ul class="inline-dropdown__list" id="inline-dropdown-c7a8-list" tabindex="-1">
<li class="inline-dropdown__item">
<a class="inline-dropdown__link" href="#" tabindex="-1">Datum</a>
</li>
<li class="inline-dropdown__item">
<a class="inline-dropdown__link" href="#" tabindex="-1">Beliebtheit</a>
</li>
<li class="inline-dropdown__item">
<a class="inline-dropdown__link" href="#" tabindex="-1">Zufällig</a>
</li>
</ul>
</div>
<div class="inline-dropdown"><span class="inline-dropdown__label" id="inline-dropdown-5594-label">Anzeigen:</span>
<button class="inline-dropdown__control js-inline-dropdown" id="inline-dropdown-5594-control" aria-label="Sortierung wählen. Aktuell: 25 Ergebnisse" aria-expanded="false" aria-controls="inline-dropdown-5594-list" type="button"><span class="inline-dropdown__control-inner"><span class="inline-dropdown__control-label">25 Ergebnisse</span><span class="inline-dropdown__control-indicator"><svg class="icon icon--angle-down inline-dropdown__control-icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-angle-down"></use>
</svg></span></span>
</button>
<ul class="inline-dropdown__list" id="inline-dropdown-5594-list" tabindex="-1">
<li class="inline-dropdown__item">
<a class="inline-dropdown__link" href="#" tabindex="-1">50 Ergebnisse</a>
</li>
<li class="inline-dropdown__item">
<a class="inline-dropdown__link" href="#" tabindex="-1">alle Ergebnisse</a>
</li>
</ul>
</div>
</div>
</div>
<div class="list__items">
<div class="list-content">
<div class="list-content__item">
<article class="list-item list-item--person">
<div class="list-item__info">
<div class="avatar">
<div class="avatar__image">
<div class="image loading" style="padding-top: 100%;">
<noscript>
<img class="image__fallback" alt="Männliche Person" height="90" src="/images/avatars/man.svg" width="90" />
</noscript>
<img class="image__img js-lazyload" data-src="../images/avatars/man.svg" width="90" height="90" alt="Männliche Person" />
</div>
</div>
</div>
</div>
<div class="list-item__content">
<div class="list-item__headline">
<h3 class="headline headline--7">Franz Schünzel | anfvy</h3>
</div>
<ul class="list-item__list">
<li class="list-item__list-item"><span class="list-item__text">Frontend-Entwickler, UX-Designer, Ö-Team</span><span class="list-item__description">(ITZ)</span></li>
<li class="list-item__list-item"><span class="list-item__text">14.04.1988</span><span class="list-item__description">(33)</span></li>
<li class="list-item__list-item"><span class="list-item__text">Account und Kostenstelle:</span><span class="list-item__description">a+, Q82000</span></li>
<li class="list-item__list-item"><span class="list-item__text">GID und UID:</span><span class="list-item__description">2663, 7270</span></li>
<li class="list-item__list-item">
<a class="list-item__text list-item__link link" href="mailto:franz.schuenzel@itz.uni-halle.de" target="_blank" rel="noopener noreferrer">
<svg class="icon icon--mail list-item__list-icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-mail"></use>
</svg>franz.schuenzel@itz.uni-halle.de</a>
</li>
<li class="list-item__list-item">
<a class="list-item__text list-item__link link" href="https://www.itz.uni-halle.de/otrs/index.pl?Action=AgentCustomerInformationCenter;CustomerID=franz.schuenzel@itz.uni-halle.de" target="_blank" rel="noopener noreferrer">
<svg class="icon icon--archive list-item__list-icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-archive"></use>
</svg>OTRS-Tickets</a>
</li>
</ul>
</div>
<a class="list-item__overlay-link" href="#">
<svg class="icon icon--angle-right" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-angle-right"></use>
</svg><span class="u-hidden-visually">Zur Person</span></a>
</article>
</div>
<div class="list-content__item">
<article class="list-item list-item--person">
<div class="list-item__info">
<div class="avatar">
<div class="avatar__image">
<div class="image loading" style="padding-top: 100%;">
<noscript>
<img class="image__fallback" alt="Männliche Person" height="90" src="/images/avatars/man.svg" width="90" />
</noscript>
<img class="image__img js-lazyload" data-src="../images/avatars/man.svg" width="90" height="90" alt="Männliche Person" />
</div>
</div>
</div>
</div>
<div class="list-item__content">
<div class="list-item__headline">
<h3 class="headline headline--7">Franz Schünzel | anfvy</h3>
</div>
<ul class="list-item__list">
<li class="list-item__list-item"><span class="list-item__text">Frontend-Entwickler, UX-Designer, Ö-Team</span><span class="list-item__description">(ITZ)</span></li>
<li class="list-item__list-item"><span class="list-item__text">14.04.1988</span><span class="list-item__description">(33)</span></li>
<li class="list-item__list-item"><span class="list-item__text">Account und Kostenstelle:</span><span class="list-item__description">a+, Q82000</span></li>
<li class="list-item__list-item"><span class="list-item__text">GID und UID:</span><span class="list-item__description">2663, 7270</span></li>
<li class="list-item__list-item">
<a class="list-item__text list-item__link link" href="mailto:franz.schuenzel@itz.uni-halle.de" target="_blank" rel="noopener noreferrer">
<svg class="icon icon--mail list-item__list-icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-mail"></use>
</svg>franz.schuenzel@itz.uni-halle.de</a>
</li>
<li class="list-item__list-item">
<a class="list-item__text list-item__link link" href="https://www.itz.uni-halle.de/otrs/index.pl?Action=AgentCustomerInformationCenter;CustomerID=franz.schuenzel@itz.uni-halle.de" target="_blank" rel="noopener noreferrer">
<svg class="icon icon--archive list-item__list-icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-archive"></use>
</svg>OTRS-Tickets</a>
</li>
</ul>
</div>
<a class="list-item__overlay-link" href="#">
<svg class="icon icon--angle-right" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-angle-right"></use>
</svg><span class="u-hidden-visually">Zur Person</span></a>
</article>
</div>
<div class="list-content__item">
<article class="list-item list-item--person">
<div class="list-item__info">
<div class="avatar">
<div class="avatar__image">
<div class="image loading" style="padding-top: 100%;">
<noscript>
<img class="image__fallback" alt="Männliche Person" height="90" src="/images/avatars/man.svg" width="90" />
</noscript>
<img class="image__img js-lazyload" data-src="../images/avatars/man.svg" width="90" height="90" alt="Männliche Person" />
</div>
</div>
</div>
</div>
<div class="list-item__content">
<div class="list-item__headline">
<h3 class="headline headline--7">Franz Schünzel | anfvy</h3>
</div>
<ul class="list-item__list">
<li class="list-item__list-item"><span class="list-item__text">Frontend-Entwickler, UX-Designer, Ö-Team</span><span class="list-item__description">(ITZ)</span></li>
<li class="list-item__list-item"><span class="list-item__text">14.04.1988</span><span class="list-item__description">(33)</span></li>
<li class="list-item__list-item"><span class="list-item__text">Account und Kostenstelle:</span><span class="list-item__description">a+, Q82000</span></li>
<li class="list-item__list-item"><span class="list-item__text">GID und UID:</span><span class="list-item__description">2663, 7270</span></li>
<li class="list-item__list-item">
<a class="list-item__text list-item__link link" href="mailto:franz.schuenzel@itz.uni-halle.de" target="_blank" rel="noopener noreferrer">
<svg class="icon icon--mail list-item__list-icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-mail"></use>
</svg>franz.schuenzel@itz.uni-halle.de</a>
</li>
<li class="list-item__list-item">
<a class="list-item__text list-item__link link" href="https://www.itz.uni-halle.de/otrs/index.pl?Action=AgentCustomerInformationCenter;CustomerID=franz.schuenzel@itz.uni-halle.de" target="_blank" rel="noopener noreferrer">
<svg class="icon icon--archive list-item__list-icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-archive"></use>
</svg>OTRS-Tickets</a>
</li>
</ul>
</div>
<a class="list-item__overlay-link" href="#">
<svg class="icon icon--angle-right" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-angle-right"></use>
</svg><span class="u-hidden-visually">Zur Person</span></a>
</article>
</div>
<div class="list-content__item">
<article class="list-item list-item--person">
<div class="list-item__info">
<div class="avatar">
<div class="avatar__image">
<div class="image loading" style="padding-top: 100%;">
<noscript>
<img class="image__fallback" alt="Männliche Person" height="90" src="/images/avatars/man.svg" width="90" />
</noscript>
<img class="image__img js-lazyload" data-src="../images/avatars/man.svg" width="90" height="90" alt="Männliche Person" />
</div>
</div>
</div>
</div>
<div class="list-item__content">
<div class="list-item__headline">
<h3 class="headline headline--7">Franz Schünzel | anfvy</h3>
</div>
<ul class="list-item__list">
<li class="list-item__list-item"><span class="list-item__text">Frontend-Entwickler, UX-Designer, Ö-Team</span><span class="list-item__description">(ITZ)</span></li>
<li class="list-item__list-item"><span class="list-item__text">14.04.1988</span><span class="list-item__description">(33)</span></li>
<li class="list-item__list-item"><span class="list-item__text">Account und Kostenstelle:</span><span class="list-item__description">a+, Q82000</span></li>
<li class="list-item__list-item"><span class="list-item__text">GID und UID:</span><span class="list-item__description">2663, 7270</span></li>
<li class="list-item__list-item">
<a class="list-item__text list-item__link link" href="mailto:franz.schuenzel@itz.uni-halle.de" target="_blank" rel="noopener noreferrer">
<svg class="icon icon--mail list-item__list-icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-mail"></use>
</svg>franz.schuenzel@itz.uni-halle.de</a>
</li>
<li class="list-item__list-item">
<a class="list-item__text list-item__link link" href="https://www.itz.uni-halle.de/otrs/index.pl?Action=AgentCustomerInformationCenter;CustomerID=franz.schuenzel@itz.uni-halle.de" target="_blank" rel="noopener noreferrer">
<svg class="icon icon--archive list-item__list-icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-archive"></use>
</svg>OTRS-Tickets</a>
</li>
</ul>
</div>
<a class="list-item__overlay-link" href="#">
<svg class="icon icon--angle-right" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-angle-right"></use>
</svg><span class="u-hidden-visually">Zur Person</span></a>
</article>
</div>
<div class="list-content__item">
<article class="list-item list-item--person">
<div class="list-item__info">
<div class="avatar">
<div class="avatar__image">
<div class="image loading" style="padding-top: 100%;">
<noscript>
<img class="image__fallback" alt="Männliche Person" height="90" src="/images/avatars/man.svg" width="90" />
</noscript>
<img class="image__img js-lazyload" data-src="../images/avatars/man.svg" width="90" height="90" alt="Männliche Person" />
</div>
</div>
</div>
</div>
<div class="list-item__content">
<div class="list-item__headline">
<h3 class="headline headline--7">Franz Schünzel | anfvy</h3>
</div>
<ul class="list-item__list">
<li class="list-item__list-item"><span class="list-item__text">Frontend-Entwickler, UX-Designer, Ö-Team</span><span class="list-item__description">(ITZ)</span></li>
<li class="list-item__list-item"><span class="list-item__text">14.04.1988</span><span class="list-item__description">(33)</span></li>
<li class="list-item__list-item"><span class="list-item__text">Account und Kostenstelle:</span><span class="list-item__description">a+, Q82000</span></li>
<li class="list-item__list-item"><span class="list-item__text">GID und UID:</span><span class="list-item__description">2663, 7270</span></li>
<li class="list-item__list-item">
<a class="list-item__text list-item__link link" href="mailto:franz.schuenzel@itz.uni-halle.de" target="_blank" rel="noopener noreferrer">
<svg class="icon icon--mail list-item__list-icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-mail"></use>
</svg>franz.schuenzel@itz.uni-halle.de</a>
</li>
<li class="list-item__list-item">
<a class="list-item__text list-item__link link" href="https://www.itz.uni-halle.de/otrs/index.pl?Action=AgentCustomerInformationCenter;CustomerID=franz.schuenzel@itz.uni-halle.de" target="_blank" rel="noopener noreferrer">
<svg class="icon icon--archive list-item__list-icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-archive"></use>
</svg>OTRS-Tickets</a>
</li>
</ul>
</div>
<a class="list-item__overlay-link" href="#">
<svg class="icon icon--angle-right" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-angle-right"></use>
</svg><span class="u-hidden-visually">Zur Person</span></a>
</article>
</div>
<div class="list-content__item">
<article class="list-item list-item--person">
<div class="list-item__info">
<div class="avatar">
<div class="avatar__image">
<div class="image loading" style="padding-top: 100%;">
<noscript>
<img class="image__fallback" alt="Männliche Person" height="90" src="/images/avatars/man.svg" width="90" />
</noscript>
<img class="image__img js-lazyload" data-src="../images/avatars/man.svg" width="90" height="90" alt="Männliche Person" />
</div>
</div>
</div>
</div>
<div class="list-item__content">
<div class="list-item__headline">
<h3 class="headline headline--7">Franz Schünzel | anfvy</h3>
</div>
<ul class="list-item__list">
<li class="list-item__list-item"><span class="list-item__text">Frontend-Entwickler, UX-Designer, Ö-Team</span><span class="list-item__description">(ITZ)</span></li>
<li class="list-item__list-item"><span class="list-item__text">14.04.1988</span><span class="list-item__description">(33)</span></li>
<li class="list-item__list-item"><span class="list-item__text">Account und Kostenstelle:</span><span class="list-item__description">a+, Q82000</span></li>
<li class="list-item__list-item"><span class="list-item__text">GID und UID:</span><span class="list-item__description">2663, 7270</span></li>
<li class="list-item__list-item">
<a class="list-item__text list-item__link link" href="mailto:franz.schuenzel@itz.uni-halle.de" target="_blank" rel="noopener noreferrer">
<svg class="icon icon--mail list-item__list-icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-mail"></use>
</svg>franz.schuenzel@itz.uni-halle.de</a>
</li>
<li class="list-item__list-item">
<a class="list-item__text list-item__link link" href="https://www.itz.uni-halle.de/otrs/index.pl?Action=AgentCustomerInformationCenter;CustomerID=franz.schuenzel@itz.uni-halle.de" target="_blank" rel="noopener noreferrer">
<svg class="icon icon--archive list-item__list-icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-archive"></use>
</svg>OTRS-Tickets</a>
</li>
</ul>
</div>
<a class="list-item__overlay-link" href="#">
<svg class="icon icon--angle-right" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-angle-right"></use>
</svg><span class="u-hidden-visually">Zur Person</span></a>
</article>
</div>
</div>
</div>
<div class="list__footer">
<nav class="pagination" role="navigation" aria-label="Seitennummerierung">
<div class="pagination__next">
<a class="button button--primary" href="#" value="test" rel="next"><span class="button__text">Nächste Seite</span></a>
</div>
<div class="pagination__previous">
<a class="link link--internal" href="#" rel="prev">Vorherige Seite</a>
</div>
<ul class="pagination__list">
<li class="pagination__item">
<a class="link pagination__link" href="#"><span class="u-hidden-visually">Zur Seite</span> 1</a>
</li>
<li class="pagination__item">
<a class="link pagination__link pagination__link--current" href="#" aria-current="page"><span class="u-hidden-visually">Aktuelle Seite:</span> 2</a>
</li>
<li class="pagination__item">
<a class="link pagination__link" href="#"><span class="u-hidden-visually">Zur Seite</span> 3</a>
</li>
<li class="pagination__item">
<a class="link pagination__link" href="#"><span class="u-hidden-visually">Zur Seite</span> 4</a>
</li>
<li class="pagination__item">…</li>
<li class="pagination__item">
<a class="link pagination__link" href="#"><span class="u-hidden-visually">Zur Seite</span> 120</a>
</li>
</ul>
</nav>
</div>
</div>
</div>{
"headline": {
"text": "324 Personen"
},
"filter": true,
"sectioned": null,
"number": true,
"items": [
{
"use": "list-content--persons"
}
]
}
Materialien @list--materials
<!-- Materialien -->
<div class="list">
<div class="list__inner">
<div class="list__header">
<h2 class="headline headline--6">24 Materialien</h2>
<div class="list__filter">
<div class="inline-dropdown"><span class="inline-dropdown__label" id="inline-dropdown-d9f8-label">Sortieren:</span>
<button class="inline-dropdown__control js-inline-dropdown" id="inline-dropdown-d9f8-control" aria-label="Sortierung wählen. Aktuell: Name A-Z" aria-expanded="false" aria-controls="inline-dropdown-d9f8-list" type="button"><span class="inline-dropdown__control-inner"><span class="inline-dropdown__control-label">Name A-Z</span><span class="inline-dropdown__control-indicator"><svg class="icon icon--angle-down inline-dropdown__control-icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-angle-down"></use>
</svg></span></span>
</button>
<ul class="inline-dropdown__list" id="inline-dropdown-d9f8-list" tabindex="-1">
<li class="inline-dropdown__item">
<a class="inline-dropdown__link" href="#" tabindex="-1">Datum</a>
</li>
<li class="inline-dropdown__item">
<a class="inline-dropdown__link" href="#" tabindex="-1">Beliebtheit</a>
</li>
<li class="inline-dropdown__item">
<a class="inline-dropdown__link" href="#" tabindex="-1">Zufällig</a>
</li>
</ul>
</div>
</div>
</div>
<div class="list__items">
<div class="list-content">
<div class="list-content__item">
<article class="list-item list-item--material">
<div class="list-item__content">
<ul class="list-item__list">
<li class="list-item__list-item">
<article class="material">
<div class="material__content">
<div class="material__headline">
<h3 class="headline headline--7">Name des Flyers</h3>
</div>
<div class="material__description">
<p>Kurzerklärung lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
</div>
<a class="link-block" href="/images/dummy-downloads/dummy.pdf" target="_blank" download="download.pdf"><span class="link-block__icon"><svg class="icon icon--download link-block__icon-svg" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-download"></use>
</svg></span><span class="link-block__text">Download-Link (PDF, 12KB, barrierefrei)</span><span class="link-block__hint"></span></a>
</div>
</article>
</li>
</ul>
</div>
</article>
</div>
<div class="list-content__item">
<article class="list-item list-item--material">
<div class="list-item__content">
<ul class="list-item__list">
<li class="list-item__list-item">
<article class="material">
<div class="material__content">
<div class="material__description">
<p>
<i>Advertising and the Transformation of Screen Cultures.</i>
<br> Amsterdam: Amsterdam University Press, 2019 (in Vorbereitung; Ko-Autorschaft mit Bo Florin und Yvonne Zimmermann).</p>
</div>
</div>
</article>
</li>
</ul>
</div>
</article>
</div>
<div class="list-content__item">
<article class="list-item list-item--material">
<div class="list-item__content">
<ul class="list-item__list">
<li class="list-item__list-item">
<article class="material">
<div class="material__thumbnail">
<figure class="figure js-figure" aria-labelledby="figure-0dec-label">
<a class="figure__media js-lightbox figure__media--lightbox" href="https://dummyimage.com/900x1300/e6e6e6/000&text=lightbox+image+magnification" data-type="image" data-width="90" data-height="130">
<div class="image loading" style="padding-top: 144.44444444444443%;">
<noscript>
<img class="image__fallback" srcset="../images/dummy-images/90x130.jpg 2x, ../images/dummy-images/90x130.jpg 1x" alt="Das alt-Attribut soll einen alternativen Text enthalten, der das Bild beschreibt." height="130" src="/images/dummy-images/90x130.jpg"
width="90" />
</noscript>
<img class="image__img js-lazyload" data-src="../images/dummy-images/90x130.jpg" data-srcset="../images/dummy-images/90x130.jpg 2x, ../images/dummy-images/90x130.jpg 1x" srcset="../images/dummy-images/90x130.jpg 2x, ../images/dummy-images/90x130.jpg 1x"
width="90" height="130" alt="Das alt-Attribut soll einen alternativen Text enthalten, der das Bild beschreibt." /><span class="image__copyright image__copyright--right"><span class="copyright"><span class="copyright__text">Foto: Romy Berger © MLU Halle-Wittenberg</span></span>
</span>
</div><span class="icon-button icon-button--large figure__lightbox-icon" title="Großer Icon-Button" aria-hidden="true"><span class="icon-button__text u-hidden-visually">Großer Icon-Button</span><span class="icon-button__circle"><svg class="icon icon--plus icon-button__icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-plus"></use>
</svg></span></span>
</a>
<figcaption class="figure__caption" id="figure-0dec-label">Hier steht die Bildunterschrift lorem sed diam nonumy ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor</figcaption>
</figure>
</div>
<div class="material__content">
<div class="material__headline">
<h3 class="headline headline--7">Name des Flyers</h3>
</div>
<div class="material__description">
<p>Kurzerklärung lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
</div>
<a class="link-block" href="http://interner-link.com/"><span class="link-block__icon"><svg class="icon icon--angle-right link-block__icon-svg" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-angle-right"></use>
</svg></span><span class="link-block__text">Interner Link</span><span class="link-block__hint"></span></a>
</div>
</article>
</li>
</ul>
</div>
</article>
</div>
<div class="list-content__item">
<article class="list-item list-item--material">
<div class="list-item__content">
<ul class="list-item__list">
<li class="list-item__list-item">
<article class="material">
<div class="material__thumbnail">
<figure class="figure js-figure" aria-labelledby="figure-26db-label">
<a class="figure__media js-lightbox figure__media--lightbox" href="https://dummyimage.com/900x1300/e6e6e6/000&text=lightbox+image+magnification" data-type="image" data-width="90" data-height="130">
<div class="image loading" style="padding-top: 144.44444444444443%;">
<noscript>
<img class="image__fallback" srcset="../images/dummy-images/90x130.jpg 2x, ../images/dummy-images/90x130.jpg 1x" alt="Das alt-Attribut soll einen alternativen Text enthalten, der das Bild beschreibt." height="130" src="/images/dummy-images/90x130.jpg"
width="90" />
</noscript>
<img class="image__img js-lazyload" data-src="../images/dummy-images/90x130.jpg" data-srcset="../images/dummy-images/90x130.jpg 2x, ../images/dummy-images/90x130.jpg 1x" srcset="../images/dummy-images/90x130.jpg 2x, ../images/dummy-images/90x130.jpg 1x"
width="90" height="130" alt="Das alt-Attribut soll einen alternativen Text enthalten, der das Bild beschreibt." /><span class="image__copyright image__copyright--right"><span class="copyright"><span class="copyright__text">Foto: Romy Berger © MLU Halle-Wittenberg</span></span>
</span>
</div><span class="icon-button icon-button--large figure__lightbox-icon" title="Großer Icon-Button" aria-hidden="true"><span class="icon-button__text u-hidden-visually">Großer Icon-Button</span><span class="icon-button__circle"><svg class="icon icon--plus icon-button__icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-plus"></use>
</svg></span></span>
</a>
<figcaption class="figure__caption" id="figure-26db-label">Hier steht die Bildunterschrift lorem sed diam nonumy ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor</figcaption>
</figure>
</div>
<div class="material__content">
<div class="material__headline">
<h3 class="headline headline--7">Name des Bildes</h3>
</div>
<div class="material__description">
<p>Kurzerklärung lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
</div>
<a class="link-block" href="http://theoldpurple.com/" rel="noopener noreferrer" target="_blank"><span class="link-block__icon"><svg class="icon icon--external link-block__icon-svg" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-external"></use>
</svg></span><span class="link-block__text">Externer Link</span><span class="link-block__hint"></span></a>
</div>
</article>
</li>
</ul>
</div>
</article>
</div>
<div class="list-content__item">
<article class="list-item list-item--material">
<div class="list-item__content">
<ul class="list-item__list">
<li class="list-item__list-item">
<article class="material">
<div class="material__content">
<div class="material__headline">
<h3 class="headline headline--7">Name des Flyers</h3>
</div>
<div class="material__description">
<p>Kurzerklärung lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
</div>
<a class="link-block" href="/images/dummy-downloads/dummy.pdf" target="_blank" download="download.pdf"><span class="link-block__icon"><svg class="icon icon--download link-block__icon-svg" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-download"></use>
</svg></span><span class="link-block__text">Download-Link (PDF, 12KB, barrierefrei)</span><span class="link-block__hint"></span></a>
</div>
</article>
</li>
</ul>
</div>
</article>
</div>
<div class="list-content__item">
<article class="list-item list-item--material">
<div class="list-item__content">
<ul class="list-item__list">
<li class="list-item__list-item">
<article class="material">
<div class="material__content">
<div class="material__description">
<p>
<i>Advertising and the Transformation of Screen Cultures.</i>
<br> Amsterdam: Amsterdam University Press, 2019 (in Vorbereitung; Ko-Autorschaft mit Bo Florin und Yvonne Zimmermann).</p>
</div>
</div>
</article>
</li>
</ul>
</div>
</article>
</div>
<div class="list-content__item">
<article class="list-item list-item--material">
<div class="list-item__content">
<ul class="list-item__list">
<li class="list-item__list-item">
<article class="material">
<div class="material__thumbnail">
<figure class="figure js-figure" aria-labelledby="figure-7c05-label">
<a class="figure__media js-lightbox figure__media--lightbox" href="https://dummyimage.com/900x1300/e6e6e6/000&text=lightbox+image+magnification" data-type="image" data-width="90" data-height="130">
<div class="image loading" style="padding-top: 144.44444444444443%;">
<noscript>
<img class="image__fallback" srcset="../images/dummy-images/90x130.jpg 2x, ../images/dummy-images/90x130.jpg 1x" alt="Das alt-Attribut soll einen alternativen Text enthalten, der das Bild beschreibt." height="130" src="/images/dummy-images/90x130.jpg"
width="90" />
</noscript>
<img class="image__img js-lazyload" data-src="../images/dummy-images/90x130.jpg" data-srcset="../images/dummy-images/90x130.jpg 2x, ../images/dummy-images/90x130.jpg 1x" srcset="../images/dummy-images/90x130.jpg 2x, ../images/dummy-images/90x130.jpg 1x"
width="90" height="130" alt="Das alt-Attribut soll einen alternativen Text enthalten, der das Bild beschreibt." /><span class="image__copyright image__copyright--right"><span class="copyright"><span class="copyright__text">Foto: Romy Berger © MLU Halle-Wittenberg</span></span>
</span>
</div><span class="icon-button icon-button--large figure__lightbox-icon" title="Großer Icon-Button" aria-hidden="true"><span class="icon-button__text u-hidden-visually">Großer Icon-Button</span><span class="icon-button__circle"><svg class="icon icon--plus icon-button__icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-plus"></use>
</svg></span></span>
</a>
<figcaption class="figure__caption" id="figure-7c05-label">Hier steht die Bildunterschrift lorem sed diam nonumy ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor</figcaption>
</figure>
</div>
<div class="material__content">
<div class="material__headline">
<h3 class="headline headline--7">Name des Flyers</h3>
</div>
<div class="material__description">
<p>Kurzerklärung lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
</div>
<a class="link-block" href="http://interner-link.com/"><span class="link-block__icon"><svg class="icon icon--angle-right link-block__icon-svg" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-angle-right"></use>
</svg></span><span class="link-block__text">Interner Link</span><span class="link-block__hint"></span></a>
</div>
</article>
</li>
</ul>
</div>
</article>
</div>
<div class="list-content__item">
<article class="list-item list-item--material">
<div class="list-item__content">
<ul class="list-item__list">
<li class="list-item__list-item">
<article class="material">
<div class="material__content">
<div class="material__description">
<p>
<i>Advertising and the Transformation of Screen Cultures.</i>
<br> Amsterdam: Amsterdam University Press, 2019 (in Vorbereitung; Ko-Autorschaft mit Bo Florin und Yvonne Zimmermann).</p>
</div>
</div>
</article>
</li>
</ul>
</div>
</article>
</div>
<div class="list-content__item">
<article class="list-item list-item--material">
<div class="list-item__content">
<ul class="list-item__list">
<li class="list-item__list-item">
<article class="material">
<div class="material__thumbnail">
<figure class="figure js-figure" aria-labelledby="figure-4362-label">
<a class="figure__media js-lightbox figure__media--lightbox" href="https://dummyimage.com/900x1300/e6e6e6/000&text=lightbox+image+magnification" data-type="image" data-width="90" data-height="130">
<div class="image loading" style="padding-top: 144.44444444444443%;">
<noscript>
<img class="image__fallback" srcset="../images/dummy-images/90x130.jpg 2x, ../images/dummy-images/90x130.jpg 1x" alt="Das alt-Attribut soll einen alternativen Text enthalten, der das Bild beschreibt." height="130" src="/images/dummy-images/90x130.jpg"
width="90" />
</noscript>
<img class="image__img js-lazyload" data-src="../images/dummy-images/90x130.jpg" data-srcset="../images/dummy-images/90x130.jpg 2x, ../images/dummy-images/90x130.jpg 1x" srcset="../images/dummy-images/90x130.jpg 2x, ../images/dummy-images/90x130.jpg 1x"
width="90" height="130" alt="Das alt-Attribut soll einen alternativen Text enthalten, der das Bild beschreibt." /><span class="image__copyright image__copyright--right"><span class="copyright"><span class="copyright__text">Foto: Romy Berger © MLU Halle-Wittenberg</span></span>
</span>
</div><span class="icon-button icon-button--large figure__lightbox-icon" title="Großer Icon-Button" aria-hidden="true"><span class="icon-button__text u-hidden-visually">Großer Icon-Button</span><span class="icon-button__circle"><svg class="icon icon--plus icon-button__icon" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-plus"></use>
</svg></span></span>
</a>
<figcaption class="figure__caption" id="figure-4362-label">Hier steht die Bildunterschrift lorem sed diam nonumy ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor</figcaption>
</figure>
</div>
<div class="material__content">
<div class="material__headline">
<h3 class="headline headline--7">Name des Flyers</h3>
</div>
<div class="material__description">
<p>Kurzerklärung lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
</div>
<a class="link-block" href="http://interner-link.com/"><span class="link-block__icon"><svg class="icon icon--angle-right link-block__icon-svg" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-angle-right"></use>
</svg></span><span class="link-block__text">Interner Link</span><span class="link-block__hint"></span></a>
</div>
</article>
</li>
</ul>
</div>
</article>
</div>
</div>
</div>
<div class="list__footer">
<nav class="pagination" role="navigation" aria-label="Seitennummerierung">
<div class="pagination__next">
<a class="button button--primary" href="#" value="test" rel="next"><span class="button__text">Nächste Seite</span></a>
</div>
<div class="pagination__previous">
<a class="link link--internal" href="#" rel="prev">Vorherige Seite</a>
</div>
<ul class="pagination__list">
<li class="pagination__item">
<a class="link pagination__link" href="#"><span class="u-hidden-visually">Zur Seite</span> 1</a>
</li>
<li class="pagination__item">
<a class="link pagination__link pagination__link--current" href="#" aria-current="page"><span class="u-hidden-visually">Aktuelle Seite:</span> 2</a>
</li>
<li class="pagination__item">
<a class="link pagination__link" href="#"><span class="u-hidden-visually">Zur Seite</span> 3</a>
</li>
<li class="pagination__item">
<a class="link pagination__link" href="#"><span class="u-hidden-visually">Zur Seite</span> 4</a>
</li>
<li class="pagination__item">…</li>
<li class="pagination__item">
<a class="link pagination__link" href="#"><span class="u-hidden-visually">Zur Seite</span> 120</a>
</li>
</ul>
</nav>
</div>
</div>
</div>{
"headline": {
"text": "24 Materialien"
},
"filter": true,
"sectioned": null,
"items": [
{
"use": "list-content--materials2"
}
]
}