Fjern siste rest av .less

.prettierignore

@@ -1,5 +1,4 @@
 *.json
-*.less
 *.yaml
 *.yml
 *.md

package.json

@@ -124,8 +124,6 @@
     "husky": "^9.1.0",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
-    "less": "^4.2.0",
-    "less-loader": "^12.2.0",
     "lint-staged": "^15.2.0",
     "npm-run-all": "^4.1.5",
     "prettier": "^3.3.1",
@@ -147,7 +145,7 @@
       }
     },
     "moduleNameMapper": {
-      "\\.(css|less|svg)$": "<rootDir>/src/mockFile.js"
+      "\\.(css|svg)$": "<rootDir>/src/mockFile.js"
     },
     "transformIgnorePatterns": [
       "/node_modules/(?!(@navikt)/)"

src/frontend/index.tsx

@@ -1,5 +1,3 @@
-import './index.less';
-
 import React from 'react';
 
 import axe from '@axe-core/react';

src/frontend/komponenter/Container.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 
-import classNames from 'classnames';
 import { BrowserRouter as Router, Navigate, Route, Routes } from 'react-router-dom';
+import styled from 'styled-components';
 
 import FagsakContainer from './Fagsak/FagsakContainer';
 import { HeaderMedSøk } from './Felleskomponenter/HeaderMedSøk/HeaderMedSøk';
@@ -19,6 +19,20 @@ import { FagsakProvider } from '../context/Fagsak/FagsakContext';
 import { Oppgaver } from '../context/OppgaverContext';
 import { TidslinjeProvider } from '../context/TidslinjeContext';
 
+const Main = styled.main<{ $systemetLaster: boolean }>`
+    position: fixed;
+    width: 100%;
+    height: 100%;
+
+    ${props => {
+        if (props.$systemetLaster)
+            return `
+                filter: blur(12px);
+                -webkit-filter: blur(12px);
+        `;
+    }};
+`;
+
 const Container: React.FC = () => {
     const { autentisert, systemetLaster, innloggetSaksbehandler, appInfoModal } = useApp();
 
@@ -30,7 +44,7 @@ const Container: React.FC = () => {
                     {systemetLaster() && <SystemetLaster />}
                     <Toasts />
 
-                    <main className={classNames('container', systemetLaster() && 'blur')}>
+                    <Main $systemetLaster={systemetLaster()}>
                         <HeaderMedSøk
                             brukerNavn={innloggetSaksbehandler?.displayName}
                             brukerEnhet={innloggetSaksbehandler?.enhet}
@@ -57,7 +71,7 @@ const Container: React.FC = () => {
                                 <Route path="/" element={<Navigate to="/oppgaver" />} />
                             </Routes>
                         </FagsakProvider>
-                    </main>
+                    </Main>
                 </>
             ) : (
                 <UgyldigSesjon />

src/frontend/komponenter/Felleskomponenter/SystemetLaster/SystemetLaster.tsx

@@ -1,19 +1,26 @@
 import * as React from 'react';
 
-import { Loader, Heading } from '@navikt/ds-react';
+import styled from 'styled-components';
+
+import { Loader, Heading, VStack } from '@navikt/ds-react';
+import { AZIndexTooltip } from '@navikt/ds-tokens/dist/tokens';
+
+const PosisjonertVStack = styled(VStack)`
+    position: fixed;
+    width: 100vw;
+    height: 100vh;
+    display: flex;
+    align-items: center;
+    top: 20%;
+    z-index: ${AZIndexTooltip};
+`;
 
 const SystemetLaster = () => {
     return (
-        <div className={'systemet-laster'}>
-            <div className={'systemet-laster__content'}>
-                <Heading
-                    size={'medium'}
-                    className={'systemet-laster__content--tekst'}
-                    children={'Systemet laster'}
-                />
-                <Loader size="large" transparent={true} title="Systemet laster data" />
-            </div>
-        </div>
+        <PosisjonertVStack gap="2">
+            <Heading size={'medium'} children={'Systemet laster'} />
+            <Loader size="large" transparent={true} title="Systemet laster data" />
+        </PosisjonertVStack>
     );
 };
 

src/webpack/webpack.common.js

@@ -14,7 +14,7 @@ const publicUrl = '/assets';
 
 const baseConfig = {
     resolve: {
-        extensions: ['.ts', '.tsx', '.js', '.jsx', '.json', '.less'],
+        extensions: ['.ts', '.tsx', '.js', '.jsx', '.json'],
         fallback: { crypto: false },
     },
     entry: ['./src/frontend/index.tsx'],
@@ -63,7 +63,7 @@ const baseConfig = {
                 },
             },
             {
-                test: /\.(less|css)$/,
+                test: /\.(css)$/,
                 use: [
                     { loader: 'style-loader' },
                     {
@@ -75,7 +75,6 @@ const baseConfig = {
                             importLoaders: 2,
                         },
                     },
-                    { loader: 'less-loader' },
                 ],
             },
         ],