Altinn
diff --git a/‎backend/src/Altinn.AccessManagement.UI/Altinn.AccessManagement.UI/Views/Home/Index.cshtml‎
Lines changed: 0 additions & 1 deletion b/‎backend/src/Altinn.AccessManagement.UI/Altinn.AccessManagement.UI/Views/Home/Index.cshtml‎
Lines changed: 0 additions & 1 deletion
diff --git a/‎src/features/amUI/common/PageLayoutWrapper/NavigationFocus.module.css‎
Lines changed: 10 additions & 0 deletions b/‎src/features/amUI/common/PageLayoutWrapper/NavigationFocus.module.css‎
Lines changed: 10 additions & 0 deletions
diff --git a/‎src/features/amUI/common/PageLayoutWrapper/NavigationFocus.tsx‎
Lines changed: 32 additions & 0 deletions b/‎src/features/amUI/common/PageLayoutWrapper/NavigationFocus.tsx‎
Lines changed: 32 additions & 0 deletions
diff --git a/‎src/features/amUI/common/PageLayoutWrapper/PageLayoutWrapper.tsx‎
Lines changed: 3 additions & 7 deletions b/‎src/features/amUI/common/PageLayoutWrapper/PageLayoutWrapper.tsx‎
Lines changed: 3 additions & 7 deletions
@@ -6,7 +6,6 @@
 <!DOCTYPE html>
   <html lang="no">
   <head>
-    <base href="~/accessmanagement/ui/"/>
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 
@@ -0,0 +1,10 @@
+.srOnly {
+  border: 0;
+  clip: rect(0 0 0 0);
+  height: 1px;
+  overflow: hidden;
+  padding: 0;
+  position: absolute;
+  white-space: nowrap;
+  width: 1px;
+}
@@ -0,0 +1,32 @@
+import { useEffect, useRef, useState } from 'react';
+import { useLocation } from 'react-router';
+import classes from './NavigationFocus.module.css';
+
+export const NavigationFocus = () => {
+  const { pathname } = useLocation();
+  const skipRef = useRef<HTMLDivElement | null>(null);
+  const [title, setTitle] = useState('');
+
+  useEffect(() => {
+    const rafId = requestAnimationFrame(() => {
+      setTitle(document.title);
+    });
+    return () => cancelAnimationFrame(rafId);
+  }, [pathname]);
+
+  useEffect(() => {
+    if (title) {
+      skipRef.current?.focus({ preventScroll: true });
+    }
+  }, [title]);
+
+  return (
+    <div
+      className={classes.srOnly}
+      tabIndex={-1}
+      ref={skipRef}
+    >
+      {title}
+    </div>
+  );
+};
@@ -1,7 +1,6 @@
 import React from 'react';
 import type { LanguageCode } from '@altinn/altinn-components';
 import { Layout, RootProvider, Snackbar } from '@altinn/altinn-components';
-import { useLocation } from 'react-router';
 
 import { useGetReporteeQuery } from '@/rtk/features/userInfoApi';
 
@@ -11,8 +10,8 @@ import { useFooter } from './useFooter';
 import { useHeader } from './useHeader';
 
 import { useTranslation } from 'react-i18next';
-import { GeneralPath } from '@/routes/paths';
 import { useSidebarItems } from './useSidebarItems';
+import { NavigationFocus } from './NavigationFocus';
 
 interface PageLayoutWrapperProps {
   openAccountMenu?: boolean;
@@ -31,7 +30,6 @@ export const PageLayoutWrapper = ({
 }: PageLayoutWrapperProps): React.ReactNode => {
   const { t } = useTranslation();
   const { data: reportee } = useGetReporteeQuery();
-  const { pathname, search } = useLocation();
 
   const { menuGroups } = useGlobalMenu();
 
@@ -44,6 +42,7 @@ export const PageLayoutWrapper = ({
 
   return (
     <RootProvider languageCode={languageCode as LanguageCode}>
+      <NavigationFocus />
       <Layout
         color={reportee?.type ? getAccountType(reportee.type) : 'neutral'}
         theme='subtle'
@@ -55,10 +54,7 @@ export const PageLayoutWrapper = ({
           variant: escalateBannerSeverity ? 'alert' : undefined,
         }}
         skipLink={{
-          href:
-            pathname === '/'
-              ? `${GeneralPath.BasePath}${search}#main-content`
-              : `${GeneralPath.BasePath}${pathname}${search}#main-content`,
+          href: '#main-content',
           color: 'inherit',
           size: 'xs',
           children: t('common.skiplink'),