oa/documentation/elements/forms/inputs/input-focus-documentation.md

Focus Colors

An VInput can have different border colors when focused. Simply add the appropriate color modifier class. Available classes are is-primary-focus, is-success-focus, is-info-focus, is-warning-focus, is-danger-focus.

<template>
  <VField>
    <VControl>
      <VInput
        type="text"
        class="is-primary-focus"
        placeholder="Primary"
      />
    </VControl>
  </VField>
  <VField>
    <VControl>
      <VInput
        type="text"
        class="is-info-focus"
        placeholder="Info"
      />
    </VControl>
  </VField>
  <VField>
    <VControl>
      <VInput
        type="text"
        class="is-success-focus"
        placeholder="Success"
      />
    </VControl>
  </VField>
  <VField>
    <VControl>
      <VInput
        type="text"
        class="is-warning-focus"
        placeholder="Warning"
      />
    </VControl>
  </VField>
  <VField>
    <VControl>
      <VInput
        type="text"
        class="is-danger-focus"
        placeholder="Danger"
      />
    </VControl>
  </VField>
</template>