Component Library

form field 

<div class="form-field ">
    <label class="label  " for="">
    Text label
    
</label>
    <input class="input  " type="text" name="text-input" id="text-id" placeholder="Insert text" />

</div>
 
<div class="form-field {{ class }}">
    {{ render '@label' label }}
    {{#block "content"}}
        {{ render '@input--text' input }}
    {{/block}}
</div>
 
{
  "label": {
    "text": "Text label",
    "input-id": "text-id"
  },
  "input": {
    "type": "text",
    "name": "text-input",
    "id": "text-id",
    "placeholder": "Insert text"
  }
}
  • Content: 
    .form-field {
    &__label {
        display: block;
        margin-bottom: 5px;
    }

    & + .form-field {
        margin-top: 20px;
    }

    & + .button {
        margin-top: 20px;
        align-self: flex-start;
    }
}
  • URL: /components/raw/form-field/form-field.css
  • Filesystem Path: src/02-molecules/form-field/form-field.css
  • Size: 227 Bytes

There are no notes for this item.