Dockery/Homarr
1
0
Fork 0
mirror of https://github.com/ajnart/homarr.git synced 2025-11-11 16:05:47 +01:00
Code Issues Packages Projects Releases Wiki Activity

💄 Fix scrollbar bookmark widget (#957)

Browse Source
This commit is contained in:
Manuel
2023-05-20 18:04:15 +02:00
committed by GitHub
parent f8e0ffabd4
commit 336aff13cc
1 changed files with 15 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/widgets/bookmark/BookmarkWidgetTile.tsx
View File

@@ -29,6 +29,7 @@ import { z } from 'zod';
import { IconSelector } from '../../components/IconSelector/IconSelector'; import { IconSelector } from '../../components/IconSelector/IconSelector';
import { defineWidget } from '../helper'; import { defineWidget } from '../helper';
import { IDraggableEditableListInputValue, IWidget } from '../widgets'; import { IDraggableEditableListInputValue, IWidget } from '../widgets';
import { useEditModeStore } from '../../components/Dashboard/Views/useEditModeStore';
interface BookmarkItem { interface BookmarkItem {
id: string; id: string;
@@ -175,14 +176,19 @@ interface BookmarkWidgetTileProps {
function BookmarkWidgetTile({ widget }: BookmarkWidgetTileProps) { function BookmarkWidgetTile({ widget }: BookmarkWidgetTileProps) {
const { t } = useTranslation('modules/bookmark'); const { t } = useTranslation('modules/bookmark');
const { classes } = useStyles(); const { classes } = useStyles();
const { enabled: isEditModeEnabled } = useEditModeStore();
if (widget.properties.items.length === 0) { if (widget.properties.items.length === 0) {
return ( return (
<Stack align="center"> <Stack align="center">
<IconPlaylistX /> <IconPlaylistX />
<Stack spacing={0}> <Stack spacing={0}>
<Title order={5} align="center">{t('card.noneFound.title')}</Title> <Title order={5} align="center">
<Text align="center" size="sm">{t('card.noneFound.text')}</Text> {t('card.noneFound.title')}
</Title>
<Text align="center" size="sm">
{t('card.noneFound.text')}
</Text>
</Stack> </Stack>
</Stack> </Stack>
); );
@@ -191,7 +197,7 @@ function BookmarkWidgetTile({ widget }: BookmarkWidgetTileProps) {
switch (widget.properties.layout) { switch (widget.properties.layout) {
case 'autoGrid': case 'autoGrid':
return ( return (
<Box className={classes.grid} display="grid"> <Box className={classes.grid} display="grid" mr={isEditModeEnabled ? 'xl' : undefined}>
{widget.properties.items.map((item: BookmarkItem, index) => ( {widget.properties.items.map((item: BookmarkItem, index) => (
<Card <Card
className={classes.autoGridItem} className={classes.autoGridItem}
@@ -209,7 +215,12 @@ function BookmarkWidgetTile({ widget }: BookmarkWidgetTileProps) {
case 'horizontal': case 'horizontal':
case 'vertical': case 'vertical':
return ( return (
<ScrollArea offsetScrollbars type="always" h="100%"> <ScrollArea
offsetScrollbars
type="always"
h="100%"
mr={isEditModeEnabled ? 'xl' : undefined}
>
<Flex <Flex
style={{ flexDirection: widget.properties.layout === 'vertical' ? 'column' : 'row' }} style={{ flexDirection: widget.properties.layout === 'vertical' ? 'column' : 'row' }}
gap="md" gap="md"