🐛 App Transparency not used by torrent tile table (#1256)

* 🐛 App Transparency not used by torrent tile table

* 🐛 Classname to unspecific
This commit is contained in:
Meier Lukas
2023-08-08 22:18:35 +02:00
committed by GitHub
parent 9404b2c718
commit 6460e433a5
2 changed files with 7 additions and 2 deletions

View File

@@ -47,7 +47,7 @@ export const BitTorrrentQueueItem = ({ torrent, width, app }: TorrentQueueItemPr
const uploadSpeed = torrent.uploadSpeed / 1024 / 1024; const uploadSpeed = torrent.uploadSpeed / 1024 / 1024;
const size = torrent.totalSelected; const size = torrent.totalSelected;
return ( return (
<tr key={torrent.id}> <tr key={torrent.id} className={classes.transparentBackground}>
<td> <td>
<Popover opened={popoverOpened} radius="md" shadow="md" width={350} withinPortal> <Popover opened={popoverOpened} radius="md" shadow="md" width={350} withinPortal>
<Popover.Dropdown> <Popover.Dropdown>
@@ -235,4 +235,7 @@ const useStyles = createStyles(() => ({
noTextBreak: { noTextBreak: {
whiteSpace: 'nowrap', whiteSpace: 'nowrap',
}, },
transparentBackground: {
backgroundColor: 'transparent !important',
},
})); }));

View File

@@ -17,6 +17,7 @@ import dayjs from 'dayjs';
import duration from 'dayjs/plugin/duration'; import duration from 'dayjs/plugin/duration';
import relativeTime from 'dayjs/plugin/relativeTime'; import relativeTime from 'dayjs/plugin/relativeTime';
import { useTranslation } from 'next-i18next'; import { useTranslation } from 'next-i18next';
import { useCardStyles } from '~/components/layout/useCardStyles';
import { MIN_WIDTH_MOBILE } from '../../constants/constants'; import { MIN_WIDTH_MOBILE } from '../../constants/constants';
import { NormalizedDownloadQueueResponse } from '../../types/api/downloads/queue/NormalizedDownloadQueueResponse'; import { NormalizedDownloadQueueResponse } from '../../types/api/downloads/queue/NormalizedDownloadQueueResponse';
@@ -70,6 +71,7 @@ interface TorrentTileProps {
function TorrentTile({ widget }: TorrentTileProps) { function TorrentTile({ widget }: TorrentTileProps) {
const { t } = useTranslation('modules/torrents-status'); const { t } = useTranslation('modules/torrents-status');
const { width, ref } = useElementSize(); const { width, ref } = useElementSize();
const { classes } = useCardStyles(true);
const { const {
data, data,
@@ -158,7 +160,7 @@ function TorrentTile({ widget }: TorrentTileProps) {
))} ))}
{filteredTorrents.length !== torrents.length && ( {filteredTorrents.length !== torrents.length && (
<tr> <tr className={classes.card}>
<td colSpan={width > MIN_WIDTH_MOBILE ? 6 : 3}> <td colSpan={width > MIN_WIDTH_MOBILE ? 6 : 3}>
<Flex gap="xs" align="center" justify="center"> <Flex gap="xs" align="center" justify="center">
<IconInfoCircle opacity={0.7} size={18} /> <IconInfoCircle opacity={0.7} size={18} />