Inaktiva komponenter

<button type="button" class="c-btn--large" disabled="">Large sekundär</button>
<button type="button" class="c-btn--medium" disabled="">Medium sekundär</button>
<button type="button" class="c-btn--small" disabled="">Small sekundär</button>

<button type="button" class="c-primary-btn--large" disabled="">Large primär</button>
<button type="button" class="c-primary-btn--medium" disabled="">Medium primär</button>
<button type="button" class="c-primary-btn--small" disabled="">Small primär</button>

<jv-dynamisk-input error-text="Fyll i förnamnet." help-text-ref="helptext" label="Förnamn">
  <jv-help-text slot="helptext">Lite text med beskrivning för hur du ska besvara denna fråga och för att testa hur en lång beskrivning
    ser ut tillsammans med ett felmeddelande ifall man fyllt i fel eller inte alls.
  </jv-help-text>
  <input autocomplete="given-name" disabled="" id="input-text-helptext-disabled" name="Förnamn" required="" type="text">
</jv-dynamisk-input>

<div class="c-select--medium c-select--disabled">
  <label for="field-2_inaktiverad">Välj din favoritfrukt</label>
  <div class="c-input__wrapper">
    <select disabled="" id="field-2_inaktiverad">
      <option></option>
      <option>Ananas</option>
      <option>Apelsin</option>
      <option>Banan</option>
      <option>Blodapelsin</option>
      <option>Clementin</option>
      <option>Dadel</option>
      <option>Kiwifrukt</option>
      <option>Päron</option>
      <option>Äpple</option>
    </select>
    <span class="sjv-i-caret-ner ikon"> </span>
  </div>
</div>

<div class="c-textarea--medium c-textarea--disabled">
  <label for="textarea4">Kommentar</label>
  <textarea class="textarea_exempel" disabled="" id="textarea4" rows="4" wrap="soft"></textarea>
</div>

<div class="c-multiselect--medium c-multiselect--disabled" rel="c-multiselect-js">
  <label class="c-multiselect__label" for="select1" id="multiselect_label">Vilka länder har din hund besökt det senaste året</label>
  <select disabled="" id="select1" multiple="multiple" name="multiselect[]">
    <option selected="selected" value="Norge">Norge</option>
    <option value="Danmark">Danmark</option>
    <option value="Finland">Finland</option>
    <option value="Tyskland">Tyskland</option>
    <option value="Frankrike">Frankrike</option>
    <option value="Vuxen">Ryssland</option>
    <option value="Poland">Polen</option>
    <option value="Italien">Italien</option>
    <option value="Storbritannien">Storbritannien</option>
    <option value="Spanien">Spanien</option>
    <option value="Ukraina">Ukraina</option>
    <option value="Nederländerna">Nederländerna</option>
    <option value="Belgien">Belgien</option>
    <option value="Grekland">Grekland</option>
    <option value="Irland">Irland</option>
    <option value="Portugal">Portugal</option>
    <option value="Island">Island</option>
  </select>
</div>

<fieldset class="c-fieldset--medium c-fieldset--disabled" disabled="">
  <legend>Välj ogräs</legend>
  <div class="c-checkbox--medium">
    <input class="c-checkbox__input" disabled="" id="checkbox_disabled_1" type="checkbox">
    <label for="checkbox_disabled_1">
      <span class="c-checkbox__checkbox">
        <svg focusable="false" height="0.5em" viewBox="0 0 12 10" width="0.625em">
          <polyline points="1.5 6 4.5 9 10.5 1"></polyline>
        </svg>
      </span>
      <span>Kirskål</span>
    </label>
  </div>
  <div class="c-checkbox--medium">
    <input class="c-checkbox__input" disabled="" id="checkbox_disabled_22" type="checkbox">
    <label for="checkbox_disabled_22">
      <span class="c-checkbox__checkbox">
        <svg focusable="false" height="0.5em" viewBox="0 0 12 10" width="0.625em">
          <polyline points="1.5 6 4.5 9 10.5 1"></polyline>
        </svg>
      </span>
      <span>Maskros</span>
    </label>
  </div>
  <div class="c-checkbox--medium">
    <input class="c-checkbox__input" disabled="" id="checkbox_disabled_3" type="checkbox">
    <label for="checkbox_disabled_3">
      <span class="c-checkbox__checkbox">
        <svg focusable="false" height="0.5em" viewBox="0 0 12 10" width="0.625em">
          <polyline points="1.5 6 4.5 9 10.5 1"></polyline>
        </svg>
      </span>
      <span>Smörblomma</span>
    </label>
  </div>
</fieldset>

<div class="c-checkbox--medium">
  <input class="c-checkbox__input" disabled="" id="checkbox_alone" type="checkbox">
  <label for="checkbox_alone">
    <span class="c-checkbox__checkbox">
      <svg focusable="false" height="0.5em" viewBox="0 0 12 10" width="0.625em">
        <polyline points="1.5 6 4.5 9 10.5 1"></polyline>
      </svg>
    </span>
    <span>Jag godkänner villkoren</span>
  </label>
</div>

<fieldset class="c-fieldset--medium c-fieldset--disabled" disabled="">
  <legend>Välj ogräs</legend>
  <div class="c-checkbox--medium">
    <input class="c-checkbox__input" disabled="" id="checkbox_disabled_11" type="checkbox">
    <label for="checkbox_disabled_11">
      <span class="c-checkbox__checkbox">
        <svg focusable="false" height="0.5em" viewBox="0 0 12 10" width="0.625em">
          <polyline points="1.5 6 4.5 9 10.5 1"></polyline>
        </svg>
      </span>
      <span>Kirskål</span>
    </label>
  </div>
  <div class="c-checkbox--medium">
    <input class="c-checkbox__input" disabled="" id="checkbox_disabled_2" type="checkbox">
    <label for="checkbox_disabled_2">
      <span class="c-checkbox__checkbox">
        <svg focusable="false" height="0.5em" viewBox="0 0 12 10" width="0.625em">
          <polyline points="1.5 6 4.5 9 10.5 1"></polyline>
        </svg>
      </span>
      <span>Maskros</span>
    </label>
  </div>
  <div class="c-checkbox--medium">
    <input class="c-checkbox__input" disabled="" id="checkbox_disabled_33" type="checkbox">
    <label for="checkbox_disabled_33">
      <span class="c-checkbox__checkbox">
        <svg focusable="false" height="0.5em" viewBox="0 0 12 10" width="0.625em">
          <polyline points="1.5 6 4.5 9 10.5 1"></polyline>
        </svg>
      </span>
      <span>Smörblomma</span>
    </label>
  </div>
</fieldset>

<div class="c-multitext--medium c-multitext--disabled">
  <label for="multitext-3" id="multitext-disabled-label">Förnamn</label>
  <div class="c-multitext-field" rel="c-multitext-js">
    <div class="tagsContainer">
      <input aria-hidden="true" aria-labelledby="multitext-disabled-label" autocomplete="off" class="c-multitext__valueholder" disabled="" tabindex="-1" type="text">
      <input autocomplete="off" class="c-multitext__textEditor" disabled="" id="multitext-3" placeholder="" type="text">
    </div>
    <div class="select__arrow">
      <span class="sjv-i-multiselect-ikon"></span>
    </div>
  </div>
</div>