Toggleable shadows

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

@@ -37,7 +37,7 @@ const BookmarkSettings = () => {
 	const [dragging, setDragging] = useState(false);
 	const [groups, setGroups] = useState<BookmarkGroup[]>([]);
 	const [groupList, setGroupList] = useState<BookmarkGroup[]>([]);
-	const { isMobile, reorder } = useCommonHooks();
+	const { isMobile, reorder, theme } = useCommonHooks();
 	const { mutateAsync } = useMutationAPI();
 	const [searchValue, setSearchValue] = useState('');
 	const [debouncedGroupSearch] = useDebouncedValue(searchValue, 500);
@@ -149,6 +149,11 @@ const BookmarkSettings = () => {
 									className={textInputClasses.settingsItem}
 									classNames={textInputClasses}
 									withAsterisk
+									styles={
+										theme.textShadowsEnabled && {
+											label: { boxShadow: '2px 2px var(--mantine-color-border-0)' },
+										}
+									}
 								/>
 								<TextInput
 									key={form.key('filterName')}
@@ -158,6 +163,11 @@ const BookmarkSettings = () => {
 									className={textInputClasses.settingsItem}
 									classNames={textInputClasses}
 									withAsterisk
+									styles={
+										theme.textShadowsEnabled && {
+											label: { boxShadow: '2px 2px var(--mantine-color-border-0)' },
+										}
+									}
 								/>
 							</Group>
 							<Group mt={'1rem'}>