cesardeazevedo / Ng Input
Licence: mit
ng-input - Text Input Effects Angular Directives
Stars: ✭ 60
Projects that are alternatives of or similar to Ng Input
Inputsystem
An efficient and versatile input system for Unity.
Stars: ✭ 1,013 (+1588.33%)
Mutual labels: input
Material Ui Password Field
A password field using Material-UI.
Stars: ✭ 54 (-10%)
Mutual labels: input
Form Js
Easily create web forms. Supports Meteor, AngularJS, React, Polymer and any CSS library, e.g. Bootstrap.
Stars: ✭ 9 (-85%)
Mutual labels: input
Button
An Arduino compatible library to make working with user input easier
Stars: ✭ 27 (-55%)
Mutual labels: input
Bentools Etl
PHP ETL (Extract / Transform / Load) library with SOLID principles + almost no dependency.
Stars: ✭ 45 (-25%)
Mutual labels: input
Inputbaraccessoryview
A simple and easily customizable InputAccessoryView for making powerful input bars with autocomplete and attachments
Stars: ✭ 807 (+1245%)
Mutual labels: input
Awesomevalidation
Android validation library which helps developer boil down the tedious work to three easy steps.
Stars: ✭ 1,093 (+1721.67%)
Mutual labels: input
Insert Text At Cursor
Fast crossbrowser insertion of text at cursor position in a textarea / input
Stars: ✭ 49 (-18.33%)
Mutual labels: input
Angular Datetime Range
📅 Angular directive for datetime range input
Stars: ✭ 27 (-55%)
Mutual labels: input
Svelte Input Mask
Input masking component for Svelte with simple API and rich customization
Stars: ✭ 56 (-6.67%)
Mutual labels: input
Rskgrowingtextview
A light-weight UITextView subclass that automatically grows and shrinks.
Stars: ✭ 820 (+1266.67%)
Mutual labels: input
Pc Optimization Hub
collection of various resources devoted to performance and input lag optimization
Stars: ✭ 55 (-8.33%)
Mutual labels: input
ng-input
Text Input Effects Directives
ng-input is a fork from codrops - Text Input Effects, to work with angular directives.
Demo
Install
bower
Install using bower install ng-input
npm
Install using npm install ng-input
Usage
Include the ngInput
as a dependency for your app.
angular.module('myApp', ['ngInput']);
add the directive to your html.
<ng-input theme='hoshi'></ng-input>
Base Styles
To make it work as the demo page, there is some css properties that you should include.
*, *:after, *:before {
box-sizing: border-box;
}
input{
font-size: 100%
}
and for bigger
.input{
font-size: 150%
}
Options
- theme
- type
- label
- color
- icon
default attributes from default angular input directive
- name
- ng-model
- ng-required
- ng-minlength
- ng-maxlength
- ng-pattern
- ng-change
- ng-trim
Icons
The examples are using material design icons, you should declare icon icon--theme mdi mdi-account
to make it work.
<ng-input theme='fumi' icon='icon icon--fumi mdi mdi-account'></ng-input>
Themes
Our Themes
TODO
Codrops Themes
- Haruki
- Hoshi
- Kuro
- Jiro
- Minoru
- Yoko
- Hideo
- Kyo
- Akira
- Ichiro
- Juro
- Madoka
- Kaede
- Isao
- Manami
- Nariko
- Nao
- Yoshiko
- Shoko
- Chisato
- Makiko
- Sae
- Kozakura
- Fumi
- Ruri
- Kohana
Contributing
Feel free to add your own style.
- Fork it!
- Create your feature branch: git checkout -b my-new-feature
- Commit your changes: git commit -m 'Add some feature'
- Push to the branch: git push origin my-new-feature
- Submit a pull request
Credits
Credit goes to codrops for an AWESOME work with Text Input Effects
License
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].