<label class="specialcheckbox" for="checkbox1">
    <input type='checkbox' name='checkbox' id='checkbox1' value=''>Text<i for="checkbox1"></i>
</label>

<label class="specialcheckboxSwitch" for="specialcheckboxSwitch1">
    <input type='checkbox' name='checkbox' id='specialcheckboxSwitch1' value=''>Text<i for="specialcheckboxSwitch1"></i>
</label>

<div class="fileBody ">
    <input class="[modifier class]" name="input_file" id="input_file" type="file" value="" multiple>
    <span>Dateien auswählen</span>
</div>

<div class="infieldInputGroup">
  <label for="id">Label</label>
  <div class="inputGroup ">
    <input type="text" id="id" />
  </div>
</div><br/>
<strong>Filled</strong><br/><br/>
<div class="infieldInputGroup is-filled">
  <label for="id">Label</label>
  <div class="inputGroup ">
    <input type="text" id="id" value="Text" />
  </div>
</div>

<div class="inputGroup [modifier class]">
  <input type="text" />
</div>

<div class="inputGroup inputGroup--infieldAddon [modifier class]">
  <input type="text" />
  <span class="inputGroup__addon"><i class="icon icon-search"></i></span>
</div>
<br/>
<div class="inputGroup inputGroup--infieldAddon [modifier class]">
  <span class="inputGroup__addon"><i class="icon icon-search"></i></span>
  <input type="text" />
</div>
<br/>
<div class="inputGroup inputGroup--infieldAddon [modifier class]">
  <input type="text" />
  <button type="submit" class="inputGroup__addon"><i class="icon icon-search"></i></button>
</div>
<br/>
<div class="inputGroup inputGroup--infieldAddon [modifier class]">
  <input type="text" />
  <span class="inputGroup__addon inputGroup__addon--clickable"><i class="icon icon-search"></i></span>
</div>

<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>

<label class="specialradiobox" for="specialradioboxradio1">
    <input type='radio' name='specialradiobox' id='specialradioboxradio1' value='' checked='checked'>Radio 1<i for="specialradioboxradio1"></i>
</label>
<label class="specialradiobox" for="specialradioboxradio2">
    <input type='radio' name='specialradiobox' id='specialradioboxradio2' value=''>Radio 2<i for="specialradioboxradio2"></i>
</label>