mirror of
https://github.com/AppFlowy-IO/AppFlowy.git
synced 2024-08-30 18:12:39 +00:00
fix: adjust modal position
This commit is contained in:
parent
403fd2f5a0
commit
e0a70aa4d9
@ -10,9 +10,9 @@ export function Login({ redirectTo }: { redirectTo: string }) {
|
||||
|
||||
return (
|
||||
<div className={'my-10 flex flex-col items-center justify-center gap-[24px] px-4'}>
|
||||
<div className={'flex flex-col items-center justify-center gap-[14px]'}>
|
||||
<div className={'flex w-full flex-col items-center justify-center gap-[14px]'}>
|
||||
<Logo className={'h-10 w-10'} />
|
||||
<div className={'text-[24px] font-semibold'}>{t('welcomeTo')} AppFlowy</div>
|
||||
<div className={'text-[24px] font-semibold max-sm:text-[20px]'}>{t('welcomeTo')} AppFlowy</div>
|
||||
</div>
|
||||
<MagicLink redirectTo={redirectTo} />
|
||||
<div className={'flex w-full items-center justify-center gap-2 text-text-caption'}>
|
||||
|
@ -50,7 +50,7 @@ function LoginProvider({ redirectTo }: { redirectTo: string }) {
|
||||
};
|
||||
|
||||
return (
|
||||
<div className={'flex flex-col items-center justify-center gap-[10px]'}>
|
||||
<div className={'flex w-full flex-col items-center justify-center gap-[10px]'}>
|
||||
{options.map((option) => (
|
||||
<Button
|
||||
key={option.value}
|
||||
@ -58,7 +58,7 @@ function LoginProvider({ redirectTo }: { redirectTo: string }) {
|
||||
variant={'outlined'}
|
||||
onClick={() => handleClick(option.value)}
|
||||
className={
|
||||
'flex h-[46px] w-[380px] items-center justify-center gap-[10px] rounded-[12px] border border-line-divider text-sm font-medium text-text-title'
|
||||
'flex h-[46px] w-[380px] items-center justify-center gap-[10px] rounded-[12px] border border-line-divider text-sm font-medium text-text-title max-sm:w-full'
|
||||
}
|
||||
>
|
||||
<option.Icon className={'h-[20px] w-[20px]'} />
|
||||
|
@ -34,11 +34,11 @@ function MagicLink({ redirectTo }: { redirectTo: string }) {
|
||||
};
|
||||
|
||||
return (
|
||||
<div className={'flex flex-col items-center justify-center gap-[12px]'}>
|
||||
<div className={'flex w-full flex-col items-center justify-center gap-[12px]'}>
|
||||
<OutlinedInput
|
||||
value={email}
|
||||
type={'email'}
|
||||
className={'h-[46px] w-[380px] rounded-[12px] py-[15px] px-[20px] text-base'}
|
||||
className={'h-[46px] w-[380px] rounded-[12px] py-[15px] px-[20px] text-base max-sm:w-full'}
|
||||
placeholder={t('signIn.pleaseInputYourEmail')}
|
||||
inputProps={{
|
||||
className: 'px-0 py-0',
|
||||
@ -49,7 +49,7 @@ function MagicLink({ redirectTo }: { redirectTo: string }) {
|
||||
onClick={handleSubmit}
|
||||
disabled={loading}
|
||||
variant={'contained'}
|
||||
className={'flex h-[46px] w-[380px] items-center justify-center gap-2 rounded-[12px] text-base'}
|
||||
className={'flex h-[46px] w-[380px] items-center justify-center gap-2 rounded-[12px] text-base max-sm:w-full'}
|
||||
>
|
||||
{loading ? (
|
||||
<>
|
||||
|
@ -19,6 +19,7 @@ function DuplicateModal({ open, onClose }: { open: boolean; onClose: () => void
|
||||
title={t('publish.duplicateTitle')}
|
||||
open={open}
|
||||
onClose={onClose}
|
||||
classes={{ container: 'items-start max-md:mt-auto max-md:items-center mt-[10%] ' }}
|
||||
onOk={async () => {
|
||||
// submit form
|
||||
notify.success(t('publish.duplicateSuccessfully'));
|
||||
|
@ -41,7 +41,7 @@ function SelectWorkspace({ value, onChange, workspaceList }: SelectWorkspaceProp
|
||||
);
|
||||
|
||||
return (
|
||||
<div className={'flex w-[360px] flex-col gap-2'}>
|
||||
<div className={'flex w-[360px] flex-col gap-2 max-sm:w-full'}>
|
||||
<div className={'text-sm text-text-caption'}>{t('publish.selectWorkspace')}</div>
|
||||
<Button
|
||||
ref={ref}
|
||||
@ -70,7 +70,7 @@ function SelectWorkspace({ value, onChange, workspaceList }: SelectWorkspaceProp
|
||||
setSelectOpen(false);
|
||||
}}
|
||||
>
|
||||
<div className={'flex max-h-[360px] w-[360px] flex-col gap-1 p-2'}>
|
||||
<div className={'flex max-h-[360px] w-[360px] flex-col gap-1 p-2 max-sm:w-full'}>
|
||||
<div className={'w-full px-3 py-2 text-sm font-medium text-text-caption'}>{email}</div>
|
||||
<Divider />
|
||||
<div className={'appflowy-scroller flex flex-1 flex-col overflow-y-auto overflow-x-hidden'}>
|
||||
|
@ -52,7 +52,7 @@ function SpaceList({ spaceList, value, onChange }: SpaceListProps) {
|
||||
);
|
||||
|
||||
return (
|
||||
<div className={'flex max-h-[260px] w-[360px] flex-col gap-2 overflow-hidden'}>
|
||||
<div className={'flex max-h-[280px] w-[360px] flex-col gap-2 overflow-hidden max-sm:w-full'}>
|
||||
<div className={'text-sm text-text-caption'}>{t('publish.addTo')}</div>
|
||||
<div className={'appflowy-scroller flex w-full flex-1 flex-col gap-1 overflow-y-auto overflow-x-hidden'}>
|
||||
{spaceList.map((space) => {
|
||||
|
Loading…
Reference in New Issue
Block a user