Dark theme
For sections of a page that should use the dark theme, simply wrap them in an element with the ds-dark
class:
<div class="ds-dark">
<!-- dark themed elements and components -->
</div>
Demo
A few components inside a common class="ds-dark"
wrapper:
Dark section
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Totam consequuntur distinctio, eaque laborum id nemo nisi atque quis provident doloribus? Aperiam modi recusandae veritatis perspiciatis illum iste explicabo necessitatibus velit?
Sample blockquote:
Very clear, simple, comprehensive. It’s a wonderful voting tool and it definitely influenced positively my decision to vote. Thank you for providing such informative and easy-to-follow pre-voting platform.
Card 1
Lorem ipsum dolor sit amet consectetur adipisicing elit. Quas, quae eos laboriosam vero aliquid quam soluta ad officiis quia omnis molestiae optio dolore nesciunt tempora? Dolor doloremque illum quasi exercitationem?
Card 2
Lorem ipsum dolor sit amet consectetur adipisicing elit. Illo qui delectus eos sapiente. Necessitatibus quis ratione praesentium esse culpa accusantium est, tempore qui deleniti molestias fugit doloremque debitis tempora illum.
Card 3
Lorem ipsum dolor sit amet consectetur adipisicing elit. Esse laboriosam recusandae illo non accusamus vero cupiditate aspernatur incidunt nostrum, commodi quos dicta ducimus quidem debitis et reiciendis dolores minima velit.
Iure explicabo quasi tempore tempora deserunt quaerat dignissimos obcaecati placeat dolor. Nihil! Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quo iure alias ipsum porro ut eaque corrupti, voluptatibus exercitationem iste consequatur?
Column 1 | Column 2 | Column 3 |
---|---|---|
Row 1 / row header | Row 1 / cell 2 | Row 1 / cell 3 |
Row 2 / row header | Row 2 / cell 2 | Row 2 / cell 3 |
Row 3 / row header | Row 3 / cell 2 | Row 3 / cell 3 |
Description list:
- Lorem ipsum dolor sit amet
- Consectetur adipisicing elit. Doloribus enim pariatur nihil id reprehenderit iste voluptatum atque natus beatae debitis inventore cumque quibusdam.
- Doloribus enim pariatur
- Maxime incidunt modi harum? Ipsa ipsum dignissimos repudiandae rerum, recusandae rem accusantium quod omnis minus soluta veniam possimus laudantium dolorum.
- Possimus laudantium dolorum
- Autem perspiciatis laudantium velit magni, repudiandae dolores laboriosam expedita ipsum officia obcaecati, dolor soluta.