Guest User

Untitled

a guest
Sep 24th, 2019
80
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. .burger {
  2. display: none;
  3. width: 30px;
  4. padding: 0;
  5. line-height: 30px;
  6.  
  7. border: 0;
  8. cursor: pointer;
  9. background-color: transparent;
  10.  
  11. order: 0;
  12. margin-left: auto;
  13.  
  14. @include for-tablet-landscape-down() {
  15. display: inline-block;
  16. margin-right: 5%;
  17. }
  18.  
  19. > span {
  20. position: relative;
  21. display: inline-block;
  22. width: 100%;
  23. height: 3px;
  24.  
  25. font-size: 0;
  26. vertical-align: middle;
  27. background-color: $black;
  28. transition: background .3s;
  29.  
  30. &:before,
  31. &:after {
  32. content: '';
  33. position: absolute;
  34. left: 0;
  35. width: 100%;
  36.  
  37. height: 100%;
  38. background-color: $black;
  39. transition: top .3s .3s, transform .3s;
  40. }
  41.  
  42. &:before {
  43. top: -10px;
  44. }
  45.  
  46. &:after {
  47. top: 10px;
  48. }
  49. }
  50.  
  51. &_close {
  52.  
  53. > span {
  54. background-color: transparent;
  55.  
  56. &::before,
  57. &::after {
  58. top: 0;
  59. transition: transform .3s .3s, top .3s;
  60. }
  61.  
  62. &::before {
  63. transform: rotate(45deg);
  64. }
  65.  
  66. &::after {
  67. transform: rotate(-45deg);
  68. }
  69. }
  70. }
  71. }
RAW Paste Data