vue-material
Version:
Material Design for Vue.js
5 lines • 11.7 kB
CSS
/*!
* vue-material v1.0.0-beta-7
* Made with <3 by marcosmoura 2017
* Released under the MIT License.
*/html{height:100%;box-sizing:border-box;transition:background-color .3s cubic-bezier(.25,.8,.25,1)}html *,html :after,html :before{box-sizing:inherit}body{min-height:100%;margin:0;position:relative;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,Noto Sans,-apple-system,BlinkMacSystemFont,sans-serif}a:not(.md-button){transition:.3s cubic-bezier(.25,.8,.25,1);transition-property:color,background-color,opacity}audio,canvas,embed,iframe,img,object,video{max-width:100%;font-style:italic;vertical-align:middle}audio:not(.md-image),canvas:not(.md-image),embed:not(.md-image),iframe:not(.md-image),img:not(.md-image),object:not(.md-image),video:not(.md-image){height:auto}[tabindex="-1"]:focus{outline:none }.md-scrollbar::-webkit-scrollbar{width:8px;height:8px;border-radius:8px}.md-scrollbar::-webkit-scrollbar-thumb{border-radius:8px}.md-scrollbar::-webkit-scrollbar-button{display:none}.md-caption{font-size:12px;font-weight:400;letter-spacing:.02em;line-height:17px}.md-body-1,body{font-weight:400;line-height:20px}.md-body-1,.md-body-2,body{font-size:14px;letter-spacing:.01em}.md-body-2{font-weight:500;line-height:24px}.md-subheading{font-size:16px;font-weight:400;letter-spacing:.01em;line-height:24px}.md-title{font-size:20px;font-weight:500;letter-spacing:.005em;line-height:26px}.md-headline{font-size:24px;line-height:32px}.md-display-1,.md-headline{font-weight:400;letter-spacing:0}.md-display-1{font-size:34px;line-height:40px}.md-display-2{font-size:45px;font-weight:400;letter-spacing:0;line-height:48px}.md-display-3{font-size:56px;font-weight:400;letter-spacing:-.005em;line-height:58px}.md-display-4{font-size:112px;font-weight:300;letter-spacing:-.01em;line-height:112px}a:not(.md-button){text-decoration:none}a:not(.md-button):hover{text-decoration:underline}button:focus{outline:none}@-webkit-keyframes a{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{-webkit-animation-timing-function:cubic-bezier(.5,0,.7,.5);animation-timing-function:cubic-bezier(.5,0,.7,.5);-webkit-transform:translateX(0);transform:translateX(0)}60%{-webkit-animation-timing-function:cubic-bezier(.3,.38,.55,.96);animation-timing-function:cubic-bezier(.3,.38,.55,.96);-webkit-transform:translateX(83.67%);transform:translateX(83.67%)}to{-webkit-transform:translateX(200.61%);transform:translateX(200.61%)}}@keyframes a{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{-webkit-animation-timing-function:cubic-bezier(.5,0,.7,.5);animation-timing-function:cubic-bezier(.5,0,.7,.5);-webkit-transform:translateX(0);transform:translateX(0)}60%{-webkit-animation-timing-function:cubic-bezier(.3,.38,.55,.96);animation-timing-function:cubic-bezier(.3,.38,.55,.96);-webkit-transform:translateX(83.67%);transform:translateX(83.67%)}to{-webkit-transform:translateX(200.61%);transform:translateX(200.61%)}}@-webkit-keyframes b{0%{-webkit-transform:scaleX(.08);transform:scaleX(.08)}35%{-webkit-animation-timing-function:cubic-bezier(.33,.12,.79,1);animation-timing-function:cubic-bezier(.33,.12,.79,1);-webkit-transform:scaleX(.08);transform:scaleX(.08)}70%{-webkit-animation-timing-function:cubic-bezier(.06,.11,.6,1);animation-timing-function:cubic-bezier(.06,.11,.6,1);-webkit-transform:scaleX(.66);transform:scaleX(.66)}to{-webkit-transform:scaleX(.08);transform:scaleX(.08)}}@keyframes b{0%{-webkit-transform:scaleX(.08);transform:scaleX(.08)}35%{-webkit-animation-timing-function:cubic-bezier(.33,.12,.79,1);animation-timing-function:cubic-bezier(.33,.12,.79,1);-webkit-transform:scaleX(.08);transform:scaleX(.08)}70%{-webkit-animation-timing-function:cubic-bezier(.06,.11,.6,1);animation-timing-function:cubic-bezier(.06,.11,.6,1);-webkit-transform:scaleX(.66);transform:scaleX(.66)}to{-webkit-transform:scaleX(.08);transform:scaleX(.08)}}@-webkit-keyframes c{0%{-webkit-animation-timing-function:cubic-bezier(.15,0,.52,.41);animation-timing-function:cubic-bezier(.15,0,.52,.41);-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-animation-timing-function:cubic-bezier(.31,.28,.8,.73);animation-timing-function:cubic-bezier(.31,.28,.8,.73);-webkit-transform:translateX(37.65%);transform:translateX(37.65%)}50%{-webkit-animation-timing-function:cubic-bezier(.4,.63,.6,.9);animation-timing-function:cubic-bezier(.4,.63,.6,.9);-webkit-transform:translateX(84.39%);transform:translateX(84.39%)}to{-webkit-transform:translateX(160.28%);transform:translateX(160.28%)}}@keyframes c{0%{-webkit-animation-timing-function:cubic-bezier(.15,0,.52,.41);animation-timing-function:cubic-bezier(.15,0,.52,.41);-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-animation-timing-function:cubic-bezier(.31,.28,.8,.73);animation-timing-function:cubic-bezier(.31,.28,.8,.73);-webkit-transform:translateX(37.65%);transform:translateX(37.65%)}50%{-webkit-animation-timing-function:cubic-bezier(.4,.63,.6,.9);animation-timing-function:cubic-bezier(.4,.63,.6,.9);-webkit-transform:translateX(84.39%);transform:translateX(84.39%)}to{-webkit-transform:translateX(160.28%);transform:translateX(160.28%)}}@-webkit-keyframes d{0%{-webkit-animation-timing-function:cubic-bezier(.15,0,.52,.41);animation-timing-function:cubic-bezier(.15,0,.52,.41);-webkit-transform:scaleX(.08);transform:scaleX(.08)}20%{-webkit-animation-timing-function:cubic-bezier(.31,.28,.8,.73);animation-timing-function:cubic-bezier(.31,.28,.8,.73);-webkit-transform:scaleX(.46);transform:scaleX(.46)}45%{-webkit-animation-timing-function:cubic-bezier(.4,.63,.6,.9);animation-timing-function:cubic-bezier(.4,.63,.6,.9);-webkit-transform:scaleX(.73);transform:scaleX(.73)}to{-webkit-transform:scaleX(.08);transform:scaleX(.08)}}@keyframes d{0%{-webkit-animation-timing-function:cubic-bezier(.15,0,.52,.41);animation-timing-function:cubic-bezier(.15,0,.52,.41);-webkit-transform:scaleX(.08);transform:scaleX(.08)}20%{-webkit-animation-timing-function:cubic-bezier(.31,.28,.8,.73);animation-timing-function:cubic-bezier(.31,.28,.8,.73);-webkit-transform:scaleX(.46);transform:scaleX(.46)}45%{-webkit-animation-timing-function:cubic-bezier(.4,.63,.6,.9);animation-timing-function:cubic-bezier(.4,.63,.6,.9);-webkit-transform:scaleX(.73);transform:scaleX(.73)}to{-webkit-transform:scaleX(.08);transform:scaleX(.08)}}@-webkit-keyframes e{to{-webkit-transform:translate3D(-8px,0,0);transform:translate3D(-8px,0,0)}}@keyframes e{to{-webkit-transform:translate3D(-8px,0,0);transform:translate3D(-8px,0,0)}}.md-progress-bar{height:5px;overflow:hidden;position:relative;-webkit-transform:translateZ(0) scaleY(1);transform:translateZ(0) scaleY(1);-webkit-transform-origin:top center;transform-origin:top center;transition:opacity .3s cubic-bezier(.4,0,.2,1),-webkit-transform .4s cubic-bezier(.4,0,.2,1);transition:opacity .3s cubic-bezier(.4,0,.2,1),transform .4s cubic-bezier(.4,0,.2,1);transition:opacity .3s cubic-bezier(.4,0,.2,1),transform .4s cubic-bezier(.4,0,.2,1),-webkit-transform .4s cubic-bezier(.4,0,.2,1);will-change:opacity,transform}.md-progress-bar.md-indeterminate .md-progress-bar-track,.md-progress-bar.md-query .md-progress-bar-track{left:-150%;-webkit-animation:a 2s infinite linear;animation:a 2s infinite linear}.md-progress-bar.md-indeterminate .md-progress-bar-track:after,.md-progress-bar.md-query .md-progress-bar-track:after{-webkit-animation:b 2s infinite linear;animation:b 2s infinite linear}.md-progress-bar.md-indeterminate .md-progress-bar-fill,.md-progress-bar.md-query .md-progress-bar-fill{left:-55%;-webkit-animation:c 2s infinite linear;animation:c 2s infinite linear}.md-progress-bar.md-indeterminate .md-progress-bar-fill:after,.md-progress-bar.md-query .md-progress-bar-fill:after{-webkit-animation:d 2s infinite linear;animation:d 2s infinite linear}.md-progress-bar.md-buffer .md-progress-bar-buffer,.md-progress-bar.md-buffer .md-progress-bar-fill,.md-progress-bar.md-buffer .md-progress-bar-track,.md-progress-bar.md-determinate .md-progress-bar-buffer,.md-progress-bar.md-determinate .md-progress-bar-fill,.md-progress-bar.md-determinate .md-progress-bar-track{transition:.25s cubic-bezier(.25,.8,.25,1)}.md-progress-bar.md-determinate .md-progress-bar-track{display:none}.md-progress-bar.md-buffer .md-progress-bar-buffer{border-top:4px dotted;-webkit-animation:e .25s infinite linear;animation:e .25s infinite linear}.md-progress-bar.md-query{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.md-progress-bar-enter,.md-progress-bar-leave-active{opacity:.5;-webkit-transform:translateZ(0) scaleY(0);transform:translateZ(0) scaleY(0)}.md-progress-bar-buffer,.md-progress-bar-fill,.md-progress-bar-track{-webkit-transform-origin:top left;transform-origin:top left}.md-progress-bar-buffer,.md-progress-bar-buffer:after,.md-progress-bar-fill,.md-progress-bar-fill:after,.md-progress-bar-track,.md-progress-bar-track:after{width:100%;height:100%;position:absolute;will-change:transform}.md-progress-bar-buffer:after,.md-progress-bar-fill:after,.md-progress-bar-track:after{display:inline-block;left:0;content:" "}@-webkit-keyframes f{0%{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes f{0%{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@-webkit-keyframes g{0%{opacity:0;-webkit-transform:rotate(-90deg) translateZ(0);transform:rotate(-90deg) translateZ(0)}20%{opacity:1}to{-webkit-transform:rotate(270deg) translateZ(0);transform:rotate(270deg) translateZ(0)}}@keyframes g{0%{opacity:0;-webkit-transform:rotate(-90deg) translateZ(0);transform:rotate(-90deg) translateZ(0)}20%{opacity:1}to{-webkit-transform:rotate(270deg) translateZ(0);transform:rotate(270deg) translateZ(0)}}.md-progress-spinner{display:-webkit-inline-box;display:inline-flex;position:relative}.md-progress-spinner.md-indeterminate{-webkit-animation:f 2s linear infinite;animation:f 2s linear infinite}.md-progress-spinner.md-indeterminate.md-progress-spinner-enter,.md-progress-spinner.md-indeterminate.md-progress-spinner-leave-active{transition-duration:.4s}.md-progress-spinner.md-indeterminate.md-progress-spinner-enter .md-progress-spinner-draw,.md-progress-spinner.md-indeterminate.md-progress-spinner-leave-active .md-progress-spinner-draw{opacity:0;-webkit-transform:scale(.1);transform:scale(.1)}.md-progress-spinner.md-indeterminate .md-progress-spinner-circle{-webkit-animation:4s infinite cubic-bezier(.25,.8,.25,1);animation:4s infinite cubic-bezier(.25,.8,.25,1)}.md-progress-spinner.md-determinate.md-progress-spinner-enter-active,.md-progress-spinner.md-determinate.md-progress-spinner-leave-active{transition-duration:2s}.md-progress-spinner.md-determinate.md-progress-spinner-enter-active .md-progress-spinner-draw,.md-progress-spinner.md-determinate.md-progress-spinner-leave-active .md-progress-spinner-draw{-webkit-animation:g 1.98s cubic-bezier(.25,.8,.25,1) forwards;animation:g 1.98s cubic-bezier(.25,.8,.25,1) forwards}.md-progress-spinner.md-determinate .md-progress-spinner-draw{transition:none}.md-progress-spinner-draw{overflow:visible;-webkit-transform:scale(1) rotate(-90deg);transform:scale(1) rotate(-90deg);-webkit-transform-origin:center;transform-origin:center;transition:.4s cubic-bezier(.25,.8,.25,1);will-change:opacity,transform}.md-progress-spinner-circle{fill:none;-webkit-transform-origin:center;transform-origin:center;transition:stroke-dashoffset .25s cubic-bezier(.25,.8,.25,1);will-change:stroke-dashoffset,stroke-dasharray,stroke-width,animation-name,r}