%PDF- %PDF-
Direktori : /var/www/businessmultisite/wp-content/themes/stripes_weekly/src/scss/ |
Current File : /var/www/businessmultisite/wp-content/themes/stripes_weekly/src/scss/_burger-menu.scss |
.burger-menu { width: 100%; max-width: calc-rem(513); position: fixed; top: 0; left: 0; bottom: 0; z-index: 999; background: #1D1D1D; transform: translateX(-110%); transition: $transition_normal; &.burger-menu--show { transform: translateX(0); } .burger-menu--inner { position: relative; height: 100%; } .burger-menu--header { display: flex; justify-content: space-between; align-items: center; padding: calc-rem(37) calc-rem(48) calc-rem(34) calc-rem(60); @include media-breakpoint-down(md) { padding: calc-rem(30) calc-rem(20); } button { padding: 0; background: none; border: none; text-decoration: underline; font-size: calc-rem(16); color: $primary; &:hover { text-decoration: none; } } } .burger-menu--saved-articles { border-top: solid 1px rgba($color: #ffffff, $alpha: 0.25); padding: calc-rem(35) calc-rem(48) calc-rem(34) calc-rem(60); @include media-breakpoint-down(md) { padding: calc-rem(15) calc-rem(20); } a { font-size: calc-rem(22); text-decoration: none; color: #7B7B7B; display: flex; align-items: center; @include media-breakpoint-down(md) { font-size: calc-rem(18); } &:hover { text-decoration: none; color: $primary; .saved-posts_text { text-decoration: underline; } } .saved-posts_count-js { margin-left: calc-rem(15); font-size: calc-rem(20); color: $primary; display: flex; align-items: center; @include media-breakpoint-down(md) { font-size: calc-rem(16); } span { font-size: calc-rem(30); margin-right: calc-rem(10); @include media-breakpoint-down(md) { font-size: calc-rem(26); margin-right: calc-rem(7); } } } } } .burger-menu--info { border-top: solid 1px rgba($color: #ffffff, $alpha: 0.25); padding: calc-rem(35) calc-rem(48) calc-rem(34) calc-rem(60); @include media-breakpoint-down(md) { padding: calc-rem(30) calc-rem(20); } .burger-menu--info--title { color: #fff; margin-bottom: calc-rem(27); font-weight: 500; @include media-breakpoint-down(md) { margin-bottom: calc-rem(20); } } .burger-menu--info--nav { ul { list-style: none; padding: 0; margin: 0; li { margin-bottom: calc-rem(17); &:last-child { margin: 0; } a { font-size: calc-rem(22); text-decoration: none; color: #7B7B7B; &:hover { text-decoration: underline; color: $primary; } } } } } } .burger-menu--categories { border-top: solid 1px rgba($color: #ffffff, $alpha: 0.25); padding: calc-rem(35) calc-rem(48) 0 calc-rem(60); @include media-breakpoint-down(md) { padding: calc-rem(30) calc-rem(20) 0 calc-rem(20); } .burger-menu--categories--title { color: #fff; margin-bottom: calc-rem(27); font-weight: 500; @include media-breakpoint-down(md) { margin-bottom: calc-rem(20); } } .burger-menu--categories--nav { display: flex; ul { list-style: none; padding: 0; max-width: calc(50% - 1.875rem); @include media-breakpoint-down(md) { max-width: calc(50% - 0.9375rem); } &:first-child { margin-right: calc-rem(60); @include media-breakpoint-down(md) { margin-right: calc-rem(30); } } li { margin-bottom: calc-rem(17); a { font-size: calc-rem(16); line-height: calc-lh(16,24); text-decoration: none; color: #7B7B7B; &:hover { text-decoration: underline; color: $primary; } } } } } } .burger-menu--contacts{ border-top: solid 1px rgba($color: #ffffff, $alpha: 0.25); padding: calc-rem(35) calc-rem(48) calc-rem(34) calc-rem(60); display: flex; @include media-breakpoint-down(md) { padding: calc-rem(30) calc-rem(20); } nav { .burger-menu--contacts--title { color: #fff; margin-bottom: calc-rem(27); font-weight: 500; @include media-breakpoint-down(md) { margin-bottom: calc-rem(20); } } ul { list-style: none; padding: 0; li { margin-bottom: calc-rem(17); color: #7B7B7B; a { font-size: calc-rem(16); line-height: calc-lh(16,24); text-decoration: none; color: #7B7B7B; display: block; &:hover { text-decoration: underline; color: $primary; } } } } &.burger-menu--contacts--emails { margin-right: calc-rem(60); @include media-breakpoint-down(md) { margin-right: calc-rem(30); } ul { li { a { color: $primary; text-decoration: underline; &:hover { text-decoration: none; } } } } } } } } .burger-menu--overlay { background: rgba($color: #000000, $alpha: 0.5); position: fixed; left: 0; top: 0; right: 0; bottom: 0; display: none; z-index: 998; cursor: pointer; }