feat: fe mobile responsive next (#1609)

This commit is contained in:
Yuhao 2023-11-27 11:47:48 +08:00 • committed by GitHub
commit a9c1c7d239
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
89 changed files with 768 additions and 485 deletions

View file

@ -5,6 +5,7 @@ import cn from 'classnames'
import EmbeddingProcess from '../embedding-process'
import s from './index.module.css'
import useBreakpoints, { MediaType } from '@/hooks/use-breakpoints'
import type { FullDocumentDetail, createDocumentResponse } from '@/models/datasets'
type StepThreeProps = {
@ -17,9 +18,12 @@ type StepThreeProps = {
const StepThree = ({ datasetId, datasetName, indexingType, creationCache }: StepThreeProps) => {
const { t } = useTranslation()
const media = useBreakpoints()
const isMobile = media === MediaType.mobile
return (
<div className='flex w-full h-full'>
<div className={'h-full w-full overflow-y-scroll px-16'}>
<div className={'h-full w-full overflow-y-scroll px-6 sm:px-16'}>
<div className='max-w-[636px]'>
{!datasetId && (
<>
@ -46,13 +50,13 @@ const StepThree = ({ datasetId, datasetName, indexingType, creationCache }: Step
/>
</div>
</div>
<div className={cn(s.sideTip)}>
{!isMobile && <div className={cn(s.sideTip)}>
<div className={s.tipCard}>
<span className={s.icon}/>
<div className={s.title}>{t('datasetCreation.stepThree.sideTipTitle')}</div>
<div className={s.content}>{t('datasetCreation.stepThree.sideTipContent')}</div>
</div>
</div>
</div>}
</div>
)
}