Create a default input by adding the classes .input, .is-default to an input element. You can also make its edges rounded by adding the class .is-rounded.
Use validation inputs markup and toggle the .has-success, .has-warning, .has-error validation classes on the .control parent element to change the input states.
Change an input state to loadin by adding the .is-loading class to the .control wrapper element.
Disable an input by adding the attribute disabled to it.
Make an input readonly by adding the attribute readonly to it.
You can build more complex variations using the .has-addon modifier on .control elements. Here are some examples you can copy and adapt to your needs.
Nephos ships with its own html5 select box. You won't need to use any kind of plugin if you don't want to. Selects have a few customization options like adding an icon or a loading indicator. Check the Html markup for more details about the code.
Chosen select boxes offer even more flexibility than native selects. They are optimized for huge options list and display a search field when there are 6 ore more options.
Nephos comes with several autocomplete examples powered by the easyAutocomplete plugin. Refer to the template Documentation for more details about usage.
easyAutocomplete lets you create more complex examples with custom templating. Check the existing examples and refer to the template Documentation for more details about usage.
Nephos ships with a spinner input component based on the spinnerjs library initially for Bootstrap 4 but adapted for Bulma. The plugin supports native input attributes such as value, min, max and step.
Nephos ships with a lightweight and simple to use datepicker. You can initialize it on a simple text input. Refer to the template Documentation for more details about usage.
A simple product card featuring card and wishlist interations, as well as a possibility to zoom the image by clicking on it, achieved with the zoomjs plugin.
A streched variation of the product card, ideal for displaying featured products.
Small cards with a fancy look that can be used to display small amounts of information, like the achievement example.
A basic user profile card that you can extend to suit your needs, depending on your requirements.
