diff --git a/interface/src/project/DashboardDevices.tsx b/interface/src/project/DashboardDevices.tsx
index 51e55f1e0..8a337d8ac 100644
--- a/interface/src/project/DashboardDevices.tsx
+++ b/interface/src/project/DashboardDevices.tsx
@@ -11,7 +11,6 @@ import StarIcon from '@mui/icons-material/Star';
import UnfoldMoreOutlinedIcon from '@mui/icons-material/UnfoldMoreOutlined';
import {
Button,
- Typography,
Dialog,
DialogTitle,
DialogContent,
@@ -21,7 +20,8 @@ import {
ListItem,
ListItemText,
FormControlLabel,
- Checkbox
+ Checkbox,
+ Box
} from '@mui/material';
import { useRowSelect } from '@table-library/react-table-library/select';
import { useSort, SortToggleType } from '@table-library/react-table-library/sort';
@@ -47,6 +47,9 @@ import { AuthenticatedContext } from 'contexts/authentication';
import { useI18nContext } from 'i18n/i18n-react';
import { extractErrorMessage } from 'utils';
+const topOffset = () => document.getElementById('devices-window')?.getBoundingClientRect().bottom || 0;
+const leftOffset = () => document.getElementById('devices-window')?.getBoundingClientRect().left || 0;
+
const DashboardDevices: FC = () => {
const { me } = useContext(AuthenticatedContext);
const { LL } = useI18nContext();
@@ -416,10 +419,18 @@ const DashboardDevices: FC = () => {
);
return (
- <>
-
- {deviceData.label}
-
+ leftOffset(),
+ top: () => topOffset(),
+ p: 1
+ }}
+ >
setOnlyFav(!onlyFav)} />}
label={
@@ -488,12 +499,12 @@ const DashboardDevices: FC = () => {
>
)}
- >
+
);
};
return (
-
+
{renderCoreData()}
{renderDeviceData()}
{renderDeviceDetails()}