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.
52 lines (51 loc) • 1.93 kB
Markdown
<h2>Success/Warning/Error/Info<span class="status approved">Approved</span></h2>
<div class="ndpl-component__colors ndpl-cf">
<div class="ndpl-component__color-container">
<div class="ndpl-component__color" style="background-color: #00d0b2">
<div>#00d0b2<br />rgb(217, 26, 42)<br />$success-100</div>
</div>
</div>
<div class="ndpl-component__color-container">
<div class="ndpl-component__color" style="background-color: #ccffe2">
<div class="ndpl-dark-text">
#ccffe2<br />rgb(153, 23, 29)<br />$success-20
</div>
</div>
</div>
<div class="ndpl-component__color-container">
<div class="ndpl-component__color" style="background-color: #f2ca26">
<div>#f2ca26<br />rgb(255, 221, 220)<br />$warning-100</div>
</div>
</div>
<div class="ndpl-component__color-container">
<div class="ndpl-component__color" style="background-color: #fef9d3">
<div class="ndpl-dark-text">
#fef9d3<br />rgb(33, 115, 6)<br />$warning-20
</div>
</div>
</div>
<div class="ndpl-component__color-container">
<div class="ndpl-component__color" style="background-color: #e74b3c">
<div>#e74b3c<br />rgb(35, 84, 19)<br />$error-100</div>
</div>
</div>
<div class="ndpl-component__color-container">
<div class="ndpl-component__color" style="background-color: #fde7d8">
<div class="ndpl-dark-text">
#fde7d8<br />rgb(230, 245, 207)<br />$error-20
</div>
</div>
</div>
<div class="ndpl-component__color-container">
<div class="ndpl-component__color" style="background-color: #237fff">
<div>#237fff<br />rgb(153, 66, 0)<br />$info-100</div>
</div>
</div>
<div class="ndpl-component__color-container">
<div class="ndpl-component__color" style="background-color: #d3ecff">
<div class="ndpl-dark-text">
#d3ecff<br />rgb(128, 55, 0)<br />$info-20
</div>
</div>
</div>
</div>