fix: layout of plugin settings icons (#3478)

This commit is contained in:
chenos 2024-02-03 19:41:26 +08:00 committed by GitHub
parent 237c4aa084
commit 6c9520e0a2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -36,6 +36,7 @@ export const SettingsCenterDropdown = () => {
const settings = app.pluginSettingsManager.getList(); const settings = app.pluginSettingsManager.getList();
const [open, setOpen] = useState(false); const [open, setOpen] = useState(false);
return ( return (
settings.length > 0 && (
<ActionContextProvider value={{ visible, setVisible }}> <ActionContextProvider value={{ visible, setVisible }}>
<Popover <Popover
open={open} open={open}
@ -44,7 +45,7 @@ export const SettingsCenterDropdown = () => {
}} }}
arrow={false} arrow={false}
content={ content={
<div style={{ maxWidth: '21rem' }}> <div style={{ maxWidth: '21rem', overflow: 'auto', maxHeight: '50vh' }}>
<Card <Card
bordered={false} bordered={false}
className={css` className={css`
@ -54,6 +55,9 @@ export const SettingsCenterDropdown = () => {
> >
{settings.map((setting) => ( {settings.map((setting) => (
<Card.Grid <Card.Grid
style={{
width: settings.length === 1 ? '100%' : settings.length === 2 ? '50%' : '33.33%',
}}
className={css` className={css`
cursor: pointer; cursor: pointer;
padding: 0 !important; padding: 0 !important;
@ -74,7 +78,7 @@ export const SettingsCenterDropdown = () => {
navigate(setting.path); navigate(setting.path);
}} }}
title={compile(setting.title)} title={compile(setting.title)}
style={{ display: 'block', color: 'inherit', padding: token.marginSM }} style={{ display: 'block', color: 'inherit', minWidth: '4.5rem', padding: token.marginSM }}
href={setting.path} href={setting.path}
> >
<div style={{ fontSize: '1.2rem', textAlign: 'center', marginBottom: '0.3rem' }}> <div style={{ fontSize: '1.2rem', textAlign: 'center', marginBottom: '0.3rem' }}>
@ -105,5 +109,6 @@ export const SettingsCenterDropdown = () => {
/> />
</Popover> </Popover>
</ActionContextProvider> </ActionContextProvider>
)
); );
}; };