Skip to content

Instantly share code, notes, and snippets.

@okolehao
Created August 27, 2014 17:44
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save okolehao/98870871ec1d40263e8e to your computer and use it in GitHub Desktop.
Save okolehao/98870871ec1d40263e8e to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
// ----
// Sass (v3.4.1)
// Compass (v1.0.1)
// Bootstrap Sass (v3.2.0.1)
// ----
$white: #252525
$publish-pool-active: #252524
$grayish: #252524
=scale($ratio)
-webkit-transform: scale($ratio)
-ms-transform: scale($ratio)
// IE9+
transform: scale($ratio)
// Opacity
=opacity($opacity)
opacity: $opacity
// IE8 filter
$opacity-ie: $opacity * 100
filter: alpha(opacity = $opacity-ie)
=ease($property, $duration)
+transition($property $duration cubic-bezier(0.42, 0, 0.58, 1))
=cubic
-webkit-timing-function: cubic-bezier(0.42, 0, 0.58, 1)
timing-function: cubic-bezier(0.42, 0, 0.58, 1)
=animation-delay($delay)
-webkit-animation-delay: $delay
-moz-animation-delay: $delay
-o-animation-delay: $delay
animation-delay: $delay
=animation-repeat($count)
animation-iteration-count: $count
-moz-animation-iteration-count: $count
-webkit-animation-iteration-count: $count
-o-animation-iteration-count: $count
=animation-duration($time)
animation-duration: $time
-moz-animation-duration: $time
-webkit-animation-duration: $time
-o-animation-duration: $time
=animation-fill-mode($mode)
animation-fill-mode: $mode
-webkit-animation-fill-mode: $mode
// fadein single view
@-webkit-keyframes viewfade
0%
+opacity(.2)
100%
+opacity(1)
@keyframes viewfade
0%
+opacity(.2)
100%
+opacity(1)
// fadein discover module container
@-webkit-keyframes tile-fade
0%
+opacity(0)
100%
+opacity(1)
@keyframes tile-fade
0%
+opacity(0)
100%
+opacity(1)
// animate .icon-spinner
@-webkit-keyframes animate-spinner
0%
-webkit-transform: rotate(0deg) scale(.6)
+opacity(.1)
50%
-webkit-transform: rotate(179deg) scale(1)
+opacity(1)
100%
-webkit-transform: rotate(359deg) scale(.6)
+opacity(.1)
@keyframes animate-spinner
0%
transform: rotate(0deg) scale(.6)
+opacity(.1)
50%
transform: rotate(179deg) scale(1)
+opacity(1)
100%
transform: rotate(359deg) scale(.6)
+opacity(.1)
// fade then hide .msg on discover-publish-actions icons
@-webkit-keyframes publish-msg
0%
+opacity(1)
100%
+opacity(0)
+scale(4)
@-keyframes publish-msg
0%
+opacity(1)
100%
+opacity(0)
+scale(4)
// bounce publish-pool-count
@-webkit-keyframes publish-bounce
0%
+scale(1)
50%
+scale(1.2)
100%
+scale(1)
@-keyframes publish-bounce
0%
+scale(1)
50%
+scale(1.2)
100%
+scale(1)
// fade publish-pool background when story is added
@-webkit-keyframes publish-flicker
0%
background: $white
50%
background: $publish-pool-active
100%
background: $white
@-keyframes publish-flicker
0%
background: $white
50%
background: $publish-pool-active
100%
background: $white
// pulsing div
@-moz-keyframes pulsate
0%
background-color: whitesmoke
50%
background-color: $white
-moz-box-shadow: 0 0 2px $grayish
box-shadow: 0 0 2px $grayish
100%
background-color: whitesmoke
@-keyframes pulsate
0%
background-color: whitesmoke
50%
background-color: $white
box-shadow: 0 0 2px $grayish
100%
background-color: whitesmoke
@-webkit-keyframes pulsate
0%
background-color: whitesmoke
50%
background-color: $white
-webkit-box-shadow: 0 0 2px $grayish
100%
background-color: whitesmoke
@import "bootstrap"
Invalid CSS after "": expected selector, was "0%"
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment