diff --git a/packages/web/components/templates/LoginLayout.tsx b/packages/web/components/templates/LoginLayout.tsx
index a495047a1..468de5777 100644
--- a/packages/web/components/templates/LoginLayout.tsx
+++ b/packages/web/components/templates/LoginLayout.tsx
@@ -8,10 +8,8 @@ import {
import { LoginForm } from './LoginForm'
import type { LoginFormProps } from './LoginForm'
import { OmnivoreNameLogo } from '../elements/images/OmnivoreNameLogo'
-import { theme } from '../tokens/stitches.config'
import featureFullWidthImage from '../../public/static/images/login/login-feature-image-full.png'
-import featureHalfWidthImage from '../../public/static/images/login/login-feature-image-half.png'
export function LoginLayout(props: LoginFormProps): JSX.Element {
return (
@@ -37,10 +35,7 @@ export function LoginLayout(props: LoginFormProps): JSX.Element {
width: '100%',
}}
>
-
+
>
)
@@ -53,9 +48,10 @@ function MobileLoginLayout(props: LoginFormProps) {
alignment="center"
distribution="center"
css={{
- bg: '$omnivoreYellow',
width: '100%',
flexGrow: 1,
+ color: '#898989',
+ background: '#2A2A2A',
}}
>
@@ -72,8 +68,9 @@ function MediumLoginLayout(props: LoginFormProps) {
css={{
width: '100vw',
height: '100vh',
- bg: '$omnivoreYellow',
overflowY: 'clip',
+ color: '#898989',
+ background: '#2A2A2A',
}}
>
{
}
function OmnivoreIllustration() {
- const { props: halfWidthImgProps } = getImgProps({
- src: featureHalfWidthImage,
- alt: '',
- })
-
const { props: fullWidthImgProps } = getImgProps({
src: featureFullWidthImage,
alt: '',
@@ -123,11 +115,10 @@ function OmnivoreIllustration() {
backgroundSize: 'cover',
backgroundRepeat: 'no-repeat',
backgroundPosition: 'left',
- backgroundImage: srcSetToImageSet(halfWidthImgProps.src, halfWidthImgProps.srcSet),
-
- '@media (min-aspect-ratio: 2/1)': {
- backgroundImage: srcSetToImageSet(fullWidthImgProps.src, fullWidthImgProps.srcSet),
- },
+ backgroundImage: srcSetToImageSet(
+ fullWidthImgProps.src,
+ fullWidthImgProps.srcSet
+ ),
}}
/>
)
diff --git a/packages/web/pages/login.tsx b/packages/web/pages/login.tsx
index 955cb49ac..39462772e 100644
--- a/packages/web/pages/login.tsx
+++ b/packages/web/pages/login.tsx
@@ -8,8 +8,9 @@ import { formatMessage } from '../locales/en/messages'
export default function Login(): JSX.Element {
const router = useRouter()
- const [errorMessage, setErrorMessage] =
- useState(undefined)
+ const [errorMessage, setErrorMessage] = useState(
+ undefined
+ )
useEffect(() => {
if (!router.isReady) return
@@ -30,10 +31,6 @@ export default function Login(): JSX.Element {
return (
<>
-