HTML-Prototype von Hochschule RheinMain

<div class="c-search-list">
  <div class="c-person-list-item"><small class="c-search-list-item__result">/personen/detail</small>
    <p class="h3">Dr. Anna Müller</p><small>Professorin</small>
    <div class="c-person-list-item__links">
      <div class="o-icon-text">
        <svg class="o-icon-text__icon" viewBox="0 0 16 16" aria-hidden="true" focusable="false" style="pointer-events: none;" width="24px" height="24px">
          <use xlink:href="/Images/svg/sprite.symbol.svg#e-mail"></use>
        </svg>
        <div class="o-icon-text__content"><span class="o-icon-text__title">anna.mueller@example.com</span>
        </div>
      </div>
      <div class="o-icon-text">
        <svg class="o-icon-text__icon" viewBox="0 0 16 16" aria-hidden="true" focusable="false" style="pointer-events: none;" width="24px" height="24px">
          <use xlink:href="/Images/svg/sprite.symbol.svg#phone"></use>
        </svg>
        <div class="o-icon-text__content"><span class="o-icon-text__title">+491234567890</span>
        </div>
      </div>
    </div>
    <div class="flex flex--right"><a class="btn btn--right-link" href="#">Zur Person</a></div>
  </div>
  <div class="c-search-list-item"><small class="c-search-list-item__path">/news/auszeichnung-fuer-start-up</small>
    <p class="h3">Auszeichnung für HSRM-Start-up</p>
    <p>
      <div class="o-icon-text">
        <svg class="o-icon-text__icon" viewBox="0 0 16 16" aria-hidden="true" focusable="false" style="pointer-events: none;" width="24px" height="24px">
          <use xlink:href="/Images/svg/sprite.symbol.svg#calendar"></use>
        </svg>
        <div class="o-icon-text__content"><span class="o-icon-text__title">Mi 10.01.2024</span>
        </div>
      </div>
    </p>
    <div class="c-search-list-item__image-wrapper"><img src="https://placeholder.in2code.de/120x120" width="120" height="120" alt="Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa."/>
      <p>Ein Start-up von Absolventen der Hochschule RheinMain wurde mit einem Innovationspreis für seine nachhaltigen Technologien ausgezeichnet.</p>
    </div>
    <div class="flex flex--right"><a class="btn btn--right-link" href="#">Zum Artikel</a></div>
  </div>
  <div class="c-search-list-item"><small class="c-search-list-item__path">/events/tag-der-offenen-tuer</small>
    <p class="h3">Tag der offenen Tür</p>
    <p>
      <div class="o-icon-text">
        <svg class="o-icon-text__icon" viewBox="0 0 16 16" aria-hidden="true" focusable="false" style="pointer-events: none;" width="24px" height="24px">
          <use xlink:href="/Images/svg/sprite.symbol.svg#calendar"></use>
        </svg>
        <div class="o-icon-text__content"><span class="o-icon-text__title">Fr 24.04. - Sa 25.04.2024</span>
        </div>
      </div>
    </p>
    <div class="c-search-list-item__image-wrapper">
      <p>Komm und entdecke die Vielfalt unserer Studiengänge! Erhalte Einblicke in unsere Labore und Projekte.</p>
    </div>
    <div class="flex flex--right"><a class="btn btn--right-link" href="#">Zur Veranstaltung</a></div>
  </div>
  <div class="c-search-list-item"><small class="c-search-list-item__path">/studium/studienberatung</small>
    <p class="h3">Studienberatung</p>
    <p>Die zentrale Studienberatung der Hochschule RheinMain unterstützt Studierende und Studieninteressierte bei allen Fragen rund ums Studium.</p>
    <div class="flex flex--right"><a class="btn btn--right-link" href="#">Zur Seite</a></div>
  </div>
  <div class="c-person-list-item"><small class="c-search-list-item__result">/personen/detail</small>
    <p class="h3">Prof. Dr. Michael Schuster</p><small>Professor für Nachhaltige Baukonzepte</small>
    <div class="c-person-list-item__links">
      <div class="o-icon-text">
        <svg class="o-icon-text__icon" viewBox="0 0 16 16" aria-hidden="true" focusable="false" style="pointer-events: none;" width="24px" height="24px">
          <use xlink:href="/Images/svg/sprite.symbol.svg#e-mail"></use>
        </svg>
        <div class="o-icon-text__content"><span class="o-icon-text__title">michael.schuster@example.com</span>
        </div>
      </div>
      <div class="o-icon-text">
        <svg class="o-icon-text__icon" viewBox="0 0 16 16" aria-hidden="true" focusable="false" style="pointer-events: none;" width="24px" height="24px">
          <use xlink:href="/Images/svg/sprite.symbol.svg#phone"></use>
        </svg>
        <div class="o-icon-text__content"><span class="o-icon-text__title">+491234567891</span>
        </div>
      </div>
    </div>
    <div class="flex flex--right"><a class="btn btn--right-link" href="#">Zur Person</a></div>
  </div>
  <div class="c-search-list-item"><small class="c-search-list-item__path">/events/wissenschaftsforum</small>
    <p class="h3">Wissenschaftsforum 2024</p>
    <p>
      <div class="o-icon-text">
        <svg class="o-icon-text__icon" viewBox="0 0 16 16" aria-hidden="true" focusable="false" style="pointer-events: none;" width="24px" height="24px">
          <use xlink:href="/Images/svg/sprite.symbol.svg#calendar"></use>
        </svg>
        <div class="o-icon-text__content"><span class="o-icon-text__title">Do 15.05.2024</span>
        </div>
      </div>
    </p>
    <div class="c-search-list-item__image-wrapper">
      <p>Das Wissenschaftsforum bietet Vorträge und Workshops zu aktuellen Themen der Forschung und Innovation an der Hochschule RheinMain.</p>
    </div>
    <div class="flex flex--right"><a class="btn btn--right-link" href="#">Zur Veranstaltung</a></div>
  </div>
  <div class="c-search-list-item"><small class="c-search-list-item__path">/campus/hochschulbibliothek</small>
    <p class="h3">Hochschulbibliothek</p>
    <p>Die Hochschulbibliothek bietet umfassende Ressourcen für Studium und Forschung, einschließlich digitaler Medien und individueller Beratung.</p>
    <div class="flex flex--right"><a class="btn btn--right-link" href="#">Zur Seite</a></div>
  </div>
  <div class="c-search-list-item"><small class="c-search-list-item__path">/news/neues-campusprojekt</small>
    <p class="h3">Neues Campusprojekt startet im Sommer</p>
    <p>
      <div class="o-icon-text">
        <svg class="o-icon-text__icon" viewBox="0 0 16 16" aria-hidden="true" focusable="false" style="pointer-events: none;" width="24px" height="24px">
          <use xlink:href="/Images/svg/sprite.symbol.svg#calendar"></use>
        </svg>
        <div class="o-icon-text__content"><span class="o-icon-text__title">Do 22.01.2024</span>
        </div>
      </div>
    </p>
    <div class="c-search-list-item__image-wrapper"><img src="https://placeholder.in2code.de/120x120" width="120" height="120" alt="Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa."/>
      <p>Im Sommer 2024 startet ein neues Projekt auf dem Campus der Hochschule RheinMain. Es wird eine nachhaltige Energieversorgung für den gesamten Campus aufgebaut, die langfristig die CO2-Emissionen reduzieren soll.</p>
    </div>
    <div class="flex flex--right"><a class="btn btn--right-link" href="#">Zum Artikel</a></div>
  </div>
</div>