Sha256: 1ca7c83152c19d38a93020f2b821d6a5105592f75ac6565db7a9b186d898f52a
Contents?: true
Size: 1.39 KB
Versions: 95
Compression:
Stored size: 1.39 KB
Contents
@mixin bottom-reflect( $size: 1px, $blur: 50, $stop: 60 ) {
$that_gradient: "linear, left top, left bottom, from(transparent), color-stop(0.#{$stop}, transparent), to(rgba(255,255,255,0.#{$blur}))";
-webkit-box-reflect: below $size -webkit-gradient(#{$that_gradient});
-moz-box-reflect: below $size -moz-gradient(#{$that_gradient});
-o-box-reflect: below $size -o-gradient(#{$that_gradient});
box-reflect: below $size gradient(#{$that_gradient});
}
.reflection {
display: block;
position: absolute;
background: inherit;
border: inherit;
@include box-shadow( inherit );
@include border-radius( inherit );
z-index: -1;
margin: 4px 0 0;
top: 100%;
// height: 50%;
height: 130px;
left: 0; right: 0;
// -moz-transform: scaleY(-1);
// -webkit-transform: scaleY(-1);
// -ms-transform: scaleY(-1);
// -o-transform: scaleY(-1);
// transform: scaleY(-1);
@include transform(scaleY(-1));
filter: url(assets/filter.svg#blur); /* FF, Opera + IE10*/
-webkit-filter: blur(2px); /* webkit */
filter: blur(2px);
opacity: .50;
&:after {
display: block;
position: absolute;
content: "";
top: -5px; bottom: 0;
left: -5px; right: -5px;
z-index: 3;
@include linear-gradient(
270deg,
rgba(233,233,229,1.0) 0%,
rgba(233,233,229,1.0) 30%,
rgba(233,233,229,.00) 70%,
rgba(233,233,229,.00) 100%,
$fallback: transparent
);
}
}
Version data entries
95 entries across 95 versions & 1 rubygems