/sass/recipes/shadow/drop/_flying.scss

https://bitbucket.org/decore/my-svadba.ru · Sass · 34 lines · 26 code · 2 blank · 6 comment · 0 complexity · 7c1e54830e68df342818402e77baf57a MD5 · raw file

  1. /**
  2. * Drop shadow flying
  3. *
  4. * @thanks Geoffrey Crofte @geoffrey_crofte
  5. * @link http://www.creativejuiz.fr/trytotry/css3-box-shadow-after-before/
  6. */
  7. @mixin drop-shadow-flying(
  8. $box-shadow-radius: 30px,
  9. $color: #000,
  10. $distance: 1em,
  11. $height: 2px
  12. )
  13. {
  14. position: relative;
  15. &:before,
  16. &:after
  17. {
  18. content: " ";
  19. position: absolute;
  20. z-index: -2;
  21. bottom: -$distance;
  22. }
  23. &:after
  24. {
  25. left: 8%;
  26. width: 84%;
  27. height: $height;
  28. background: rgba(#000, .3);
  29. @include border-radius(#{50%} / #{1px});
  30. @include box-shadow(0 $height $box-shadow-radius/2 rgba(#000, .2), 0 $height $box-shadow-radius rgba(#000, .15));
  31. }
  32. }