0.1.3 • Published 1 year ago
nuxt-float-label v0.1.3
Nuxt Float Label
Developed by FMCX.
Features
- Apply float labels automatically to your inputs, selects and textareas
- Works on Nuxt 3
- Fully css customizable
Quick Setup
- Add
nuxt-float-label
dependency to your project
# Using npm
npm i -D nuxt-float-label
- Add
nuxt-float-label
to themodules
section ofnuxt.config.js
{
modules: [
'nuxt-float-label'
]
}
Access the demo website.
Props
Name | Type | Description | Required |
---|---|---|---|
label | String | Overrides placeholder | No |
label-class | String | Attribute a custom class to the label | No |
dispatch | Boolean | Shows float label on mount | No |
Configs
To use on nuxt.config.ts
Name | Type | Description |
---|---|---|
useCss | Boolean | Choose to use the default css or a custom one |
Example
nuxtFloatLabel: {
useCss: false
}
Css classes
Name | Description |
---|---|
fl-wrapper | Wrapper class |
fl-label | Label class |
fl-on-focus | Label on focus and blur event |
fl-on-input | Label on input event |