diff --git a/frontend/src/components/store/PluginCard.tsx b/frontend/src/components/store/PluginCard.tsx index b8c622db..da144605 100644 --- a/frontend/src/components/store/PluginCard.tsx +++ b/frontend/src/components/store/PluginCard.tsx @@ -6,7 +6,7 @@ import { SingleDropdownOption, SuspensefulImage, } from 'decky-frontend-lib'; -import { FC, useState } from 'react'; +import { CSSProperties, FC, useState } from 'react'; import { useTranslation } from 'react-i18next'; import { InstallType } from '../../plugin'; @@ -18,7 +18,7 @@ interface PluginCardProps { const PluginCard: FC = ({ plugin }) => { const [selectedOption, setSelectedOption] = useState(0); - const root: boolean = plugin.tags.some((tag) => tag === 'root'); + const root = plugin.tags.some((tag) => tag === 'root'); const { t } = useTranslation(); @@ -30,7 +30,6 @@ const PluginCard: FC = ({ plugin }) => { marginRight: '20px', marginBottom: '20px', display: 'flex', - alignItems: 'center', }} >
= ({ plugin }) => { width: 'calc(100% - 320px)', // The calc is here so that the info section doesn't expand into the image display: 'flex', flexDirection: 'column', - height: '100%', + justifyContent: 'space-between', marginLeft: '1em', - justifyContent: 'center', + gap: '10px', }} > - - {plugin.name} - - - {plugin.author} - - - {plugin.description ? ( - plugin.description - ) : ( - - {t('PluginCard.plugin_no_desc')} - - )} - - {root && ( +
- {t('PluginCard.plugin_full_access')}{' '} - + + {plugin.author} + + + {plugin.description ? ( + plugin.description + ) : ( + + {t('PluginCard.plugin_no_desc')} + + )} + + {root && ( +
- deckbrew.xyz/root - - - )} -
+ {t('PluginCard.plugin_full_access')}{' '} + + deckbrew.xyz/root + +
+ )} +
+
- +
= ({ plugin }) => { {t('PluginCard.plugin_install')}
-
+
({