Style updates

src/pages/settings/components/Bookmarks/DebouncedBookmarkItem.tsx

@@ -1,4 +1,4 @@
-import { Card, Group, Select, Stack, Text, TextInput } from '@mantine/core';
+import { Box, Card, Group, Select, Stack, Text, TextInput } from '@mantine/core';
 import { useDebouncedValue, useDisclosure } from '@mantine/hooks';
 import { DeleteItemModal, ManagementPill } from 'components';
 import { useCommonHooks, useMutationAPI, useQueryAPI } from 'hooks';
@@ -72,16 +72,25 @@ function DebouncedBookmarkItem({
 				}
 				title='Delete Bookmark'
 			/>
-			<ManagementPill
-				enabled={bookmark.enabled}
-				onChange={(event: React.ChangeEvent<HTMLInputElement>) => {
-					setUpdate({
-						...bookmark,
-						enabled: event.target.checked ? 1 : 0,
-					});
+			<Box
+				style={{
+					position: 'absolute',
+					right: '1rem',
+					top: '.5rem',
 				}}
-				openModal={openModal}
-			/>
+			>
+				<ManagementPill
+					enabled={bookmark.enabled}
+					onChange={(event: React.ChangeEvent<HTMLInputElement>) => {
+						setUpdate({
+							...bookmark,
+							enabled: event.target.checked ? 1 : 0,
+						});
+					}}
+					openModal={openModal}
+				/>
+			</Box>
+
 			<Group
 				justify='space-between'
 				pos={'relative'}

src/pages/settings/components/Bookmarks/DebouncedGroupSettingsItem.tsx

@@ -212,16 +212,24 @@ function DebouncedGroupSettingsItem({
 							top: '-3.25rem',
 						}}
 					>
-						<ManagementPill
-							enabled={group.enabled}
-							onChange={(event: React.ChangeEvent<HTMLInputElement>) => {
-								setUpdate({
-									...group,
-									enabled: event.target.checked ? 1 : 0,
-								});
+						<Box
+							style={{
+								position: 'absolute',
+								right: '1rem',
+								top: '.5rem',
 							}}
-							openModal={openModal}
-						/>
+						>
+							<ManagementPill
+								enabled={group.enabled}
+								onChange={(event: React.ChangeEvent<HTMLInputElement>) => {
+									setUpdate({
+										...group,
+										enabled: event.target.checked ? 1 : 0,
+									});
+								}}
+								openModal={openModal}
+							/>
+						</Box>
 					</Group>
 					<DragDropContext onDragEnd={onDragEnd}>
 						<Droppable droppableId={`${bookmarkGroup.id}`}>