From 293a03a6397c2ffae8f3d808879b2828f5169d54 Mon Sep 17 00:00:00 2001 From: Malin J Date: Thu, 12 Jan 2023 13:43:30 +0100 Subject: [PATCH] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20Rewrite=20chakraUI=20to=20?= =?UTF-8?q?use=20baseprovider=20#1444?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web/pages/_app.tsx | 20 ++++++++++++++++---- 1 file changed, 16 insertions(+), 4 deletions(-) diff --git a/web/pages/_app.tsx b/web/pages/_app.tsx index 827f7b44b..487eada23 100644 --- a/web/pages/_app.tsx +++ b/web/pages/_app.tsx @@ -1,7 +1,7 @@ import type { AppProps } from 'next/app' import type { NextPage } from 'next' import type { ReactNode } from 'react' -import { ChakraProvider } from '@chakra-ui/react' +import { ChakraBaseProvider } from '@chakra-ui/react' import Head from 'next/head' import { useRouter } from 'next/router' import { GlobalStyle } from '../styles/globalStyles' @@ -18,6 +18,7 @@ import { enableDynatrace, disableDynatrace } from '../pageComponents/Dynatrace' import { SWRConfig } from 'swr' import { SkipNavLink as NewSkipNavLink, SkipNavContent } from '@chakra-ui/skip-nav' import { Flags } from '../common/helpers/datasetHelpers' +import styled from 'styled-components' // import archivedStyles from '@equinor/energyvision-legacy-css' // import { AppInsightsContext, AppInsightsErrorBoundary } from '@microsoft/applicationinsights-react-js' @@ -104,11 +105,22 @@ function MyApp({ Component, pageProps }: CustomAppProps): JSX.Element { useConsentState('statistics', enableStatisticsCookies, disableStatisticsCookies) + const StyledSkipLink = styled(NewSkipNavLink)` + &:focus { + background: white; + padding: var(--space-medium); + border: 1px solid black; + position: sticky; + border-radius: 7px; + margin: var(--space-medium); + top: 10%; + } + ` return ( - + - {Flags.IS_DEV && Skip to Content} + {Flags.IS_DEV && Skip to Content} <> @@ -123,7 +135,7 @@ function MyApp({ Component, pageProps }: CustomAppProps): JSX.Element { )} - + ) }