+++ /dev/null
-%menu-toggle {
- position: relative;
- padding: 0;
- &:before {
- content: "";
- position: absolute;
- top: 8px;
- height: 5px;
- border-top: 15px double #ddd;
- border-bottom: 5px solid #ddd;
- }
-}
-
-#no-menu {
- @include size(width, $W_NONUMBERS_TINY);
-
- @include min-screen($S_NONUMBERS_TINY_MAX) {
- @include size(width, $W_NONUMBERS);
- }
-
- @include min-screen($S_NUMBERS) {
- @include size(width, 44px);
- }
-
- /* Button for showing menu */
- #menu-toggle-on {
- @extend %menu-toggle;
- display: block;
- background: #191919;
- color: #ddd;
- text-align: center;
- z-index: 100;
- @include size(height, 44px);
- padding: 0;
-
- &:before {
- left: 5px;
- right: 5px;
- @include min-screen(240px) {
- left: 8px;
- right: 8px;
- }
- }
- }
-}
-
-#menu-toggle-off {
- @extend %menu-toggle;
- height: 24px;
- &:before {
- left: 25px;
- right: 25px;
- }
-}
-
-
-#menu {
- display: none;
- width: 80px;
- height: 100%;
-}
-
-#menu, #no-menu {
- z-index: 101;
- position: fixed;
- top: 0;
- left: 0;
- text-align: center;
- line-height: 1.1em;
- background: #191919;
- color: #ddd;
-
- ul {
- list-style: none;
- margin: 0;
- padding: 0;
-
- li {
-
- a {
- padding: 10px 0;
- color: white;
- display: block;
- text-decoration: none;
-
- &.active {
- background: white;
- color: black;
- }
-
- .label {
- display: block;
- font-size: 12px;
- }
- }
- }
-
- }
-}
-
-/* body class for showing menu */
-.menu-showed {
- #menu {
- display: block;
- }
- #no-menu {
- display: none;
- }
-}
-
-/* menu showing by default */
-@include min-screen($S_MENU) {
- #menu {
- display: block;
- }
- #no-menu {
- display: none;
- }
- /* body class for hiding menu */
- .menu-hidden {
- #menu {
- display: none;
- }
- #no-menu {
- display: block;
- }
- }
-}