Toggleable shadows

This commit is contained in:
2025-07-11 22:23:29 -05:00
parent 19497d9748
commit e73dfc97fb
31 changed files with 376 additions and 44 deletions

View File

@@ -14,7 +14,7 @@ function DebouncedSearchProvider({
searchProvider: Provider;
setIsOpen: (isOpen: boolean) => void;
}) {
const { handleDelete, isMobile } = useCommonHooks();
const { handleDelete, isMobile, theme } = useCommonHooks();
const [modalOpened, { open: openModal, close: closeModal }] = useDisclosure(false);
const { mutateAsync } = useMutationAPI();
@@ -99,6 +99,11 @@ function DebouncedSearchProvider({
name: event.target.value,
});
}}
styles={
theme.textShadowsEnabled && {
label: { boxShadow: '2px 2px var(--mantine-color-border-0)' },
}
}
/>
<TextInput
label={'Prefix'}
@@ -111,6 +116,11 @@ function DebouncedSearchProvider({
prefix: event.target.value,
});
}}
styles={
theme.textShadowsEnabled && {
label: { boxShadow: '2px 2px var(--mantine-color-border-0)' },
}
}
/>
</Group>
<TextInput
@@ -125,6 +135,11 @@ function DebouncedSearchProvider({
url: event.target.value,
});
}}
styles={
theme.textShadowsEnabled && {
label: { boxShadow: '2px 2px var(--mantine-color-border-0)' },
}
}
/>
</Stack>
</Card>

View File

@@ -40,7 +40,7 @@ const SearchProviderSettings = () => {
endpoint: endpoint,
});
const [providers, setProviders] = useState<Provider[]>([]);
const { isMobile } = useCommonHooks();
const { isMobile, theme } = useCommonHooks();
const { mutateAsync } = useMutationAPI();
const [modalOpened, { open: openModal, close: closeModal }] = useDisclosure(false);
const [searchValue, setSearchValue] = useState('');
@@ -98,6 +98,11 @@ const SearchProviderSettings = () => {
className={textInputClasses.settingsItem}
classNames={textInputClasses}
withAsterisk
styles={
theme.textShadowsEnabled && {
label: { boxShadow: '2px 2px var(--mantine-color-border-0)' },
}
}
/>
<TextInput
key={form.key('prefix')}
@@ -107,6 +112,11 @@ const SearchProviderSettings = () => {
className={textInputClasses.settingsItem}
classNames={textInputClasses}
withAsterisk
styles={
theme.textShadowsEnabled && {
label: { boxShadow: '2px 2px var(--mantine-color-border-0)' },
}
}
/>
</Group>
<TextInput
@@ -118,6 +128,11 @@ const SearchProviderSettings = () => {
w={'64%'}
classNames={textInputClasses}
withAsterisk
styles={
theme.textShadowsEnabled && {
label: { boxShadow: '2px 2px var(--mantine-color-border-0)' },
}
}
/>
</Stack>
<Group mt={'1rem'}>