HTML-Prototype der OTH-Regensburg

<div class="c-teaserbox-slider c-teaserbox-slider--event">
  <div class="c-teaserbox-slider__header o-flex-line o-flex-line--between o-flex-line--items-end">
    <h2 class="c-teaserbox-slider__headline">Veranstaltungen</h2>
    <div class="c-slider-controls o-flex-line">
      <button class="btn btn--arrow btn--arrow-left c-slider-controls__button c-slider-controls__button--prev" title="Previous slide">
        <svg viewBox="0 0 13.455 24.081" role="img" aria-hidden="true" focusable="false">
          <use xlink:href="Images/svg/sprite.symbol.svg#icon-chevron-left"></use>
        </svg>
      </button>
      <button class="btn btn--arrow btn--arrow-right c-slider-controls__button c-slider-controls__button--next" title="Next slide">
        <svg viewBox="0 0 13.455 24.081" role="img" aria-hidden="true" focusable="false">
          <use xlink:href="Images/svg/sprite.symbol.svg#icon-chevron-right"></use>
        </svg>
      </button>
    </div>
  </div>
  <div class="c-teaserbox-slider__slides-container">
    <div class="c-teaserbox-slider__slides">
      <div class="c-teaserbox-slider__slide"><a class="c-teaserbox__link" href="#" title="Details zur Veranstaltung &quot;Unser Ziel: 100% Präsenzvorlesungen&quot; anzeigen">
          <div class="c-teaserbox c-teaserbox--event">
            <div class="c-teaserbox__content-wrap">
              <div class="c-teaserbox__event-date"><span class="c-teaserbox__event-day">10</span><span class="c-teaserbox__event-month">Jan</span>
              </div>
              <div class="c-teaserbox__event-details">
                <h3 class="c-teaserbox__title">Unser Ziel: 100% Präsenzvorlesungen</h3>
                <div class="c-teaserbox__button"><span class="btn btn--icon-left">
                    <svg viewBox="0 0 38.774 38" role="img" aria-hidden="true" focusable="false">
                      <use xlink:href="Images/svg/sprite.symbol.svg#icon-location"></use>
                    </svg><span class="btn__text">Veranstaltungsort</span></span></div>
              </div>
            </div>
          </div></a>
      </div>
      <div class="c-teaserbox-slider__slide"><a class="c-teaserbox__link" href="#" title="Details zur Veranstaltung &quot;Bayerns Top-Geeks&quot; anzeigen">
          <div class="c-teaserbox c-teaserbox--event">
            <div class="c-teaserbox__content-wrap">
              <div class="c-teaserbox__event-date"><span class="c-teaserbox__event-day">11</span><span class="c-teaserbox__event-month">Jan</span>
              </div>
              <div class="c-teaserbox__event-details">
                <h3 class="c-teaserbox__title">Bayerns Top-Geeks</h3>
                <div class="c-teaserbox__button"><span class="btn btn--icon-left">
                    <svg viewBox="0 0 38.774 38" role="img" aria-hidden="true" focusable="false">
                      <use xlink:href="Images/svg/sprite.symbol.svg#icon-location"></use>
                    </svg><span class="btn__text">Veranstaltungsort</span></span></div>
              </div>
            </div>
          </div></a>
      </div>
      <div class="c-teaserbox-slider__slide"><a class="c-teaserbox__link" href="#" title="Details zur Veranstaltung &quot;Dies ist ein Typoblindtext&quot; anzeigen">
          <div class="c-teaserbox c-teaserbox--event">
            <div class="c-teaserbox__content-wrap">
              <div class="c-teaserbox__event-date"><span class="c-teaserbox__event-day">12</span><span class="c-teaserbox__event-month">Jan</span>
              </div>
              <div class="c-teaserbox__event-details">
                <h3 class="c-teaserbox__title">Dies ist ein Typoblindtext</h3>
                <div class="c-teaserbox__button"><span class="btn btn--icon-left">
                    <svg viewBox="0 0 38.774 38" role="img" aria-hidden="true" focusable="false">
                      <use xlink:href="Images/svg/sprite.symbol.svg#icon-location"></use>
                    </svg><span class="btn__text">Veranstaltungsort</span></span></div>
              </div>
            </div>
          </div></a>
      </div>
      <div class="c-teaserbox-slider__slide"><a class="c-teaserbox__link" href="#" title="Details zur Veranstaltung &quot;Überall dieselbe alte Leier. Das Layout&quot; anzeigen">
          <div class="c-teaserbox c-teaserbox--event">
            <div class="c-teaserbox__content-wrap">
              <div class="c-teaserbox__event-date"><span class="c-teaserbox__event-day">13</span><span class="c-teaserbox__event-month">Jan</span>
              </div>
              <div class="c-teaserbox__event-details">
                <h3 class="c-teaserbox__title">Überall dieselbe alte Leier. Das Layout</h3>
                <div class="c-teaserbox__button"><span class="btn btn--icon-left">
                    <svg viewBox="0 0 38.774 38" role="img" aria-hidden="true" focusable="false">
                      <use xlink:href="Images/svg/sprite.symbol.svg#icon-location"></use>
                    </svg><span class="btn__text">Veranstaltungsort</span></span></div>
              </div>
            </div>
          </div></a>
      </div>
      <div class="c-teaserbox-slider__slide"><a class="c-teaserbox__link" href="#" title="Details zur Veranstaltung &quot;Li Europan lingues es membres del sam familie&quot; anzeigen">
          <div class="c-teaserbox c-teaserbox--event">
            <div class="c-teaserbox__content-wrap">
              <div class="c-teaserbox__event-date"><span class="c-teaserbox__event-day">14</span><span class="c-teaserbox__event-month">Jan</span>
              </div>
              <div class="c-teaserbox__event-details">
                <h3 class="c-teaserbox__title">Li Europan lingues es membres del sam familie</h3>
                <div class="c-teaserbox__button"><span class="btn btn--icon-left">
                    <svg viewBox="0 0 38.774 38" role="img" aria-hidden="true" focusable="false">
                      <use xlink:href="Images/svg/sprite.symbol.svg#icon-location"></use>
                    </svg><span class="btn__text">Veranstaltungsort</span></span></div>
              </div>
            </div>
          </div></a>
      </div>
    </div>
  </div>
</div>