Validation

Give textual form controls like `<input>`s and `<textarea>`s an upgrade with custom styles, sizing, focus states, and more.

Basic <input>

  • Validation 1
<div class="form">
  <div class="field is-invalid">
    <label for="input1" class="label">Email address:</label>
    <input type="email" class="input"
           id="input1" placeholder="name@example.com"/>
    <p class="invalid-feedback">Please provide a valid email.</p>
  </div>
</div>
@use '~/styles/app.scss' as app;

$form: app.get-theme(app.$theme, 'components.form');

@include app.generate-component(
  $form,
  'form',
  app.$config,
  app.$theme
);