rudern.de Webstyleguide

Radio Buttons 

<div class="form styleguide--background">

    <div class="form-item form-item-radios">
        <div class="form-item-radio">
            <label for="radio_1">
                <input type="radio" name="radios" class="form-radio" id="radio_1" value="1" />
                Lorem ipsum dolor
            </label>
        </div>
        <div class="form-item-radio">
            <label for="radio_2">
                <input type="radio" name="radios" class="form-radio" id="radio_2" value="2" />
                Adipiscing elit
            </label>
        </div>
        <div class="form-item-radio">
            <label for="radio_3">
                <input type="radio" name="radios" class="form-radio" id="radio_3" value="3" />
                Sed do eiusmod tempor
            </label>
        </div>
    </div>

</div>
 
<div class="form styleguide--background">

  <div class="form-item form-item-radios">
    {{#radios}}
    <div class="form-item-radio">
      <label for="{{id}}">
        <input type="radio" name="radios" class="form-radio" id="{{id}}" value="{{value}}" />
        {{label}}
      </label>
    </div>
    {{/radios}}
  </div>
  
</div>
 
{
  "radios": [
    {
      "label": "Lorem ipsum dolor",
      "id": "radio_1",
      "value": "1"
    },
    {
      "label": "Adipiscing elit",
      "id": "radio_2",
      "value": "2"
    },
    {
      "label": "Sed do eiusmod tempor",
      "id": "radio_3",
      "value": "3"
    }
  ]
}

No notes defined.