From 5db7ca2bfe4b3093121a2dca4a9366a75015961f Mon Sep 17 00:00:00 2001 From: vincentlu <t1341870251@gmail.com> Date: 星期五, 07 二月 2025 15:58:22 +0800 Subject: [PATCH] # --- rsf-admin/src/page/login/index.jsx | 18 ++++++++++++------ 1 files changed, 12 insertions(+), 6 deletions(-) diff --git a/rsf-admin/src/page/login/index.jsx b/rsf-admin/src/page/login/index.jsx index 6a70e7a..49f801c 100644 --- a/rsf-admin/src/page/login/index.jsx +++ b/rsf-admin/src/page/login/index.jsx @@ -8,6 +8,8 @@ Typography, Tabs, Tab, + useTheme, + useMediaQuery, } from '@mui/material'; import { useTranslate, @@ -21,9 +23,13 @@ const Index = () => { const translate = useTranslate(); + const theme = useTheme(); + const isSmallScreen = useMediaQuery(theme.breakpoints.down('md')); const [tab, setTab] = useState(0) const [tenantList, setTenantList] = useState([]); + + const formPosition = isSmallScreen ? 'middle' : 'right' useEffect(() => { tenants().then(data => { @@ -31,20 +37,20 @@ }) }, []); + return ( <Box sx={{ display: 'flex', flexDirection: 'column', minHeight: '100vh', - alignItems: 'center', - justifyContent: 'flex-start', - // justifyContent: 'center', + alignItems: formPosition === 'middle' ? 'center' : 'flex-end', + paddingRight: formPosition === 'middle' ? 0 : '6em', + justifyContent: formPosition === 'middle' ? 'flex-start' : 'center', background: `url(/login_bg.jpg)`, // https://unsplash.com/ backgroundRepeat: 'no-repeat', backgroundSize: 'cover', - } - } + }} > <video autoPlay @@ -70,7 +76,7 @@ <Card sx={{ width: 400, - marginTop: '6em', + marginTop: formPosition === 'middle' ? '6em' : 0, zIndex: 1 }}> <div> -- Gitblit v1.9.1