Skip to content

Add mobile-responsive header with hamburger menu #77

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
damianlegawiec merged 7 commits into from
Mar 23, 2026
Merged

Add mobile-responsive header with hamburger menu #77

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
ef9a990
Add mobile-responsive header with hamburger menu and search overlay
Cichorek Mar 23, 2026
eb51924
Fix PR review findings for mobile header changes
Cichorek Mar 23, 2026
facbb21
Close search overlay on Escape via event bubbling
Cichorek Mar 23, 2026
152bd94
Add aria-expanded and aria-controls to search toggle button
Cichorek Mar 23, 2026
44ee3c5
Close search overlay on navigation and improve accessibility
Cichorek Mar 23, 2026
7798eac
fixes
damianlegawiec Mar 23, 2026
74bd08b
SEO fixes
damianlegawiec Mar 23, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
395 changes: 395 additions & 0 deletions public/hamburger-menu.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,395 @@
{
"nm": "Main Scene",
"ddd": 0,
"h": 667,
"w": 375,
"meta": { "g": "@lottiefiles/creator 1.82.0" },
"layers": [
{
"ty": 4,
"nm": "Top",
"sr": 1,
"st": 0,
"op": 300,
"ip": 0,
"hd": false,
"ddd": 0,
"bm": 0,
"hasMask": false,
"ao": 0,
"ks": {
"a": { "a": 0, "k": [0, 0, 0], "ix": 1 },
"s": { "a": 0, "k": [100, 100, 100], "ix": 6 },
"sk": { "a": 0, "k": 0 },
"p": {
"a": 1,
"k": [
{
"o": { "x": 0.333, "y": 0 },
"i": { "x": 0.667, "y": 1 },
"s": [187.5, 282.993],
"t": 0
},
{
"o": { "x": 0.333, "y": 0 },
"i": { "x": 0.667, "y": 1 },
"s": [187.5, 332.993, 0],
"t": 15,
"ti": [0, 0.165, 0],
"to": [0, -0.118, 0]
},
{
"o": { "x": 0.333, "y": 0 },
"i": { "x": 0.667, "y": 1 },
"s": [187.5, 332.993, 0],
"t": 58,
"ti": [0, 0.319, 0],
"to": [0, -0.118, 0]
},
{
"o": { "x": 0.333, "y": 0 },
"i": { "x": 0.667, "y": 1 },
"s": [187.5, 333, 0],
"t": 60,
"ti": [0, 2.29, 0],
"to": [0, -5.714, 0]
},
{ "s": [187.5, 283, 0], "t": 75 }
],
"ix": 2
},
"r": {
"a": 1,
"k": [
{
"o": { "x": 0.333, "y": 0 },
"i": { "x": 0.667, "y": 1 },
"s": [0],
"t": 15
},
{
"o": { "x": 0.333, "y": 0 },
"i": { "x": 0.667, "y": 1 },
"s": [45],
"t": 30
},
{
"o": { "x": 0.333, "y": 0 },
"i": { "x": 0.667, "y": 1 },
"s": [45],
"t": 45
},
{ "s": [0], "t": 60 }
],
"ix": 10
},
"sa": { "a": 0, "k": 0 },
"o": { "a": 0, "k": 100, "ix": 11 }
},
"shapes": [
{
"ty": "gr",
"bm": 0,
"hd": false,
"mn": "ADBE Vector Group",
"nm": "Top",
"ix": 1,
"cix": 2,
"np": 2,
"it": [
{
"ty": "sh",
"bm": 0,
"hd": false,
"mn": "ADBE Vector Shape - Group",
"nm": "Path 1",
"ix": 1,
"d": 1,
"ks": {
"a": 0,
"k": {
"c": false,
"i": [[0, 0], [0, 0]],
"o": [[0, 0], [0, 0]],
"v": [[-80.5, 0], [80.5, 0]]
},
"ix": 2
}
},
{
"ty": "st",
"bm": 0,
"hd": false,
"mn": "ADBE Vector Graphic - Stroke",
"nm": "Stroke 1",
"lc": 2,
"lj": 1,
"ml": 4,
"o": { "a": 0, "k": 100, "ix": 4 },
"w": { "a": 0, "k": 16, "ix": 5 },
"c": { "a": 0, "k": [0, 0, 0], "ix": 3 }
},
{
"ty": "tr",
"a": { "a": 0, "k": [0, 0], "ix": 1 },
"s": { "a": 0, "k": [100, 100], "ix": 3 },
"sk": { "a": 0, "k": 0, "ix": 4 },
"p": { "a": 0, "k": [0, 0], "ix": 2 },
"r": { "a": 0, "k": 0, "ix": 6 },
"sa": { "a": 0, "k": 0, "ix": 5 },
"o": { "a": 0, "k": 100, "ix": 7 }
}
]
}
],
"ind": 1
},
{
"ty": 4,
"nm": "Middle",
"sr": 1,
"st": 0,
"op": 300,
"ip": 0,
"hd": false,
"ddd": 0,
"bm": 0,
"hasMask": false,
"ao": 0,
"ks": {
"a": { "a": 0, "k": [0, 0, 0], "ix": 1 },
"s": { "a": 0, "k": [100, 100, 100], "ix": 6 },
"sk": { "a": 0, "k": 0 },
"p": { "a": 0, "k": [187.5, 332.993], "ix": 2 },
"r": { "a": 0, "k": 0, "ix": 10 },
"sa": { "a": 0, "k": 0 },
"o": {
"a": 1,
"k": [
{
"o": { "x": 0.333, "y": 0 },
"i": { "x": 0.667, "y": 1 },
"s": [100],
"t": 13
},
{
"o": { "x": 0.333, "y": 0 },
"i": { "x": 0.667, "y": 1 },
"s": [0],
"t": 15
},
{
"o": { "x": 0.333, "y": 0 },
"i": { "x": 0.667, "y": 1 },
"s": [0],
"t": 60
},
{ "s": [100], "t": 62 }
],
"ix": 11
}
},
"shapes": [
{
"ty": "gr",
"bm": 0,
"hd": false,
"mn": "ADBE Vector Group",
"nm": "Middle",
"ix": 1,
"cix": 2,
"np": 2,
"it": [
{
"ty": "sh",
"bm": 0,
"hd": false,
"mn": "ADBE Vector Shape - Group",
"nm": "Path 1",
"ix": 1,
"d": 1,
"ks": {
"a": 0,
"k": {
"c": false,
"i": [[0, 0], [0, 0]],
"o": [[0, 0], [0, 0]],
"v": [[-80.5, 0], [80.5, 0]]
},
"ix": 2
}
},
{
"ty": "st",
"bm": 0,
"hd": false,
"mn": "ADBE Vector Graphic - Stroke",
"nm": "Stroke 1",
"lc": 2,
"lj": 1,
"ml": 4,
"o": { "a": 0, "k": 100, "ix": 4 },
"w": { "a": 0, "k": 16, "ix": 5 },
"c": { "a": 0, "k": [0, 0, 0], "ix": 3 }
},
{
"ty": "tr",
"a": { "a": 0, "k": [0, 0], "ix": 1 },
"s": { "a": 0, "k": [100, 100], "ix": 3 },
"sk": { "a": 0, "k": 0, "ix": 4 },
"p": { "a": 0, "k": [0, 0], "ix": 2 },
"r": { "a": 0, "k": 0, "ix": 6 },
"sa": { "a": 0, "k": 0, "ix": 5 },
"o": { "a": 0, "k": 100, "ix": 7 }
}
]
}
],
"ind": 2
},
{
"ty": 4,
"nm": "Bottom",
"sr": 1,
"st": 0,
"op": 300,
"ip": 0,
"hd": false,
"ddd": 0,
"bm": 0,
"hasMask": false,
"ao": 0,
"ks": {
"a": { "a": 0, "k": [0, 0, 0], "ix": 1 },
"s": { "a": 0, "k": [100, 100, 100], "ix": 6 },
"sk": { "a": 0, "k": 0 },
"p": {
"a": 1,
"k": [
{
"o": { "x": 0.333, "y": 0 },
"i": { "x": 0.667, "y": 1 },
"s": [187.5, 382.993],
"t": 0
},
{
"o": { "x": 0.333, "y": 0 },
"i": { "x": 0.667, "y": 1 },
"s": [187.5, 333, 0],
"t": 15,
"ti": [0, -0.001, 0],
"to": [0, 0.001, 0]
},
{
"o": { "x": 0.333, "y": 0 },
"i": { "x": 0.667, "y": 1 },
"s": [187.5, 333, 0],
"t": 58,
"ti": [0, -0.7, 0],
"to": [0, 0.001, 0]
},
{
"o": { "x": 0.333, "y": 0 },
"i": { "x": 0.667, "y": 1 },
"s": [187.5, 333, 0],
"t": 60,
"ti": [0, -2.242, 0],
"to": [0, 5.605, 0]
},
{ "s": [187.5, 383, 0], "t": 75 }
],
"ix": 2
},
"r": {
"a": 1,
"k": [
{
"o": { "x": 0.333, "y": 0 },
"i": { "x": 0.667, "y": 1 },
"s": [0],
"t": 15
},
{
"o": { "x": 0.333, "y": 0 },
"i": { "x": 0.667, "y": 1 },
"s": [-45],
"t": 30
},
{
"o": { "x": 0.333, "y": 0 },
"i": { "x": 0.667, "y": 1 },
"s": [-45],
"t": 45
},
{ "s": [0], "t": 60 }
],
"ix": 10
},
"sa": { "a": 0, "k": 0 },
"o": { "a": 0, "k": 100, "ix": 11 }
},
"shapes": [
{
"ty": "gr",
"bm": 0,
"hd": false,
"mn": "ADBE Vector Group",
"nm": "Bottom",
"ix": 1,
"cix": 2,
"np": 2,
"it": [
{
"ty": "sh",
"bm": 0,
"hd": false,
"mn": "ADBE Vector Shape - Group",
"nm": "Path 1",
"ix": 1,
"d": 1,
"ks": {
"a": 0,
"k": {
"c": false,
"i": [[0, 0], [0, 0]],
"o": [[0, 0], [0, 0]],
"v": [[-80.5, 0], [80.5, 0]]
},
"ix": 2
}
},
{
"ty": "st",
"bm": 0,
"hd": false,
"mn": "ADBE Vector Graphic - Stroke",
"nm": "Stroke 1",
"lc": 2,
"lj": 1,
"ml": 4,
"o": { "a": 0, "k": 100, "ix": 4 },
"w": { "a": 0, "k": 16, "ix": 5 },
"c": { "a": 0, "k": [0, 0, 0], "ix": 3 }
},
{
"ty": "tr",
"a": { "a": 0, "k": [0, 0], "ix": 1 },
"s": { "a": 0, "k": [100, 100], "ix": 3 },
"sk": { "a": 0, "k": 0, "ix": 4 },
"p": { "a": 0, "k": [0, 0], "ix": 2 },
"r": { "a": 0, "k": 0, "ix": 6 },
"sa": { "a": 0, "k": 0, "ix": 5 },
"o": { "a": 0, "k": 100, "ix": 7 }
}
]
}
],
"ind": 3
}
],
"v": "5.7.0",
"fr": 60,
"op": 97,
"ip": 0,
"assets": []
}
Binary file added public/hamburger-menu.lottie
View file
Open in desktop
Binary file not shown.
Loading
Loading