diff --git a/src/css/main.css b/src/css/main.css index 46650bf6e..6d5bffa48 100644 --- a/src/css/main.css +++ b/src/css/main.css @@ -123,7 +123,6 @@ input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill, inpu .page, .main { height:100%; background-color: #fff; - -webkit-backface-visibility: hidden; } .button.small.side-bar { @@ -505,21 +504,17 @@ ul.pagination li.current a { input { border-radius: 2px; background: #EDEDED; - -moz-box-shadow: 0px 0px 0px 0px rgba(255,255,255,0.09), inset 1px 1px 0px 0px rgba(0,0,0,0.05); - box-shadow: 0px 0px 0px 0px rgba(255,255,255,0.09), inset 1px 1px 0px 0px rgba(0,0,0,0.05); color: #2C3E42; padding: 1.2rem 0.7rem; margin-bottom: 1.5rem; border: 0; } -input[type=date], input[type=datetime-local], input[type=datetime], input[type=email], input[type=month], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week], textarea { +input[type="color"], input[type="date"], input[type="datetime-local"], input[type="datetime"], input[type="email"], input[type="month"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"], textarea { color: #B7C2CD; margin-bottom: 1.5rem; height: 35px; background: transparent; - -moz-box-shadow: none; - box-shadow: none; border: none; padding-left: 0.1rem; font-size: 13px; @@ -530,14 +525,13 @@ input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus color: #4B6178; border-color: #CED5DC; background: transparent; - transition: none !important; - -webkit-transition: none !important; } input[type="text"][disabled], input[type="text"][readonly], fieldset[disabled] input[type="text"], input[type="password"][disabled], input[type="password"][readonly], fieldset[disabled] input[type="password"], input[type="date"][disabled], input[type="date"][readonly], fieldset[disabled] input[type="date"], input[type="datetime"][disabled], input[type="datetime"][readonly], fieldset[disabled] input[type="datetime"], input[type="datetime-local"][disabled], input[type="datetime-local"][readonly], fieldset[disabled] input[type="datetime-local"], input[type="month"][disabled], input[type="month"][readonly], fieldset[disabled] input[type="month"], input[type="week"][disabled], input[type="week"][readonly], fieldset[disabled] input[type="week"], input[type="email"][disabled], input[type="email"][readonly], fieldset[disabled] input[type="email"], input[type="number"][disabled], input[type="number"][readonly], fieldset[disabled] input[type="number"], input[type="search"][disabled], input[type="search"][readonly], fieldset[disabled] input[type="search"], input[type="tel"][disabled], input[type="tel"][readonly], fieldset[disabled] input[type="tel"], input[type="time"][disabled], input[type="time"][readonly], fieldset[disabled] input[type="time"], input[type="url"][disabled], input[type="url"][readonly], fieldset[disabled] input[type="url"], input[type="color"][disabled], input[type="color"][readonly], fieldset[disabled] input[type="color"], textarea[disabled], textarea[readonly], fieldset[disabled] textarea { background-color: #E4E8EC; color: #2C3E50; padding-left: 0.5rem; + opacity: 1; } select { diff --git a/src/css/mobile.css b/src/css/mobile.css index afac7e764..afd980a94 100644 --- a/src/css/mobile.css +++ b/src/css/mobile.css @@ -573,26 +573,61 @@ a.pin-button:active { .reveal-modal .fade .in, .reveal-modal.fade.full.in, .reveal-modal.fade.full.out, -.reveal-modal.fade.full { -/*CSS transitions*/ - -o-transition-property: none !important; - -moz-transition-property: none !important; - -ms-transition-property: none !important; - -webkit-transition-property: none !important; - transition-property: none !important; - /*CSS transforms*/ - -o-transform: none !important; - -moz-transform: none !important; - -ms-transform: none !important; - -webkit-transform: none !important; - transform: none !important; - /*CSS animations*/ - -webkit-animation: none !important; - -moz-animation: none !important; - -o-animation: none !important; - -ms-animation: none !important; - animation: none !important; - +.reveal-modal.fade.full, +input[type="color"], +input[type="date"], +input[type="datetime-local"], +input[type="datetime"], +input[type="email"], +input[type="month"], +input[type="number"], +input[type="password"], +input[type="search"], +input[type="tel"], +input[type="text"], +input[type="time"], +input[type="url"], +input[type="week"], +textarea, +input[type="text"]:focus, +input[type="password"]:focus, +input[type="date"]:focus, +input[type="datetime"]:focus, +input[type="datetime-local"]:focus, +input[type="month"]:focus, +input[type="week"]:focus, +input[type="email"]:focus, +input[type="number"]:focus, +input[type="search"]:focus, +input[type="tel"]:focus, +input[type="time"]:focus, +input[type="url"]:focus, +input[type="color"]:focus, +textarea:focus +{ + opacity: 1; + /*CSS transitions*/ + -o-transition-property: none !important; + -moz-transition-property: none !important; + -ms-transition-property: none !important; + -webkit-transition-property: none !important; + transition-property: none !important; + /*CSS transforms*/ + -o-transform: none !important; + -moz-transform: none !important; + -ms-transform: none !important; + -webkit-transform: none !important; + transform: none !important; + /*CSS animations*/ + -webkit-animation: none !important; + -moz-animation: none !important; + -o-animation: none !important; + -ms-animation: none !important; + animation: none !important; + /*CSS box-shadow*/ + -webkit-box-shadow: none !important; + -moz-box-shadow: none !important; + box-shadow: none !important; } .popup-tx-status { @@ -658,46 +693,65 @@ a.pin-button:active { color: #B7C2CD; } +.animation-left, .animation-right { + position: absolute; + background: #fff; + display: block; + width: 100%; + height: 100%; + top: 0; + left: 0; + -webkit-backface-visibility: hidden; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} + .animation-left.ng-enter, .animation-left.ng-leave, .animation-right.ng-enter, .animation-right.ng-leave { - -webkit-transition: all ease-in-out 250ms; - transition: all ease-in-out 250ms; + -webkit-transition: all ease 300ms; + transition: all ease 300ms; } .animation-left.ng-enter { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); - -webkit-transition-delay: 0.001s; - transition-delay: 0.001s; + -webkit-transition-delay: 0.01s; + transition-delay: 0.01s; + opacity: 0; } .animation-right.ng-enter { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); - -webkit-transition-delay: 0.001s; - transition-delay: 0.001s; + -webkit-transition-delay: 0.01s; + transition-delay: 0.01s; + opacity: 0; } .animation-left.ng-enter.ng-enter-active, .animation-right.ng-enter.ng-enter-active { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); + opacity: 1; } .animation-left.ng-leave, .animation-right.ng-leave { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); + opacity: 0; } .animation-left.ng-leave.animation-left.ng-leave-active { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); - -webkit-transition-delay: 0.001s; - transition-delay: 0.001s; + -webkit-transition-delay: 0.01s; + transition-delay: 0.01s; + opacity: 0; } .animation-right.ng-leave.animation-right.ng-leave-active { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); - -webkit-transition-delay: 0.001s; - transition-delay: 0.001s; + -webkit-transition-delay: 0.01s; + transition-delay: 0.01s; + opacity: 0; } .tab-view {