ng-input is a fork from codrops - Text Input Effects, to work with angular directives.

Demo

Demo

Install

####Install using bower

bower install ng-input

####Install using npm

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](http://tympanus.net/Development/TextInputEffects/)

- 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.

1. Fork it!
2. Create your feature branch: git checkout -b my-new-feature
3. Commit your changes: git commit -m 'Add some feature'
4. Push to the branch: git push origin my-new-feature
5. Submit a pull request

# Credits

Credit goes to [codrops](http://tympanus.net/codrops/) for an **AWESOME** work with [Text Input Effects](https://github.com/codrops/TextInputEffects)

[check their article](http://tympanus.net/codrops/2015/01/08/inspiration-text-input-effects/)


# License

[LICENSE](./LICENSE)