Lunds universitet - Style Guide

Select: Tight 

<div class=" mb-0">
    <select class="form-select">
        <option selected>First</option>
        <option>Second</option>
        <option>Third</option>
    </select>
</div>
 
<div {{#if modifiers}}class="{{modifiers modifiers}}"{{/if}}>
  {{#if label}}
  <label for="{{id}}" class="form-label{{modifiers label-modifiers}}">{{label}}</label>
  {{/if}}
  <select class="form-select" {{#if label}}id="{{id}}"{{/if}}{{#if help}} aria-describedby="{{help.id}}"{{/if}}{{#if multiple}} multiple{{/if}}>
    {{#each options}}
      <option{{#if value}} value="{{value}}"{{/if}}{{#if selected}} selected{{/if}}>{{label}}</option>
    {{/each}}
  </select>
  {{#if help}}
    {{render "@form-help" help}}
  {{/if}}
</div>
 
{
  "label": "",
  "name": "select",
  "id": "select",
  "modifiers": [
    "mb-0"
  ],
  "options": [
    {
      "label": "First",
      "selected": true
    },
    {
      "label": "Second"
    },
    {
      "label": "Third"
    }
  ],
  "label-modifiers": [
    "mb-0"
  ]
}

No notes defined.