• Home
• com.jwebmp.plugins.forms
• jwebmp-text-input-effects
• 1.0.13.4-jre12
• source code
• set2.min.css

×

Project download

Many resources are needed to download a project. Please understand that we have to compensate our server costs. Thank you in advance.
Project price only 1 $

You can buy this project and download/modify it how often you want.

META-INF.resources.textinputeffects.css.set2.min.css Maven / Gradle / Ivy

@-webkit-keyframes anim-chisato-1{0%,70%{-webkit-transform:translate3d(0,3em,0);transform:translate3d(0,3em,0)}71%,to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@-webkit-keyframes anim-chisato-2{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}70%,71%{-webkit-transform:translate3d(0,125%,0);transform:translate3d(0,125%,0);opacity:0;-webkit-animation-timing-function:ease-out}to{color:transparent;-webkit-transform:translate3d(0,200%,0);transform:translate3d(0,200%,0)}}@keyframes anim-chisato-1{0%,70%{-webkit-transform:translate3d(0,3em,0);transform:translate3d(0,3em,0)}71%,to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes anim-chisato-2{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}70%,71%{-webkit-transform:translate3d(0,125%,0);transform:translate3d(0,125%,0);opacity:0;-webkit-animation-timing-function:ease-out}to{color:transparent;-webkit-transform:translate3d(0,200%,0);transform:translate3d(0,200%,0)}}@-webkit-keyframes anim-fumi-1{50%{-webkit-transform:translate3d(0,3em,0);transform:translate3d(0,3em,0)}51%{-webkit-transform:translate3d(0,-3em,0) scale3d(.85,.85,1);transform:translate3d(0,-3em,0) scale3d(.85,.85,1)}to{color:#a3a3a3;-webkit-transform:translate3d(0,-1.1em,0) scale3d(.85,.85,1);transform:translate3d(0,-1.1em,0) scale3d(.85,.85,1)}}@keyframes anim-fumi-1{50%{-webkit-transform:translate3d(0,3em,0);transform:translate3d(0,3em,0)}51%{-webkit-transform:translate3d(0,-3em,0) scale3d(.85,.85,1);transform:translate3d(0,-3em,0) scale3d(.85,.85,1)}to{color:#a3a3a3;-webkit-transform:translate3d(0,-1.1em,0) scale3d(.85,.85,1);transform:translate3d(0,-1.1em,0) scale3d(.85,.85,1)}}@-webkit-keyframes anim-fumi-2{50%{opacity:1;-webkit-transform:translate3d(0,-3em,0);transform:translate3d(0,-3em,0)}50.25%{opacity:0;-webkit-transform:translate3d(0,-3em,0);transform:translate3d(0,-3em,0)}50.75%{opacity:0;-webkit-transform:translate3d(0,3em,0);transform:translate3d(0,3em,0)}51%{opacity:1;-webkit-transform:translate3d(0,3em,0);transform:translate3d(0,3em,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);color:#00aeef}}@keyframes anim-fumi-2{50%{opacity:1;-webkit-transform:translate3d(0,-3em,0);transform:translate3d(0,-3em,0)}50.25%{opacity:0;-webkit-transform:translate3d(0,-3em,0);transform:translate3d(0,-3em,0)}50.75%{opacity:0;-webkit-transform:translate3d(0,3em,0);transform:translate3d(0,3em,0)}51%{opacity:1;-webkit-transform:translate3d(0,3em,0);transform:translate3d(0,3em,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);color:#00aeef}}.input{position:relative;z-index:1;display:inline-block;margin:1em;max-width:350px;width:calc(100% - 2em);vertical-align:top}.input__field{position:relative;display:block;float:right;padding:.8em;width:60%;border:0;border-radius:0;background:#f0f0f0;color:#aaa;font-weight:400;font-family:"Avenir Next","Helvetica Neue",Helvetica,Arial,sans-serif;-webkit-appearance:none}.input__field:focus{outline:0}.input__label{display:inline-block;float:right;padding:0 1em;width:40%;color:#696969;font-weight:700;font-size:70.25%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.input__label-content{position:relative;display:block;padding:1.6em 0;width:100%}.graphic{position:absolute;top:0;left:0;fill:none}.icon{color:#ddd;font-size:150%}.input--manami{overflow:hidden}.input__field--manami{width:100%;background:0 0;padding:.5em;margin-bottom:2em;color:#f9f7f6;z-index:100;opacity:0}.input__label--manami{width:100%;position:absolute;text-align:left;padding:.5em 0;pointer-events:none;font-size:1em}.input__label--manami::after,.input__label--manami::before{content:'';position:absolute;width:100%;left:0}.input__label--manami::before{height:100%;background:#a8a8a8;top:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);-webkit-transition:-webkit-transform .2s;transition:transform .2s}.input__label--manami::after{height:2px;background:#a8a8a8;top:100%;-webkit-transition:opacity .2s;transition:opacity .2s}.input__label-content--manami{padding:0;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-transition:-webkit-transform .2s,color .2s;transition:transform .2s,color .2s}.input--filled .input__field--manami,.input__field--manami:focus{opacity:1;-webkit-transition:opacity 0s .2s;transition:opacity 0s .2s}.input--filled .input__field--manami,.input__field--manami:focus,.input__label--manami::after,.input__label--manami::before,.input__label-content--manami{-webkit-transition-timing-function:cubic-bezier(0,.25,.5,1);transition-timing-function:cubic-bezier(0,.25,.5,1)}.input--filled .input__label--manami::before,.input__field--manami:focus+.input__label--manami::before{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.input--filled .input__label--manami::after,.input__field--manami:focus+.input__label--manami::after{opacity:0}.input--filled .input__label--manami .input__label-content--manami,.input__field--manami:focus+.input__label--manami .input__label-content--manami{color:#cbc4c6;-webkit-transform:translate3d(0,2.1em,0) scale3d(.65,.65,1);transform:translate3d(0,2.1em,0) scale3d(.65,.65,1)}.input--nariko{overflow:hidden;padding-top:2em}.input__field--nariko{width:100%;background:0 0;opacity:0;padding:.35em;z-index:100;color:#f18292}.input__label--nariko{width:100%;bottom:0;position:absolute;pointer-events:none;text-align:left;color:#8e9191;padding:0 .5em}.input__label--nariko::before,.input__label-content--nariko{-webkit-transition-timing-function:cubic-bezier(.7,0,.3,1);transition-timing-function:cubic-bezier(.7,0,.3,1)}.input__label--nariko::before{content:'';position:absolute;width:100%;height:4em;top:100%;left:0;background:#fff;border-top:4px solid #9b9f9f;-webkit-transform:translate3d(0,-3px,0);transform:translate3d(0,-3px,0);-webkit-transition:-webkit-transform .4s;transition:transform .4s}.input__label-content--nariko{padding:.5em 0;-webkit-transform-origin:0% 100%;transform-origin:0% 100%;-webkit-transition:-webkit-transform .4s,color .4s;transition:transform .4s,color .4s}.input--filled .input__field--nariko,.input__field--nariko:focus{cursor:text;opacity:1;-webkit-transition:opacity 0s .4s;transition:opacity 0s .4s}.input--filled .input__label--nariko::before,.input__field--nariko:focus+.input__label--nariko::before{-webkit-transition-delay:.05s;transition-delay:.05s;-webkit-transform:translate3d(0,-3.3em,0);transform:translate3d(0,-3.3em,0)}.input--filled .input__label-content--nariko,.input__field--nariko:focus+.input__label--nariko .input__label-content--nariko{color:#6b6e6e;-webkit-transform:translate3d(0,-3.3em,0) scale3d(.81,.81,1);transform:translate3d(0,-3.3em,0) scale3d(.81,.81,1)}.input--nao{overflow:hidden;padding-top:1em}.input__field--nao{padding:.5em 0 .25em;width:100%;background:0 0;color:#9da8b2;font-size:1.25em}.input__label--nao{position:absolute;top:.95em;font-size:.85em;left:0;display:block;width:100%;text-align:left;padding:0;pointer-events:none;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-transition:-webkit-transform .2s .15s,color 1s;transition:transform .2s .15s,color 1s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.graphic--nao{stroke:#92989e;pointer-events:none;-webkit-transition:-webkit-transform .7s,stroke .7s;transition:transform .7s,stroke .7s;-webkit-transition-timing-function:cubic-bezier(0,.25,.5,1);transition-timing-function:cubic-bezier(0,.25,.5,1)}.input--filled .input__label--nao,.input__field--nao:focus+.input__label--nao{color:#333;-webkit-transform:translate3d(0,-1.25em,0) scale3d(.75,.75,1);transform:translate3d(0,-1.25em,0) scale3d(.75,.75,1)}.input--filled .graphic--nao,.input__field--nao:focus~.graphic--nao{stroke:#333;-webkit-transform:translate3d(-66.6%,0,0);transform:translate3d(-66.6%,0,0)}.input--shoko{overflow:hidden;padding-bottom:2.5em}.input__field--shoko{padding:0;margin-top:1.2em;width:100%;background:0 0;color:#fff;font-size:1.55em}.input__label--shoko{position:absolute;top:2em;left:0;display:block;width:100%;text-align:left;padding:0;text-transform:uppercase;letter-spacing:1px;color:#a09c9c;pointer-events:none;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-transition:-webkit-transform .2s .1s,color .3s;transition:transform .2s .1s,color .3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.graphic--shoko{stroke:#a09c9c;pointer-events:none;stroke-width:2px;top:1.25em;bottom:0;height:3.275em;-webkit-transition:-webkit-transform .7s,stroke .7s;transition:transform .7s,stroke .7s;-webkit-transition-timing-function:cubic-bezier(0,.25,.5,1);transition-timing-function:cubic-bezier(0,.25,.5,1)}.input--filled .input__label--shoko,.input__field--shoko:focus+.input__label--shoko{color:#a58282;-webkit-transform:translate3d(0,3.5em,0) scale3d(.85,.85,1);transform:translate3d(0,3.5em,0) scale3d(.85,.85,1)}.input--filled .graphic--shoko,.input__field--shoko:focus~.graphic--shoko{stroke:#a58282;-webkit-transform:translate3d(-66.6%,0,0);transform:translate3d(-66.6%,0,0)}.input__field--yoshiko{width:100%;background-color:#d0d1d0;border:2px solid transparent;-webkit-transition:background-color .25s,border-color .25s;transition:background-color .25s,border-color .25s}.input__label--yoshiko,.input__label-content--yoshiko{-webkit-transition:-webkit-transform .25s;transition:transform .25s;-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out}.input__label--yoshiko{width:100%;text-align:left;position:absolute;bottom:100%;pointer-events:none;overflow:hidden;-webkit-transform:translate3d(0,3em,0);transform:translate3d(0,3em,0);padding:0 1.25em}.input__label-content--yoshiko{color:#8b8c8b;padding:.25em 0}.input__label-content--yoshiko::after{content:attr(data-content);position:absolute;font-weight:800;bottom:100%;left:0;height:100%;width:100%;color:#a3d39c;padding:.25em 0;text-transform:uppercase;letter-spacing:1px;font-size:.85em}.input--filled .input__label--yoshiko,.input__field--yoshiko:focus+.input__label--yoshiko{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.input--filled .input__label-content--yoshiko,.input__field--yoshiko:focus+.input__label--yoshiko .input__label-content--yoshiko{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}.input--filled .input__field--yoshiko,.input__field--yoshiko:focus+.input__field--yoshiko{background-color:transparent;border-color:#a3d39c}.input--chisato{padding-top:1em}.input__field--chisato{width:100%;padding:.8em .5em;background:0 0;border:2px solid;color:#b5b5b5;-webkit-transition:border-color .25s;transition:border-color .25s}.input__label--chisato{width:100%;position:absolute;top:0;text-align:left;overflow:hidden;padding:0;pointer-events:none;-webkit-transform:translate3d(0,3em,0);transform:translate3d(0,3em,0)}.input__label-content--chisato{padding:0 1em;font-weight:400;color:#b5b5b5}.input__label-content--chisato::after{content:attr(data-content);position:absolute;top:-200%;left:0;color:#da6484;font-weight:800}.input--filled .input__field--chisato,.input__field--chisato:focus{border-color:#da6484}.input--filled .input__label--chisato,.input__field--chisato:focus+.input__label--chisato{-webkit-animation:anim-chisato-1 .25s forwards;animation:anim-chisato-1 .25s forwards}.input--filled .input__label-content--chisato,.input__field--chisato:focus+.input__label--chisato .input__label-content--chisato{-webkit-animation:anim-chisato-2 .25s forwards ease-in;animation:anim-chisato-2 .25s forwards ease-in}.input--kozakura{overflow:hidden;padding-bottom:1em}.input__field--kozakura{padding:.25em .5em;margin-top:1.25em;width:100%;background:0 0;color:#2f3238;font-size:1.55em;opacity:0}.input__label--kozakura,.input__label-content--kozakura{-webkit-transition:-webkit-transform .3s;transition:transform .3s}.input__label--kozakura{width:100%;text-align:left;position:absolute;top:1em;pointer-events:none;overflow:hidden;-webkit-transform:translate3d(1em,2.75em,0);transform:translate3d(1em,2.75em,0);padding:0 .25em}.input__label-content--kozakura{color:#a4a5a6;padding:.4em 0 .25em}.input__label-content--kozakura::after{content:attr(data-content);position:absolute;font-weight:800;top:100%;left:0;height:100%;width:100%;color:#fff;padding:.25em 0;text-transform:uppercase;letter-spacing:1px;font-size:.85em}.graphic--kozakura{fill:#494e57;pointer-events:none;top:1em;bottom:0;height:4.5em;z-index:-1;-webkit-transition:-webkit-transform .7s,fill .7s;transition:transform .7s,fill .7s;-webkit-transition-timing-function:cubic-bezier(0,.25,.5,1);transition-timing-function:cubic-bezier(0,.25,.5,1)}.input--filled .input__field--kozakura,.input__field--kozakura:focus{-webkit-transition:opacity 0s .35s;transition:opacity 0s .35s;opacity:1}.input--filled .input__label--kozakura,.input__field--kozakura:focus+.input__label--kozakura{-webkit-transition-delay:.15s;transition-delay:.15s;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.input--filled .input__label-content--kozakura,.input__field--kozakura:focus+.input__label--kozakura .input__label-content--kozakura{-webkit-transition-delay:.15s;transition-delay:.15s;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}.input--filled .graphic--kozakura,.input__field--kozakura:focus~.graphic--kozakura{fill:#fff;-webkit-transform:translate3d(-66.6%,0,0);transform:translate3d(-66.6%,0,0)}.input--makiko{overflow:hidden;background:#cbcbcb}.input__field--makiko{width:100%;background:0 0;color:#797693;z-index:10;font-weight:500}.input__label--makiko{position:absolute;width:100%;text-align:left;pointer-events:none;color:#fff}.input__label--makiko::before,.input__label-content--makiko{-webkit-transition:-webkit-transform .4s cubic-bezier(.7,0,.3,1);transition:transform .4s cubic-bezier(.7,0,.3,1)}.input__label--makiko::before{content:'';position:absolute;width:30px;height:30px;top:45%;left:20px;background:url(../img/search.svg) no-repeat center center;background-size:100%}.input__label-content--makiko{display:block;padding:1.5em 0 0 2.75em}.input--filled .input__label--makiko::before,.input__field--makiko:focus+.input__label--makiko::before{-webkit-transform:scale3d(38,38,1);transform:scale3d(38,38,1)}.input--sae{overflow:hidden;width:200px;margin:0 2em 2em}.input__field--sae{background:0 0;width:100%;color:#fff;padding:1em 0 .5em;font-weight:500}.input__label--sae{position:absolute;width:100%;text-align:left;color:#7771ab;padding:0;height:100%;pointer-events:none}.input__label--sae::after{content:'';position:absolute;width:100%;height:2px;background:#fff;bottom:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}.icon--sae,.input__label--sae::after,.input__label-content--sae{-webkit-transition:-webkit-transform .3s;transition:transform .3s}.icon--sae{position:absolute;bottom:0;opacity:.5;left:-30px;color:#fff;pointer-events:none;font-size:1em;-webkit-transform:translate3d(205px,0,0);transform:translate3d(205px,0,0)}.input__label-content--sae{padding:0;font-size:18px;display:inline-block;vertical-align:bottom;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-transform:translate3d(0,50px,0);transform:translate3d(0,50px,0)}.input--filled .input__label-content--sae,.input__field--sae:focus+.input__label--sae .input__label-content--sae{-webkit-transform:translate3d(0,0,0) scale3d(.7,.7,1);transform:translate3d(0,0,0) scale3d(.7,.7,1)}.input--filled .input__label--sae::after,.input__field--sae:focus+.input__label--sae::after{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.input--filled .icon--sae,.input__field--sae:focus+.input__label--sae .icon--sae{-webkit-transition-delay:.01s;transition-delay:.01s;-webkit-transform:translate3d(0,0,0) rotate3d(0,0,1,-90deg);transform:translate3d(0,0,0) rotate3d(0,0,1,-90deg)}.input--fumi{background:#fff;overflow:hidden;padding:.25em 0}.input--fumi::after{content:'';width:1px;position:absolute;top:.5em;bottom:.5em;left:2.5em;background:#f0f0f0;z-index:100}.input__field--fumi{background:0 0;padding:1.5em 1em .25em 3.15em;width:100%;color:#00aeef}.input__label--fumi{position:absolute;width:100%;text-align:left;padding-left:4.5em;pointer-events:none}.icon--fumi{width:2em;position:absolute;top:0;left:0;padding:1em 0 0 .5em}.input__label-content--fumi{padding:1.7em 0;display:inline-block;-webkit-transform-origin:0 0;transform-origin:0 0}.input__label-content--fumi span{display:inline-block}.input--filled .input__label-content--fumi,.input__field--fumi:focus+.input__label--fumi .input__label-content--fumi{-webkit-animation:anim-fumi-1 .3s forwards;animation:anim-fumi-1 .3s forwards}.input--filled .icon--fumi,.input__field--fumi:focus+.input__label--fumi .icon--fumi{-webkit-animation:anim-fumi-2 .3s forwards;animation:anim-fumi-2 .3s forwards}.input__field--ruri{width:100%;background:0 0;padding:.5em 0;margin-bottom:2em;color:#fff}.input__label--ruri{width:100%;position:absolute;text-align:left;font-size:1em;padding:10px 0 5px;pointer-events:none}.input__label--ruri::after{content:'';position:absolute;width:100%;height:7px;background:#b7c3ac;left:0;top:100%;-webkit-transform-origin:50% 100%;transform-origin:50% 100%;-webkit-transition:-webkit-transform .3s,background-color .3s;transition:transform .3s,background-color .3s}.input__label-content--ruri{padding:0;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-transition:-webkit-transform .3s,color .3s;transition:transform .3s,color .3s}.input--filled .input__label--ruri::after,.input__field--ruri:focus+.input__label--ruri::after{background:#a3d39c;-webkit-transform:scale3d(1,.25,1);transform:scale3d(1,.25,1)}.input--filled .input__label--ruri .input__label-content--ruri,.input__field--ruri:focus+.input__label--ruri .input__label-content--ruri{color:#a3d39c;-webkit-transform:translate3d(0,2em,0) scale3d(.655,.655,1);transform:translate3d(0,2em,0) scale3d(.655,.655,1)}.input--kohana{overflow:hidden;background:#fff}.input__field--kohana{width:100%;background:0 0;padding-left:2.75em;color:#6a7989}.input__label--kohana{position:absolute;width:100%;text-align:left;pointer-events:none;color:#d2d2d2}.input__label-content--kohana{display:inline-block;width:auto;-webkit-transform:translate3d(-1.75em,0,0);transform:translate3d(-1.75em,0,0);-webkit-transition:-webkit-transform .3s,opacity .3s;transition:transform .3s,opacity .3s}.icon--kohana{display:inline-block;margin-top:.9em;-webkit-transform:translate3d(-2em,0,0);transform:translate3d(-2em,0,0);-webkit-transition:-webkit-transform .3s;transition:transform .3s}.input--filled .input__label-content--kohana,.input__field--kohana:focus+.input__label--kohana .input__label-content--kohana{opacity:0;-webkit-transform:translate3d(100px,0,0);transform:translate3d(100px,0,0)}.icon--kohana,.input--filled .input__label-content--kohana,.input__field--kohana:focus+.input__label--kohana .input__label-content--kohana,.input__label-content--kohana{-webkit-transition-timing-function:cubic-bezier(.7,0,.3,1);transition-timing-function:cubic-bezier(.7,0,.3,1)}.input--filled .icon--kohana,.input__field--kohana:focus+.input__label--kohana .icon--kohana{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}