mirror of
https://git.hmsn.ink/kospo/svcm/oa.git
synced 2026-03-20 06:13:35 +09:00
first
This commit is contained in:
61
documentation/switch-block/switch-block-documentation.md
Normal file
61
documentation/switch-block/switch-block-documentation.md
Normal file
@@ -0,0 +1,61 @@
|
||||
### VSwitchBlock
|
||||
|
||||
Vuero provides nicely styled switch checkboxes when you need to
|
||||
display such control in yoour forms. Vuero `VSwitchBlock` component have
|
||||
several color modififers. Available modifiers are `primary`, `success`,
|
||||
`info`, `warning` and `danger`.
|
||||
Please refer to the markup for more details about usage.
|
||||
|
||||
<!--code-->
|
||||
|
||||
```vue
|
||||
<template>
|
||||
<VField horizontal>
|
||||
<VControl subcontrol class="mr-2">
|
||||
<VSwitchBlock />
|
||||
</VControl>
|
||||
<VControl subcontrol class="mr-2">
|
||||
<VSwitchBlock color="primary" :model-value="true" />
|
||||
</VControl>
|
||||
<VControl subcontrol class="mr-2">
|
||||
<VSwitchBlock color="success" :model-value="true" />
|
||||
</VControl>
|
||||
<VControl subcontrol class="mr-2">
|
||||
<VSwitchBlock color="info" :model-value="true" />
|
||||
</VControl>
|
||||
<VControl subcontrol class="mr-2">
|
||||
<VSwitchBlock color="warning" :model-value="true" />
|
||||
</VControl>
|
||||
<VControl subcontrol class="mr-2">
|
||||
<VSwitchBlock color="danger" :model-value="true" />
|
||||
</VControl>
|
||||
</VField>
|
||||
</template>
|
||||
```
|
||||
|
||||
<!--/code-->
|
||||
|
||||
<!--example-->
|
||||
|
||||
<VField horizontal>
|
||||
<VControl subcontrol class="mr-2">
|
||||
<VSwitchBlock />
|
||||
</VControl>
|
||||
<VControl subcontrol class="mr-2">
|
||||
<VSwitchBlock color="primary" :model-value="true" />
|
||||
</VControl>
|
||||
<VControl subcontrol class="mr-2">
|
||||
<VSwitchBlock color="success" :model-value="true" />
|
||||
</VControl>
|
||||
<VControl subcontrol class="mr-2">
|
||||
<VSwitchBlock color="info" :model-value="true" />
|
||||
</VControl>
|
||||
<VControl subcontrol class="mr-2">
|
||||
<VSwitchBlock color="warning" :model-value="true" />
|
||||
</VControl>
|
||||
<VControl subcontrol class="mr-2">
|
||||
<VSwitchBlock color="danger" :model-value="true" />
|
||||
</VControl>
|
||||
</VField>
|
||||
|
||||
<!--/example-->
|
||||
Reference in New Issue
Block a user