jazzymc/homarr
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

fix: display on safari (#1071)

Browse Source
This commit is contained in:
Yossi Hillali
2024-09-06 17:29:53 +03:00
committed by GitHub
parent 00d5020824
commit 753d091dbb
1 changed files with 6 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
packages/widgets/src/dns-hole/controls/component.tsx
View File

@@ -1,7 +1,7 @@
"use client"; "use client";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { ActionIcon, Badge, Box, Button, Card, Flex, Image, Stack, Text, Tooltip, UnstyledButton } from "@mantine/core"; import { ActionIcon, Badge, Button, Card, Flex, Image, Stack, Text, Tooltip, UnstyledButton } from "@mantine/core";
import { useDisclosure } from "@mantine/hooks"; import { useDisclosure } from "@mantine/hooks";
import { IconClockPause, IconPlayerPlay, IconPlayerStop } from "@tabler/icons-react"; import { IconClockPause, IconPlayerPlay, IconPlayerStop } from "@tabler/icons-react";
@@ -76,7 +76,7 @@ export default function DnsHoleControlsWidget({ options, integrationIds }: Widge
return ( return (
<Flex h="100%" direction="column" gap={0} p="2.5cqmin"> <Flex h="100%" direction="column" gap={0} p="2.5cqmin">
{options.showToggleAllButtons && ( {options.showToggleAllButtons && (
<Flex gap="2.5cqmin"> <Flex m="2.5cqmin" gap="2.5cqmin">
<Tooltip label={t("widget.dnsHoleControls.controls.enableAll")}> <Tooltip label={t("widget.dnsHoleControls.controls.enableAll")}>
<Button <Button
onClick={() => disabledIntegrations.forEach((integrationId) => enableDns({ integrationId }))} onClick={() => disabledIntegrations.forEach((integrationId) => enableDns({ integrationId }))}
@@ -121,7 +121,7 @@ export default function DnsHoleControlsWidget({ options, integrationIds }: Widge
</Flex> </Flex>
)} )}
<Stack gap="2.5cqmin" flex={1} justify={options.showToggleAllButtons ? "flex-end" : "space-evenly"}> <Stack m="2.5cqmin" gap="2.5cqmin" flex={1} justify={options.showToggleAllButtons ? "flex-end" : "space-evenly"}>
{data.map((integrationData) => ( {data.map((integrationData) => (
<ControlsCard <ControlsCard
key={integrationData.integrationId} key={integrationData.integrationId}
@@ -171,11 +171,9 @@ const ControlsCard: React.FC<ControlsCardProps> = ({
return ( return (
<Card key={integrationId} withBorder p="2.5cqmin" radius="2.5cqmin"> <Card key={integrationId} withBorder p="2.5cqmin" radius="2.5cqmin">
<Flex> <Flex justify="space-between" align="center" direction="row" m="2.5cqmin">
<Box m="1.5cqmin" p="1.5cqmin"> <Image src={integrationDef.iconUrl} width="50cqmin" height="50cqmin" fit="contain" />
<Image src={integrationDef.iconUrl} width="50cqmin" height="50cqmin" fit="contain" /> <Flex direction="column">
</Box>
<Flex direction="column" m="1.5cqmin" p="1.5cqmin" gap="1cqmin">
<Text>{integrationDef.name}</Text> <Text>{integrationDef.name}</Text>
<Flex direction="row" gap="2cqmin"> <Flex direction="row" gap="2cqmin">
<UnstyledButton onClick={() => toggleDns(integrationId)}> <UnstyledButton onClick={() => toggleDns(integrationId)}>