tuanta/FE-DEVICE-SGW
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 5 Wiki Activity

style(login): change LangSwitches's position to top-left

Browse Source
This commit is contained in:
Tran Anh Tuan
2025-11-21 14:44:02 +07:00
parent 38c9639fcc
commit 4d4463a517
2 changed files with 10 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/switch/LangSwitches.tsx
View File

@@ -30,7 +30,11 @@ const LangSwitches = () => {
checked={isEnglish} checked={isEnglish}
onChange={handleLanguageChange} onChange={handleLanguageChange}
/> />
<div className="w-20 h-10 rounded-full bg-gradient-to-r from-orange-400 to-red-400 peer-checked:from-blue-400 peer-checked:to-indigo-500 transition-all duration-500 after:content-['🇻🇳'] after:absolute after:top-1 after:left-1 after:bg-white after:rounded-full after:h-8 after:w-8 after:flex after:items-center after:justify-center after:transition-all after:duration-500 peer-checked:after:translate-x-10 peer-checked:after:content-['🏴󠁧󠁢󠁥󠁮󠁧󠁿'] after:shadow-md after:text-lg"></div> <div className="w-20 h-10 rounded-full bg-gradient-to-r from-orange-400 to-red-400 peer-checked:from-blue-400 peer-checked:to-indigo-500
transition-all duration-500 after:content-['🇻🇳'] after:absolute after:top-1 after:left-1 after:bg-white after:rounded-full after:h-8
after:w-8 after:flex after:items-center after:justify-center after:transition-all after:duration-500 peer-checked:after:translate-x-10
peer-checked:after:content-['🏴󠁧󠁢󠁥󠁮󠁧󠁿'] after:shadow-md after:text-2xl"
></div>
</label> </label>
); );
}; };

12
src/pages/Auth/index.tsx
View File

@@ -1,4 +1,5 @@
import Footer from '@/components/Footer/Footer'; import Footer from '@/components/Footer/Footer';
import LangSwitches from '@/components/switch/LangSwitches';
import { ROUTE_HOME } from '@/constants'; import { ROUTE_HOME } from '@/constants';
import { login } from '@/services/controller/AuthController'; import { login } from '@/services/controller/AuthController';
import { parseJwt } from '@/utils/jwtTokenUtils'; import { parseJwt } from '@/utils/jwtTokenUtils';
@@ -6,11 +7,10 @@ import { getToken, removeToken, setToken } from '@/utils/localStorageUtils';
import { LockOutlined, UserOutlined } from '@ant-design/icons'; import { LockOutlined, UserOutlined } from '@ant-design/icons';
import { LoginFormPage, ProFormText } from '@ant-design/pro-components'; import { LoginFormPage, ProFormText } from '@ant-design/pro-components';
import { history, useIntl } from '@umijs/max'; import { history, useIntl } from '@umijs/max';
import { Image, Space, theme } from 'antd'; import { Image, theme } from 'antd';
import { useEffect } from 'react'; import { useEffect } from 'react';
import logoImg from '../../../public/logo.png'; import logoImg from '../../../public/logo.png';
import mobifontImg from '../../../public/owner.png'; import mobifontImg from '../../../public/owner.png';
import LangSwitches from '@/components/switch/LangSwitches';
const LoginPage = () => { const LoginPage = () => {
const { token } = theme.useToken(); const { token } = theme.useToken();
@@ -90,11 +90,6 @@ const LoginPage = () => {
}, },
}} }}
onFinish={async (values: API.LoginRequestBody) => handleLogin(values)} onFinish={async (values: API.LoginRequestBody) => handleLogin(values)}
actions={
<Space className='mt-3'>
<LangSwitches />
</Space>
}
> >
<> <>
<ProFormText <ProFormText
@@ -152,9 +147,10 @@ const LoginPage = () => {
]} ]}
/> />
</> </>
</LoginFormPage> </LoginFormPage>
<div className="absolute top-5 right-5 z-50">
<LangSwitches /> <LangSwitches />
</div>
<div <div
style={{ style={{
backgroundColor: 'transparent', backgroundColor: 'transparent',