Skip to content

Commit 2addfde

Browse files
author
Salma Alam-Naylor
committed
Condense mobile header with a logo no text component
1 parent eefc663 commit 2addfde

File tree

10 files changed

+171
-51
lines changed

10 files changed

+171
-51
lines changed

‎apps/fretonator-web/src/app/common/header/__snapshots__/header.component.spec.ts.snap

Lines changed: 50 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -7,38 +7,61 @@ exports[`HeaderComponent should match snapshot 1`] = `
77
<header
88
class="header"
99
>
10-
<a
11-
aria-label="Navigate to home"
12-
class="header__siteLogo"
13-
href="/"
10+
<div
11+
class="header__topRow"
1412
>
15-
<app-logo-with-text>
16-
<svg
17-
class="svg"
18-
viewBox="0 0 2000 2000"
19-
xmlns="http://www.w3.org/2000/svg"
13+
<button
14+
aria-controls="headerLinks"
15+
aria-expanded="false"
16+
aria-label="Menu Toggle"
17+
class="hamburger"
18+
type="button"
19+
>
20+
<span
21+
class="hamburger__box"
2022
>
21-
<path
22-
d="M302.39 1410.89v42.7h61.43v15.05h-61.43v49.53h-17.5v-122.5h86.45v15.22zM499.93 1518.17l-26.42-37.63c-3.27.24-5.84.35-7.7.35h-30.28v37.28H418v-122.5h47.78q23.79 0 37.45 11.37t13.65 31.33q0 14.18-7 24.15T490 1477l29 41.17zm-9.27-59.33q8.74-7.17 8.75-20.47t-8.75-20.37q-8.76-7.1-25.38-7.09h-29.75V1466h29.75q16.62 0 25.38-7.16zM658.74 1502.94v15.23h-88.9v-122.5h86.45v15.22h-68.95v37.63h61.43v14.87h-61.43v39.55zM739.79 1410.89h-42v-15.22h101.32v15.22h-42v107.28h-17.32zM861 1511.43a60.22 60.22 0 01-23.36-22.49 64.65 64.65 0 010-64A60.29 60.29 0 01861 1402.4a72.43 72.43 0 0166.68 0 59.84 59.84 0 0123.32 22.4 65.59 65.59 0 010 64.23 59.77 59.77 0 01-23.27 22.4 72.35 72.35 0 01-66.68 0zm57.67-13.56a45 45 0 0017-16.89 49.73 49.73 0 000-48.13 44.94 44.94 0 00-17-16.88 48.09 48.09 0 00-24.24-6.13A49 49 0 00870 1416a44.51 44.51 0 00-17.15 16.88 49.66 49.66 0 000 48.13 44.6 44.6 0 0017.15 16.86 49.1 49.1 0 0024.41 6.12 48.19 48.19 0 0024.28-6.12zM1116.21 1395.67v122.5h-14.35l-73.5-91.35v91.35h-17.5v-122.5h14.35l73.5 91.35v-91.35zM1256.49 1487.54h-65.1l-13.48 30.63h-18l55.47-122.5h17.33l55.65 122.5H1270zm-6.13-14l-26.42-60-26.43 60zM1343.06 1410.89h-42v-15.22h101.32v15.22h-42v107.28h-17.32zM1464.3 1511.43a60.17 60.17 0 01-23.37-22.49 64.71 64.71 0 010-64 60.24 60.24 0 0123.37-22.49 72.41 72.41 0 0166.67 0 59.8 59.8 0 0123.28 22.4 65.59 65.59 0 010 64.23 59.73 59.73 0 01-23.28 22.4 72.33 72.33 0 01-66.67 0zm57.66-13.56a45 45 0 0017-16.89 49.66 49.66 0 000-48.13 44.94 44.94 0 00-17-16.88 48.09 48.09 0 00-24.24-6.13 49 49 0 00-24.41 6.13 44.58 44.58 0 00-17.15 16.88 49.73 49.73 0 000 48.13 44.67 44.67 0 0017.15 16.89 49.13 49.13 0 0024.41 6.12 48.19 48.19 0 0024.28-6.12zM1696 1518.17l-26.42-37.63c-3.27.24-5.84.35-7.7.35h-30.28v37.28h-17.5v-122.5h47.78q23.79 0 37.45 11.37t13.65 31.33q0 14.18-7 24.15t-20 14.52l29 41.13zm-9.27-59.33q8.74-7.17 8.75-20.47t-8.75-20.39q-8.76-7.1-25.38-7.09h-29.75V1466h29.75q16.65 0 25.41-7.16zM1080.78 1060.28L1134 968a14.91 14.91 0 002-7.49V487.93a7.5 7.5 0 00-7.5-7.5h-54.18a7.5 7.5 0 00-7.5 7.5v568.61a7.5 7.5 0 0013.96 3.74zM1229.85 480.43h-54.19a7.5 7.5 0 00-7.5 7.5v392.72a7.5 7.5 0 0014 3.75l53.18-92.27a15 15 0 002-7.49V487.93a7.5 7.5 0 00-7.49-7.5zM925.71 480.43h-54.18a7.5 7.5 0 00-7.5 7.5v472.59a14.91 14.91 0 002 7.49l53.18 92.27a7.5 7.5 0 0014-3.74V487.93a7.5 7.5 0 00-7.5-7.5zM1363.08 480.43h-86a7.5 7.5 0 00-7.5 7.5v216.84a7.5 7.5 0 0014 3.74l105.53-183.09a30 30 0 00-26.03-44.99zM764.66 792.13l53.18 92.27a7.5 7.5 0 0014-3.75V487.93a7.5 7.5 0 00-7.5-7.5h-54.19a7.5 7.5 0 00-7.5 7.5v296.71a15 15 0 002.01 7.49zM1027.09 480.43h-54.18a7.5 7.5 0 00-7.5 7.5v648.48a15 15 0 002 7.49l6.6 11.44a30 30 0 0052 0l6.6-11.44a15 15 0 002-7.49V487.93a7.5 7.5 0 00-7.52-7.5zM730.46 487.93a7.5 7.5 0 00-7.5-7.5h-86a30 30 0 00-26 45l105.5 183.08a7.5 7.5 0 0014-3.74z"
23+
<span
24+
class="hamburger__inner"
2325
/>
24-
</svg>
25-
</app-logo-with-text>
26-
</a>
27-
<button
28-
aria-controls="headerLinks"
29-
aria-expanded="false"
30-
aria-label="Menu Toggle"
31-
class="hamburger"
32-
type="button"
33-
>
34-
<span
35-
class="hamburger__box"
26+
</span>
27+
</button>
28+
<a
29+
aria-label="Navigate to home"
30+
class="header__siteLogo"
31+
href="/"
3632
>
3733
<span
38-
class="hamburger__inner"
39-
/>
40-
</span>
41-
</button>
34+
class="header__siteLogo__text"
35+
>
36+
<app-logo-with-text>
37+
<svg
38+
class="svg"
39+
viewBox="0 0 2000 2000"
40+
xmlns="http://www.w3.org/2000/svg"
41+
>
42+
<path
43+
d="M302.39 1410.89v42.7h61.43v15.05h-61.43v49.53h-17.5v-122.5h86.45v15.22zM499.93 1518.17l-26.42-37.63c-3.27.24-5.84.35-7.7.35h-30.28v37.28H418v-122.5h47.78q23.79 0 37.45 11.37t13.65 31.33q0 14.18-7 24.15T490 1477l29 41.17zm-9.27-59.33q8.74-7.17 8.75-20.47t-8.75-20.37q-8.76-7.1-25.38-7.09h-29.75V1466h29.75q16.62 0 25.38-7.16zM658.74 1502.94v15.23h-88.9v-122.5h86.45v15.22h-68.95v37.63h61.43v14.87h-61.43v39.55zM739.79 1410.89h-42v-15.22h101.32v15.22h-42v107.28h-17.32zM861 1511.43a60.22 60.22 0 01-23.36-22.49 64.65 64.65 0 010-64A60.29 60.29 0 01861 1402.4a72.43 72.43 0 0166.68 0 59.84 59.84 0 0123.32 22.4 65.59 65.59 0 010 64.23 59.77 59.77 0 01-23.27 22.4 72.35 72.35 0 01-66.68 0zm57.67-13.56a45 45 0 0017-16.89 49.73 49.73 0 000-48.13 44.94 44.94 0 00-17-16.88 48.09 48.09 0 00-24.24-6.13A49 49 0 00870 1416a44.51 44.51 0 00-17.15 16.88 49.66 49.66 0 000 48.13 44.6 44.6 0 0017.15 16.86 49.1 49.1 0 0024.41 6.12 48.19 48.19 0 0024.28-6.12zM1116.21 1395.67v122.5h-14.35l-73.5-91.35v91.35h-17.5v-122.5h14.35l73.5 91.35v-91.35zM1256.49 1487.54h-65.1l-13.48 30.63h-18l55.47-122.5h17.33l55.65 122.5H1270zm-6.13-14l-26.42-60-26.43 60zM1343.06 1410.89h-42v-15.22h101.32v15.22h-42v107.28h-17.32zM1464.3 1511.43a60.17 60.17 0 01-23.37-22.49 64.71 64.71 0 010-64 60.24 60.24 0 0123.37-22.49 72.41 72.41 0 0166.67 0 59.8 59.8 0 0123.28 22.4 65.59 65.59 0 010 64.23 59.73 59.73 0 01-23.28 22.4 72.33 72.33 0 01-66.67 0zm57.66-13.56a45 45 0 0017-16.89 49.66 49.66 0 000-48.13 44.94 44.94 0 00-17-16.88 48.09 48.09 0 00-24.24-6.13 49 49 0 00-24.41 6.13 44.58 44.58 0 00-17.15 16.88 49.73 49.73 0 000 48.13 44.67 44.67 0 0017.15 16.89 49.13 49.13 0 0024.41 6.12 48.19 48.19 0 0024.28-6.12zM1696 1518.17l-26.42-37.63c-3.27.24-5.84.35-7.7.35h-30.28v37.28h-17.5v-122.5h47.78q23.79 0 37.45 11.37t13.65 31.33q0 14.18-7 24.15t-20 14.52l29 41.13zm-9.27-59.33q8.74-7.17 8.75-20.47t-8.75-20.39q-8.76-7.1-25.38-7.09h-29.75V1466h29.75q16.65 0 25.41-7.16zM1080.78 1060.28L1134 968a14.91 14.91 0 002-7.49V487.93a7.5 7.5 0 00-7.5-7.5h-54.18a7.5 7.5 0 00-7.5 7.5v568.61a7.5 7.5 0 0013.96 3.74zM1229.85 480.43h-54.19a7.5 7.5 0 00-7.5 7.5v392.72a7.5 7.5 0 0014 3.75l53.18-92.27a15 15 0 002-7.49V487.93a7.5 7.5 0 00-7.49-7.5zM925.71 480.43h-54.18a7.5 7.5 0 00-7.5 7.5v472.59a14.91 14.91 0 002 7.49l53.18 92.27a7.5 7.5 0 0014-3.74V487.93a7.5 7.5 0 00-7.5-7.5zM1363.08 480.43h-86a7.5 7.5 0 00-7.5 7.5v216.84a7.5 7.5 0 0014 3.74l105.53-183.09a30 30 0 00-26.03-44.99zM764.66 792.13l53.18 92.27a7.5 7.5 0 0014-3.75V487.93a7.5 7.5 0 00-7.5-7.5h-54.19a7.5 7.5 0 00-7.5 7.5v296.71a15 15 0 002.01 7.49zM1027.09 480.43h-54.18a7.5 7.5 0 00-7.5 7.5v648.48a15 15 0 002 7.49l6.6 11.44a30 30 0 0052 0l6.6-11.44a15 15 0 002-7.49V487.93a7.5 7.5 0 00-7.52-7.5zM730.46 487.93a7.5 7.5 0 00-7.5-7.5h-86a30 30 0 00-26 45l105.5 183.08a7.5 7.5 0 0014-3.74z"
44+
/>
45+
</svg>
46+
</app-logo-with-text>
47+
</span>
48+
<span
49+
class="header__siteLogo__noText"
50+
>
51+
<app-logo-no-text>
52+
<svg
53+
class="svg"
54+
viewBox="0 0 1162.3 1162.3"
55+
xmlns="http://www.w3.org/2000/svg"
56+
>
57+
<path
58+
d="M661.9 836l53.2-92.3c1.3-2.3 2-4.9 2-7.5V263.7c0-4.1-3.4-7.5-7.5-7.5h-54.2c-4.1 0-7.5 3.4-7.5 7.5v568.6c0 4.1 3.4 7.5 7.6 7.4 2.6 0 5-1.4 6.4-3.7zM811 256.2h-54.2c-4.1 0-7.5 3.4-7.5 7.5v392.7c0 4.1 3.3 7.5 7.5 7.5 2.7 0 5.2-1.4 6.5-3.8l53.2-92.3c1.3-2.3 2-4.9 2-7.5V263.7c-.1-4.2-3.4-7.5-7.5-7.5zM506.8 256.2h-54.2c-4.1 0-7.5 3.4-7.5 7.5v472.6c0 2.6.7 5.2 2 7.5l53.2 92.3c2.1 3.6 6.7 4.8 10.2 2.8 2.3-1.3 3.8-3.8 3.8-6.5V263.7c0-4.2-3.3-7.5-7.5-7.5zM944.2 256.2h-86c-4.1 0-7.5 3.4-7.5 7.5v216.8c0 4.1 3.4 7.5 7.5 7.5 2.7 0 5.2-1.4 6.5-3.8l105.5-183.1c8.3-14.4 3.4-32.7-11-41-4.6-2.6-9.7-3.9-15-3.9zM345.8 567.9l53.2 92.3c2.1 3.6 6.7 4.8 10.2 2.8 2.3-1.3 3.8-3.8 3.8-6.5V263.7c0-4.1-3.4-7.5-7.5-7.5h-54.2c-4.1 0-7.5 3.4-7.5 7.5v296.7c0 2.6.6 5.2 2 7.5zM608.2 256.2H554c-4.1 0-7.5 3.4-7.5 7.5v648.5c0 2.6.7 5.2 2 7.5l6.6 11.4c8.3 14.4 26.6 19.3 41 11 4.6-2.6 8.4-6.4 11-11l6.6-11.4c1.3-2.3 2-4.9 2-7.5V263.7c0-4.2-3.3-7.5-7.5-7.5zM311.6 263.7c0-4.1-3.4-7.5-7.5-7.5h-86c-16.6 0-30 13.4-30 30 0 5.3 1.4 10.5 4 15l105.5 183.1c2.1 3.6 6.7 4.8 10.2 2.8 2.3-1.3 3.8-3.8 3.8-6.5V263.7z"
59+
/>
60+
</svg>
61+
</app-logo-no-text>
62+
</span>
63+
</a>
64+
</div>
4265
<ul
4366
aria-expanded="false"
4467
class="header__links header__links--hide"

‎apps/fretonator-web/src/app/common/header/header.component.html

Lines changed: 24 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,31 @@
11
<header class="header">
2-
<a
3-
[routerLink]="['/']"
4-
class="header__siteLogo"
5-
aria-label="Navigate to home"
6-
>
7-
<app-logo-with-text></app-logo-with-text>
8-
</a>
9-
10-
<button class="hamburger"
11-
[class.is__open]="isMenuVisible"
12-
(click)="toggleMenu()"
13-
[attr.aria-expanded]="isMenuVisible"
14-
aria-label="Menu Toggle"
15-
aria-controls="headerLinks"
16-
type="button">
2+
<div class="header__topRow">
3+
<button class="hamburger"
4+
[class.is__open]="isMenuVisible"
5+
(click)="toggleMenu()"
6+
[attr.aria-expanded]="isMenuVisible"
7+
aria-label="Menu Toggle"
8+
aria-controls="headerLinks"
9+
type="button">
1710
<span class="hamburger__box">
1811
<span class="hamburger__inner"></span>
1912
</span>
20-
</button>
13+
</button>
14+
15+
<a
16+
[routerLink]="['/']"
17+
class="header__siteLogo"
18+
aria-label="Navigate to home"
19+
>
20+
<span class="header__siteLogo__text">
21+
<app-logo-with-text></app-logo-with-text>
22+
</span>
23+
<span class="header__siteLogo__noText">
24+
<app-logo-no-text></app-logo-no-text>
25+
</span>
26+
</a>
27+
28+
</div>
2129

2230
<ul class="header__links"
2331
id="headerLinks"

‎apps/fretonator-web/src/app/common/header/header.component.scss

Lines changed: 32 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -9,25 +9,51 @@
99
flex-direction: column;
1010
justify-content: center;
1111
align-content: center;
12-
padding-top: pxToRem($grid-unit);
12+
}
13+
14+
.header__topRow {
15+
display: flex;
16+
flex-direction: row;
17+
justify-content: space-between;
18+
align-items: center;
19+
20+
@media screen and (min-width: $screen-med) {
21+
flex-direction: column;
22+
justify-content: center;
23+
}
1324
}
1425

1526
.header__siteLogo {
1627
display: flex;
1728
justify-content: center;
1829
align-items: center;
19-
height: pxToRem(120);
20-
width: pxToRem(120);
30+
width: pxToRem(60);
2131
cursor: pointer;
22-
margin-left: auto;
23-
margin-right: auto;
2432
color: var(--offwhite);
2533

2634
@include focus_accessible();
2735

2836
@media screen and (min-width: $screen-med) {
2937
height: pxToRem(140);
3038
width: pxToRem(140);
39+
margin-left: auto;
40+
margin-right: auto;
41+
}
42+
}
43+
44+
.header__siteLogo__text {
45+
display: none;
46+
47+
@media screen and (min-width: $screen-med) {
48+
display: flex;
49+
}
50+
}
51+
52+
.header__siteLogo__noText {
53+
display: flex;
54+
55+
@media screen and (min-width: $screen-med) {
56+
display: none;
3157
}
3258
}
3359

@@ -46,7 +72,7 @@
4672
text-transform: none;
4773
background-color: transparent;
4874
border: 0;
49-
margin: 0;
75+
margin: pxToRem($grid-unit / 2);
5076
overflow: visible;
5177

5278
&:hover {

‎apps/fretonator-web/src/app/common/header/header.module.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,15 @@ import { HeaderComponent } from './header.component';
44
import { RouterModule } from '@angular/router';
55
import { LogoWithTextModule } from '../svgs/logo-with-text/logo-with-text.module';
66
import { LogoWithTextComponent } from '../svgs/logo-with-text/logo-with-text.component';
7+
import { LogoNoTextModule } from '../svgs/logo-no-text/logo-no-text.module';
78

89
@NgModule({
910
declarations: [HeaderComponent],
1011
imports: [
1112
CommonModule,
1213
RouterModule,
1314
LogoWithTextModule,
15+
LogoNoTextModule
1416
],
1517
exports: [
1618
HeaderComponent,

‎apps/fretonator-web/src/app/common/svgs/logo-no-text/logo-no-text.component.html

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1162.3 1162.3" class="svg">
2+
<path
3+
d="M661.9 836l53.2-92.3c1.3-2.3 2-4.9 2-7.5V263.7c0-4.1-3.4-7.5-7.5-7.5h-54.2c-4.1 0-7.5 3.4-7.5 7.5v568.6c0 4.1 3.4 7.5 7.6 7.4 2.6 0 5-1.4 6.4-3.7zM811 256.2h-54.2c-4.1 0-7.5 3.4-7.5 7.5v392.7c0 4.1 3.3 7.5 7.5 7.5 2.7 0 5.2-1.4 6.5-3.8l53.2-92.3c1.3-2.3 2-4.9 2-7.5V263.7c-.1-4.2-3.4-7.5-7.5-7.5zM506.8 256.2h-54.2c-4.1 0-7.5 3.4-7.5 7.5v472.6c0 2.6.7 5.2 2 7.5l53.2 92.3c2.1 3.6 6.7 4.8 10.2 2.8 2.3-1.3 3.8-3.8 3.8-6.5V263.7c0-4.2-3.3-7.5-7.5-7.5zM944.2 256.2h-86c-4.1 0-7.5 3.4-7.5 7.5v216.8c0 4.1 3.4 7.5 7.5 7.5 2.7 0 5.2-1.4 6.5-3.8l105.5-183.1c8.3-14.4 3.4-32.7-11-41-4.6-2.6-9.7-3.9-15-3.9zM345.8 567.9l53.2 92.3c2.1 3.6 6.7 4.8 10.2 2.8 2.3-1.3 3.8-3.8 3.8-6.5V263.7c0-4.1-3.4-7.5-7.5-7.5h-54.2c-4.1 0-7.5 3.4-7.5 7.5v296.7c0 2.6.6 5.2 2 7.5zM608.2 256.2H554c-4.1 0-7.5 3.4-7.5 7.5v648.5c0 2.6.7 5.2 2 7.5l6.6 11.4c8.3 14.4 26.6 19.3 41 11 4.6-2.6 8.4-6.4 11-11l6.6-11.4c1.3-2.3 2-4.9 2-7.5V263.7c0-4.2-3.3-7.5-7.5-7.5zM311.6 263.7c0-4.1-3.4-7.5-7.5-7.5h-86c-16.6 0-30 13.4-30 30 0 5.3 1.4 10.5 4 15l105.5 183.1c2.1 3.6 6.7 4.8 10.2 2.8 2.3-1.3 3.8-3.8 3.8-6.5V263.7z"/>
4+
</svg>

‎apps/fretonator-web/src/app/common/svgs/logo-no-text/logo-no-text.component.scss

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
.svg {
2+
flex: 1;
3+
height: 100%;
4+
width: 100%;
5+
fill: currentColor;
6+
}

‎apps/fretonator-web/src/app/common/svgs/logo-no-text/logo-no-text.component.spec.ts

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2+
3+
import { LogoNoTextComponent } from './logo-no-text.component';
4+
5+
describe('LogoNoTextComponent', () => {
6+
let component: LogoNoTextComponent;
7+
let fixture: ComponentFixture<LogoNoTextComponent>;
8+
9+
beforeEach(async(() => {
10+
TestBed.configureTestingModule({
11+
declarations: [ LogoNoTextComponent ]
12+
})
13+
.compileComponents();
14+
}));
15+
16+
beforeEach(() => {
17+
fixture = TestBed.createComponent(LogoNoTextComponent);
18+
component = fixture.componentInstance;
19+
fixture.detectChanges();
20+
});
21+
22+
it('should create', () => {
23+
expect(component).toBeTruthy();
24+
});
25+
});

‎apps/fretonator-web/src/app/common/svgs/logo-no-text/logo-no-text.component.ts

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import { Component } from '@angular/core';
2+
3+
@Component({
4+
selector: 'app-logo-no-text',
5+
templateUrl: './logo-no-text.component.html',
6+
styleUrls: ['./logo-no-text.component.scss']
7+
})
8+
export class LogoNoTextComponent {
9+
10+
}

‎apps/fretonator-web/src/app/common/svgs/logo-no-text/logo-no-text.module.ts

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import { NgModule } from '@angular/core';
2+
import { CommonModule } from '@angular/common';
3+
import { LogoNoTextComponent } from './logo-no-text.component';
4+
5+
6+
7+
@NgModule({
8+
declarations: [LogoNoTextComponent],
9+
exports: [
10+
LogoNoTextComponent
11+
],
12+
imports: [
13+
CommonModule
14+
]
15+
})
16+
export class LogoNoTextModule { }

‎apps/fretonator-web/src/styles/_vars.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,12 +17,12 @@ $mode_selector_max_width: 800px !default;
1717
$infoContainer_info_row_height: pxToRem($grid-unit * 8);
1818

1919
$hamburger_padding-x: 16px;
20-
$hamburger_padding-y: 16px;
20+
$hamburger_padding-y: 24px;
2121
$hamburger_layer-width: 32px;
2222
$hamburger_layer-height: 3px;
2323
$hamburger_layer-spacing: 6px;
2424
$hamburger_layer-color: #fecdaa;
2525
$hamburger_layer-border-radius: 2px;
26-
$hamburger_hover-opacity: 0.7;
26+
$hamburger_hover-opacity: 0.9;
2727
$hamburger_active-layer-color: $hamburger_layer-color;
2828
$hamburger_active-hover-opacity: $hamburger_hover-opacity;

0 commit comments

Comments
 (0)