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

✨ Add ribbons for mobile

Browse Source
This commit is contained in:
Manuel Ruwe
2022-12-14 10:27:02 +01:00
parent 2c7ea08b04
commit 0523313e35
3 changed files with 75 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/layout/header/Actions/ToggleEditMode/ToggleEditMode.tsx
View File

@@ -14,20 +14,28 @@ export const ToggleEditModeAction = () => {
const smallerThanSm = useScreenSmallerThan('sm');
const toggleButtonClicked = () => {
toggleEditMode();
setPopoverManuallyHidden(false);
};
return (
<Tooltip label={t('tooltip')} withinPortal>
<Popover opened={enabled && !smallerThanSm && !popoverManuallyHidden} width={250} withArrow>
<Popover.Target>
{smallerThanSm ? (
<ActionIcon variant="default" radius="md" size="xl" color="blue">
<ActionIcon
onClick={() => toggleButtonClicked()}
variant="default"
radius="md"
size="xl"
color="blue"
>
{enabled ? <IconEditCircleOff /> : <IconEditCircle />}
</ActionIcon>
) : (
<Button
onClick={() => {
toggleEditMode();
setPopoverManuallyHidden(false);
}}
onClick={() => toggleButtonClicked()}
leftIcon={enabled ? <IconEditCircleOff /> : <IconEditCircle />}
variant="default"
radius="md"