mixins.sass 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. =arrow($color)
  2. border: 1px solid $color
  3. border-right: 0
  4. border-top: 0
  5. content: " "
  6. display: block
  7. height: 7px
  8. pointer-events: none
  9. position: absolute
  10. transform: rotate(-45deg)
  11. width: 7px
  12. =clearfix
  13. &:after
  14. clear: both
  15. content: " "
  16. display: table
  17. =center($size)
  18. left: 50%
  19. margin-left: -($size / 2)
  20. margin-top: -($size / 2)
  21. position: absolute
  22. top: 50%
  23. =fa($size, $dimensions)
  24. display: inline-block
  25. font-size: $size
  26. height: $dimensions
  27. line-height: $dimensions
  28. text-align: center
  29. vertical-align: top
  30. width: $dimensions
  31. =overlay($offset: 0)
  32. bottom: $offset
  33. left: $offset
  34. position: absolute
  35. right: $offset
  36. top: $offset
  37. =placeholder
  38. $placeholders: ':-moz' ':-webkit-input' '-moz' '-ms-input'
  39. @each $placeholder in $placeholders
  40. &:#{$placeholder}-placeholder
  41. @content
  42. =replace($background, $width, $height)
  43. background-color: $background
  44. background-position: center center
  45. background-repeat: no-repeat
  46. background-size: $width $height
  47. display: block
  48. height: $height
  49. outline: none
  50. overflow: hidden
  51. text-indent: -290486px
  52. width: $width
  53. =from($device)
  54. @media screen and (min-width: $device)
  55. @content
  56. =until($device)
  57. @media screen and (max-width: $device - 1px)
  58. @content
  59. =mobile
  60. @media screen and (max-width: $tablet - 1px)
  61. @content
  62. =tablet
  63. @media screen and (min-width: $tablet)
  64. @content
  65. =tablet-only
  66. @media screen and (min-width: $tablet) and (max-width: $desktop - 1px)
  67. @content
  68. =touch
  69. @media screen and (max-width: $desktop - 1px)
  70. @content
  71. =desktop
  72. @media screen and (min-width: $desktop)
  73. @content
  74. =desktop-only
  75. @media screen and (min-width: $desktop) and (max-width: $widescreen - 1px)
  76. @content
  77. =widescreen
  78. @media screen and (min-width: $widescreen)
  79. @content