CSS Input

Usage no npm install needed!

<script type="module">
  import NuCssInput from 'https://cdn.skypack.dev/@_nu/css-input';



npm package npm downloads jsdelivr github
npm package npm downloads jsdelivr github

English | 简体中文


$ yarn add @_nu/css-input


├── index.css                // base style
└── skins
    └── default
        ├── block.css        // block input
        ├── capsule.css      // capsule input 💊
        ├── disabeld.css     // disabeld
        ├── focus.css        // on focus
        ├── large.css        // large input
        ├── line.css         // line input
        └── small.css        // small input

Core API

Selector Function
input.nu_input base selector
.nu_input input status of disabled
<input class="nu_input" type="text" placeholder="Enter" />
<label class="nu_input">
  <input type="text" placeholder="Enter" />

For the sake of flexibility these two ways are equivalent.

Skins API

Selector Function skin
input:disabled disabled input disabled.css
input:focus focus input focus.css
._l large input large.css
._s small input small.css
._capsule variant of input capsule.css
._block block input block.css
._line line of disabled line.css

All the skin api is base on the core api.