40 lines
1.3 KiB
Sass
40 lines
1.3 KiB
Sass
|
@import compass/css3
|
||
|
@import mixins
|
||
|
@import url("//fonts.googleapis.com/css?family=Arimo")
|
||
|
|
||
|
$themeName: "odometer-theme-car"
|
||
|
$padding: .15em
|
||
|
$borderRadius: .2em
|
||
|
|
||
|
+spinning-odometer($themeName)
|
||
|
|
||
|
.odometer.odometer-auto-theme, .odometer#{"." + $themeName}
|
||
|
+border-radius(.34em)
|
||
|
font-family: "Arimo", monospace
|
||
|
padding: $padding
|
||
|
background: #000
|
||
|
color: #eee0d3
|
||
|
|
||
|
.odometer-digit
|
||
|
+box-shadow(inset 0 0 .3em rgba(0, 0, 0, 0.8))
|
||
|
+background-image(linear-gradient(top, #333 0%, #333 40%, #101010 60%, #333 80%, #333 100%))
|
||
|
padding: 0 $padding
|
||
|
|
||
|
&:first-child
|
||
|
+border-radius($borderRadius 0 0 $borderRadius)
|
||
|
|
||
|
&:last-child
|
||
|
+border-radius(0 $borderRadius $borderRadius 0)
|
||
|
+background-image(linear-gradient(top, #eee0d3 0%, #eee0d3 40%, #bbaa9a 60%, #eee0d3 80%, #eee0d3 100%))
|
||
|
background-color: #eee0d3
|
||
|
color: #000
|
||
|
|
||
|
.odometer-digit-inner
|
||
|
left: $padding
|
||
|
|
||
|
&.odometer-animating-up .odometer-ribbon-inner, &.odometer-animating-down.odometer-animating .odometer-ribbon-inner
|
||
|
-webkit-transition-timing-function: linear
|
||
|
-moz-transition-timing-function: linear
|
||
|
-ms-transition-timing-function: linear
|
||
|
-o-transition-timing-function: linear
|
||
|
transition-timing-function: linear
|