mirror of
https://git.hmsn.ink/kospo/svcm/oa.git
synced 2026-03-20 02:32:29 +09:00
first
This commit is contained in:
110
documentation/elements/forms/inputs/input-focus-documentation.md
Normal file
110
documentation/elements/forms/inputs/input-focus-documentation.md
Normal file
@@ -0,0 +1,110 @@
|
||||
### 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`.
|
||||
|
||||
<!--code-->
|
||||
|
||||
```vue
|
||||
<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>
|
||||
```
|
||||
|
||||
<!--/code-->
|
||||
|
||||
<!--example-->
|
||||
|
||||
<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>
|
||||
|
||||
<!--/example-->
|
||||
Reference in New Issue
Block a user