Fix navbar (#2273)

* fix: phone navbar cannot scroll; fix: file uplaod process error

* perf: select repeat file
This commit is contained in:
Archer
2024-08-06 11:49:52 +08:00
committed by GitHub
parent f35ba8e5a7
commit 96ebec9809
6 changed files with 61 additions and 52 deletions

View File

@@ -45,50 +45,51 @@ const LightRowTabs = <ValueType = string,>({
}, [size]);
return (
<Grid
gridTemplateColumns={`repeat(${list.length},1fr)`}
p={sizeMap.outP}
borderRadius={'sm'}
fontSize={sizeMap.fontSize}
overflowX={'auto'}
userSelect={'none'}
display={'inline-grid'}
{...props}
>
{list.map((item) => (
<Flex
key={item.value as string}
py={sizeMap.inlineP}
alignItems={'center'}
justifyContent={'center'}
borderBottom={'2px solid transparent'}
px={3}
whiteSpace={'nowrap'}
{...inlineStyles}
{...(value === item.value
? {
color: 'primary.600',
cursor: 'default',
fontWeight: 'bold',
borderBottomColor: 'primary.600'
}
: {
cursor: 'pointer'
})}
onClick={() => {
if (value === item.value) return;
onChange(item.value);
}}
>
{item.icon && (
<>
<Avatar src={item.icon} alt={''} w={'1.25rem'} borderRadius={'sm'} />
</>
)}
<Box ml={1}>{typeof item.label === 'string' ? t(item.label as any) : item.label}</Box>
</Flex>
))}
</Grid>
<Box overflow={'auto'}>
<Grid
gridTemplateColumns={`repeat(${list.length},1fr)`}
p={sizeMap.outP}
borderRadius={'sm'}
fontSize={sizeMap.fontSize}
userSelect={'none'}
display={'inline-grid'}
{...props}
>
{list.map((item) => (
<Flex
key={item.value as string}
py={sizeMap.inlineP}
alignItems={'center'}
justifyContent={'center'}
borderBottom={'2px solid transparent'}
px={3}
whiteSpace={'nowrap'}
{...inlineStyles}
{...(value === item.value
? {
color: 'primary.600',
cursor: 'default',
fontWeight: 'bold',
borderBottomColor: 'primary.600'
}
: {
cursor: 'pointer'
})}
onClick={() => {
if (value === item.value) return;
onChange(item.value);
}}
>
{item.icon && (
<>
<Avatar src={item.icon} alt={''} w={'1.25rem'} borderRadius={'sm'} />
</>
)}
<Box ml={1}>{typeof item.label === 'string' ? t(item.label as any) : item.label}</Box>
</Flex>
))}
</Grid>
</Box>
);
};