From 971f3e98d13f4e3e5fd8c27a8d2293ac08d72628 Mon Sep 17 00:00:00 2001 From: Ayush Jhawar Date: Mon, 13 Oct 2025 23:46:28 +0530 Subject: [PATCH 1/3] Fix size of side-navbar on mobile view --- src/css/custom.css | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/src/css/custom.css b/src/css/custom.css index 0c4a732..0d6682b 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -247,6 +247,12 @@ figure img { padding: 1rem; } +@media (max-width: 996px) { + :root { + --ifm-navbar-sidebar-width: 23.125rem; + } +} + /* Make top navbar links smaller */ .navbar__link { font-size: 14px; From fd40fab13528ef38d4ce392bb81a370de29e1e63 Mon Sep 17 00:00:00 2001 From: Ayush Jhawar Date: Mon, 13 Oct 2025 23:47:04 +0530 Subject: [PATCH 2/3] Add blur effect when active --- src/css/custom.css | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/src/css/custom.css b/src/css/custom.css index 0d6682b..9cf1acc 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -253,6 +253,17 @@ figure img { } } +/* Add blur effect to backdrop when sidebar is open */ +.navbar-sidebar__backdrop { + backdrop-filter: blur(3px); + -webkit-backdrop-filter: blur(8px); + background-color: rgba(0, 0, 0, 0.3) !important; +} + +[data-theme="dark"] .navbar-sidebar__backdrop { + background-color: rgba(0, 0, 0, 0.5) !important; +} + /* Make top navbar links smaller */ .navbar__link { font-size: 14px; From edfa4f73925948869a894ce2114ab92f07c887a0 Mon Sep 17 00:00:00 2001 From: Ayush Jhawar <111112495+Ayushjhawar8@users.noreply.github.com> Date: Thu, 16 Oct 2025 19:12:28 +0530 Subject: [PATCH 3/3] Remove sidebar backdrop blur effect styles Removed blur effect styles for sidebar backdrop. --- src/css/custom.css | 11 ----------- 1 file changed, 11 deletions(-) diff --git a/src/css/custom.css b/src/css/custom.css index 9cf1acc..0d6682b 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -253,17 +253,6 @@ figure img { } } -/* Add blur effect to backdrop when sidebar is open */ -.navbar-sidebar__backdrop { - backdrop-filter: blur(3px); - -webkit-backdrop-filter: blur(8px); - background-color: rgba(0, 0, 0, 0.3) !important; -} - -[data-theme="dark"] .navbar-sidebar__backdrop { - background-color: rgba(0, 0, 0, 0.5) !important; -} - /* Make top navbar links smaller */ .navbar__link { font-size: 14px;