diff --git a/packages/client/src/hooks/use-safari-100vh.tsx b/packages/client/src/hooks/use-safari-100vh.tsx deleted file mode 100644 index 84b82bb..0000000 --- a/packages/client/src/hooks/use-safari-100vh.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import { useEffect } from 'react'; - -export function useSafari100vh() { - useEffect(() => { - const appHeight = () => { - const doc = document.documentElement; - doc.style.setProperty('--app-height', `${window.innerHeight}px`); - }; - window.addEventListener('resize', appHeight); - appHeight(); - - return () => { - window.removeEventListener('resize', appHeight); - }; - }, []); -} diff --git a/packages/client/src/pages/_app.tsx b/packages/client/src/pages/_app.tsx index 27e6fd7..69fdc7a 100644 --- a/packages/client/src/pages/_app.tsx +++ b/packages/client/src/pages/_app.tsx @@ -1,13 +1,11 @@ import type { AppProps } from 'next/app'; import Head from 'next/head'; -import { useSafari100vh } from 'hooks/use-safari-100vh'; import { useTheme } from 'hooks/use-theme'; import 'viewerjs/dist/viewer.css'; import 'styles/globals.scss'; import 'tiptap/styles/index.scss'; function MyApp({ Component, pageProps }: AppProps) { - useSafari100vh(); useTheme(); return ( diff --git a/packages/client/src/styles/reset.scss b/packages/client/src/styles/reset.scss index 8678e09..c5d8a77 100644 --- a/packages/client/src/styles/reset.scss +++ b/packages/client/src/styles/reset.scss @@ -5,8 +5,9 @@ box-sizing: border-box; } -html, -body { +body, +html { + height: 100%; /* Fill the window */ padding: 0; margin: 0; } @@ -16,13 +17,8 @@ html:focus-within { scroll-behavior: smooth; } -/* Set core body defaults */ body { - height: 100vh; - /* stylelint-disable-next-line declaration-block-no-duplicate-properties */ - height: var(--app-height); - line-height: 1.5; - text-rendering: optimizespeed; + margin: 0; /* stylelint-disable-next-line selector-id-pattern */ > div#__next { @@ -84,8 +80,8 @@ select { *, *::before, *::after { - transition-duration: .01ms !important; - animation-duration: .01ms !important; + transition-duration: 0.01ms !important; + animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; } @@ -98,8 +94,8 @@ select { ::-webkit-scrollbar-thumb { background-color: transparent; - border-radius: .5rem; - transition: all .2s; + border-radius: 0.5rem; + transition: all 0.2s; } *:hover {