💄 Update styling of AppShelf

This commit is contained in:
ajnart
2022-05-16 22:48:29 +02:00
parent a97c9b0c0f
commit f5eb36ff00

View File

@@ -11,7 +11,7 @@ const AppShelf = (props: any) => {
return ( return (
<Grid gutter="xl" align="center"> <Grid gutter="xl" align="center">
{config.services.map((service) => ( {config.services.map((service) => (
<Grid.Col span={6} xs={4} sm={3} md={2}> <Grid.Col span={6} xl={2} xs={4} sm={3} md={3}>
<AppShelfItem key={service.name} service={service} /> <AppShelfItem key={service.name} service={service} />
</Grid.Col> </Grid.Col>
))} ))}
@@ -33,16 +33,9 @@ export function AppShelfItem(props: any) {
setHovering(false); setHovering(false);
}} }}
> >
<Card <Card withBorder radius="lg" shadow="xl">
style={{
boxShadow: hovering ? '0px 0px 3px rgba(0, 0, 0, 0.5)' : '0px 0px 1px rgba(0, 0, 0, 0.5)',
backgroundColor:
theme.colorScheme === 'dark' ? theme.colors.dark[5] : theme.colors.gray[0],
}}
radius="md"
>
<Card.Section> <Card.Section>
<Text mt="sm" align="center" lineClamp={1} weight={500}> <Text mt="sm" align="center" lineClamp={1} weight={550}>
{service.name} {service.name}
</Text> </Text>
<motion.div <motion.div