diff --git a/frontend/packages/core/components/Navbar.tsx b/frontend/packages/core/components/Navbar.tsx
index 587173ffd8e61f3f79bbfec1a8acaac0367b64fe..6c578b5dc55a4589d08099affdc033a3bb74b039 100644
--- a/frontend/packages/core/components/Navbar.tsx
+++ b/frontend/packages/core/components/Navbar.tsx
@@ -101,7 +101,9 @@ const changeLanguage = () => {
 
 const Navbar: FunctionComponent = () => {
     const {t, i18n} = useTranslation('common');
-    const {pathname} = useRouter();
+    const {pathname, basePath} = useRouter();
+
+    const path = useMemo(() => pathname.replace(basePath, ''), [pathname, basePath]);
 
     const indexUrl = useMemo(() => {
         // TODO: fix type
@@ -125,7 +127,7 @@ const Navbar: FunctionComponent = () => {
                     return (
                         // https://nextjs.org/docs/api-reference/next/link#if-the-child-is-a-custom-component-that-wraps-an-a-tag
                         <Link href={href} key={name} passHref>
-                            <NavItem active={pathname === href}>
+                            <NavItem active={path === href}>
                                 <span className="nav-text">{t(name)}</span>
                             </NavItem>
                         </Link>