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.
15 lines (11 loc) • 700 B
Markdown
<h2>Tabs with icons<span class="status approved">Approved</span></h2>
Wrapper element for tabs and content should contain `data-tabs` atribute with uniq value. So it is possible to have more than one tabs&content elements on page.
Tabs can be used with any content of your choice.
`data-section` attribute on tab and content div should match.
You can also use different icons for tabs. The styles are tailored for 4 or less tabs.
There is no styling for content inside. For a search mask example with responsive behavior for content see <a href="https://autoscout24.github.io/showcar-ui/#search-mask-target">here</a>
<style>
#tabs-icons .sample{
background-color: lightblue;
}
</style>