showcar-ui
Version:
Showcar-ui is the pattern library that is used to build the frontend of AutoScout24. It provides CSS classes, custom elements and components.
47 lines (43 loc) • 1.86 kB
HTML
<div class="sc-teaser">
<div class="sc-teaser__item">
<input id="sc-teaser" type="checkbox" class="sc-teaser__toggle">
<h3 class="sc-teaser__clickable">
<label for="sc-teaser" class="sc-teaser__label">
<span class="sc-teaser__category sc-font-s sc-font-bold sc-font-uppercase">service</span>
<span class="sc-teaser__title sc-font-m sc-font-bold">Agos</span>
<img class="sc-teaser__service-logo" src="/showcar-ui/docs/assets/images/showcar-agos.png">
</label>
</h3>
<div class="sc-teaser__content">
<img src="/showcar-ui/docs/assets/images/showcar-agos-tmp.png">
</div>
</div>
<!-- -->
<div class="sc-teaser__item">
<input id="sc-teaser-2" type="checkbox" class="sc-teaser__toggle">
<h3 class="sc-teaser__clickable">
<label for="sc-teaser-2" class="sc-teaser__label">
<span class="sc-teaser__category sc-font-s sc-font-bold sc-font-uppercase">il prestito</span>
<span class="sc-teaser__title sc-font-m sc-font-bold">Findomestic</span>
</label>
</h3>
<div class="sc-teaser__content">
Findomestic è flessibile come le tue esigenze e con firma digitale.
<br />
<a href="#link-link">Go to link</a>
</div>
</div>
<!-- -->
<div class="sc-teaser__item">
<input id="sc-teaser-3" type="checkbox" class="sc-teaser__toggle">
<h3 class="sc-teaser__clickable">
<label for="sc-teaser-3" class="sc-teaser__label">
<span class="sc-teaser__category sc-font-s sc-font-bold sc-font-uppercase">Category title</span>
<span class="sc-teaser__title sc-font-m sc-font-bold">Estimate your auto</span>
</label>
</h3>
<div class="sc-teaser__content">
Hello, I am an external service too!
</div>
</div>
</div>