1/* 2Copyright (c) 2014 The Polymer Project Authors. All rights reserved. 3This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt 4The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 5The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt 6Code distributed by Google as part of the polymer project is also 7subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt 8*/ 9 10:host { 11 display: inline-block; 12 width: 200px; 13 height: 4px; 14} 15 16#progressContainer { 17 position: relative; 18 height: 100%; 19 background-color: #c8c8c8; 20 overflow: hidden; 21} 22 23#activeProgress, 24#secondaryProgress { 25 -webkit-transform-origin: left center; 26 transform-origin: left center; 27 -webkit-transform: scaleX(0); 28 transform: scaleX(0); 29} 30 31#activeProgress { 32 background-color: #0f9d58; 33} 34 35#secondaryProgress { 36 background-color: #87ceac; 37} 38 39#activeProgress.indeterminate { 40 -webkit-transform-origin: center center; 41 transform-origin: center center; 42 -webkit-animation: indeterminate-bar 1s linear infinite; 43 animation: indeterminate-bar 1s linear infinite; 44} 45 46@-webkit-keyframes indeterminate-bar { 47 0% { 48 -webkit-transform: translate(-50%) scaleX(0); 49 } 50 50% { 51 -webkit-transform: translate(0%) scaleX(0.3); 52 } 53 100% { 54 -webkit-transform: translate(50%) scaleX(0); 55 } 56} 57 58@keyframes indeterminate-bar { 59 0% { 60 transform: translate(-50%) scaleX(0); 61 } 62 50% { 63 transform: translate(0%) scaleX(0.3); 64 } 65 100% { 66 transform: translate(50%) scaleX(0); 67 } 68} 69