Examples
Default styling
Text
E-Mail
Number
Date
Textarea
Select
Select mit FakeOption
Number
Date
Textarea
Select
Option
:focus
Focus
Text
E-Mail
Number
Date
Textarea
Select
Select mit FakeOption
Number
Date
Textarea
Select
Option
:active
Active
Text
E-Mail
Number
Date
Textarea
Select
Select mit FakeOption
Number
Date
Textarea
Select
Option
:disabled
Disabled
Text
E-Mail
Number
Date
Textarea
Select
Select mit FakeOption
Number
Date
Textarea
Select
Option
:valid
Valid
Text
E-Mail
Number
Date
Textarea
Select
Select mit FakeOption
Number
Date
Textarea
Select
Option
.error
Error
Text
E-Mail
Number
Date
Textarea
Select
Select mit FakeOption
Number
Date
Textarea
Select
Option
Markup
<strong>Text</strong><br/>
<input type="text" class='[modifier class]' value="Text" /><br/>
<strong>E-Mail</strong><br/>
<input type="email" class='[modifier class]' value="info@dc.ag" /><br/>
<strong>Number</strong><br/>
<input type="number" class='[modifier class]' value="123" /><br/>
<strong>Date</strong><br/>
<input type="date" class='[modifier class]' value="2025-01-01" /><br/>
<strong>Textarea</strong><br/>
<textarea class='[modifier class]'>Text</textarea><br/>
<strong>Select</strong><br/>
<div class="selectBody">
<select class='[modifier class]'>
<option disabled selected>Choose</option>
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
</select>
</div>
<strong>Select mit FakeOption</strong><br/>
<div class="selectBody">
<div class="selectBody__fakeOption"">Option</div>
</div>
Source:
build/doc/doc.css
, line 3577