-
Notifications
You must be signed in to change notification settings - Fork 2
/
v-textfield.min.css
9 lines (8 loc) · 3.11 KB
/
v-textfield.min.css
1
2
3
4
5
6
7
8
9
/**
* User-friendly text fields in AngularJS
* @version v0.1.4
* @link http://lukaszwatroba.github.io/v-textfield
* @author Łukasz Wątroba <l@lukaszwatroba.com>
* @license MIT License, http://www.opensource.org/licenses/MIT
*/
v-textfield,v-textfield label{display:block}v-textfield label::after{content:attr(hint);display:inline-block;vertical-align:bottom;float:right}v-textfield input,v-textfield textarea{display:block;width:100%}v-textfield ng-message,v-textfield ng-messages{display:block}.vTextfield--default{position:relative;overflow:hidden;margin-bottom:20px}.vTextfield--default label{display:block;margin-bottom:2px}.vTextfield--default label::after{font-size:.707em;font-style:italic;color:#757575}.vTextfield--default input{box-sizing:border-box;border:1px solid #D8D8D8;position:relative;line-height:normal;padding:5px;background-color:#fff;color:inherit;border-radius:2px;-webkit-transition:border-color .25s;transition:border-color .25s}.vTextfield--default input.is-active,.vTextfield--default input:active{outline:0;background-image:none}.vTextfield--default input:focus{outline:0;border-color:#2196F3}.vTextfield--default input.is-disabled,.vTextfield--default input:disabled{cursor:not-allowed;pointer-events:none;opacity:.6}.vTextfield--default ng-messages{margin-top:2px;font-size:.707em;opacity:0;max-height:0;will-change:opacity;-webkit-transition:max-height .25s,opacity .5s;transition:max-height .25s,opacity .5s}.vTextfield--default ng-message{max-width:100%;overflow:hidden;text-overflow:ellipsis;line-height:1.4em;white-space:nowrap;word-wrap:normal;will-change:transform;-webkit-transform:translateY(15px);transform:translateY(15px);-webkit-transition:-webkit-transform .25s;transition:transform .25s}.vTextfield--default::after{content:'';position:absolute;z-index:10;top:36px;right:6px;width:6px;height:6px;pointer-events:none;border-radius:50%;will-change:opacity,transform;opacity:0;-webkit-transform:scale(.2);transform:scale(.2);-webkit-transition:-webkit-transform .25s,opacity .25s;transition:transform .25s,opacity .25s}.vTextfield--default.is-valid::after{background-color:#4CAF50}.vTextfield--default.is-valid ng-messages{color:#2196F3}.vTextfield--default.is-invalid::after{background-color:#F44336}.vTextfield--default.is-invalid ng-messages{color:#F44336}.vTextfield--default.is-blured.has-value::after{opacity:1;-webkit-transform:scale(1);transform:scale(1)}.vTextfield--default.is-blured.has-value ng-messages{opacity:1;max-height:1.4em}.vTextfield--default.is-blured.has-value ng-message{-webkit-transform:translateY(0);transform:translateY(0)}.vTextfield--default.is-blured.is-dirty.is-required.has-noValue::after,form.ng-submitted .vTextfield--default.is-required.has-noValue::after{opacity:1;-webkit-transform:scale(1);transform:scale(1)}.vTextfield--default.is-blured.is-dirty.is-required.has-noValue ng-messages,form.ng-submitted .vTextfield--default.is-required.has-noValue ng-messages{opacity:1;max-height:1.4em}.vTextfield--default.is-blured.is-dirty.is-required.has-noValue ng-message,form.ng-submitted .vTextfield--default.is-required.has-noValue ng-message{-webkit-transform:translateY(0);transform:translateY(0)}