Theme changes

This commit is contained in:
Sean Edmunds
2025-04-28 15:59:56 -05:00
parent 19b793fbf9
commit 416c8611ec
53 changed files with 392 additions and 428 deletions

View File

@@ -33,7 +33,7 @@ function DebouncedGroupSettingsItem({
bookmarks,
searchTerm,
}: { bookmarkGroup: BookmarkGroup; bookmarks: Bookmark[]; searchTerm: string }) {
const { theme, isMobile, handleDelete, reorder } = useCommonHooks();
const { isMobile, handleDelete, reorder } = useCommonHooks();
const [modalOpened, { open: openModal, close: closeModal }] = useDisclosure(false);
const [popoverOpened, setPopoverOpened] = useState(false);
const { mutateAsync } = useMutationAPI();
@@ -113,8 +113,8 @@ function DebouncedGroupSettingsItem({
padding: '8px',
margin: '8px',
borderRadius: '10px',
backgroundColor: 'var(--color-text-acc)',
color: 'var(--color-background)',
backgroundColor: 'var(--mantine-color-accent-0)',
color: 'var(--mantine-color-background-0)',
}}
>{`"${group.categoryName}"`}</Text>
<Text style={{ fontWeight: 'bold', textTransform: 'uppercase' }}>
@@ -124,14 +124,18 @@ function DebouncedGroupSettingsItem({
</Stack>
}
/>
<Card.Section p={16} bg={theme.searchColor} c={theme.backgroundColor}>
<Card.Section
p={16}
bg={'var(--mantine-color-search-0)'}
c={'var(--mantine-color-background-0)'}
>
<Stack gap={0}>
<Group gap={0} align='center' justify='space-between'>
<TextInput
label={'Name'}
labelProps={{
style: {
color: theme.primaryColor,
color: 'var(--mantine-color-primary-0)',
},
}}
w={isMobile ? undefined : '58%'}
@@ -149,7 +153,7 @@ function DebouncedGroupSettingsItem({
label={'Filter Name'}
labelProps={{
style: {
color: theme.primaryColor,
color: 'var(--mantine-color-primary-0)',
},
}}
w={isMobile ? undefined : '28%'}
@@ -164,8 +168,8 @@ function DebouncedGroupSettingsItem({
}}
/>
<Tooltip
color={theme.primaryColor}
bd={`solid 1px ${theme.borderColor}`}
color={'var(--mantine-color-primary-0)'}
bd={'solid 1px var(--mantine-color-border-0)'}
label={'Delete'}
>
<ActionIcon
@@ -186,7 +190,7 @@ function DebouncedGroupSettingsItem({
width: '30px',
height: '30px',
borderRadius: '100%',
backgroundColor: theme.accentColor,
backgroundColor: 'var(--mantine-color-accent-0)',
position: 'absolute',
top: isMobile ? 164 : 78,
right: 18,
@@ -247,17 +251,7 @@ function DebouncedGroupSettingsItem({
<BookmarkSettingsItem bookmark={bookmark} />
</Box>
</Popover.Target>
<Popover.Dropdown
w={isMobile ? '100%' : undefined}
style={{
'--color-text-pri': theme.primaryColor,
'--color-text-acc': theme.accentColor,
'--color-background': theme.backgroundColor,
'--color-border': theme.borderColor,
'--color-search-background': theme.searchColor,
'--image-background': `url(${theme.backgroundImage})`,
}}
>
<Popover.Dropdown w={isMobile ? '100%' : undefined}>
<DebouncedBookmarkItem
bookmarkItem={bookmark}
setIsOpen={setIsOpen}
@@ -275,7 +269,11 @@ function DebouncedGroupSettingsItem({
</DragDropContext>
</Stack>
</Card.Section>
<Card.Section p={8} bg={theme.searchColor} c={theme.backgroundColor}>
<Card.Section
p={8}
bg={'var(--mantine-color-search-0)'}
c={'var(--mantine-color-background-0)'}
>
<Group align='center' justify='center'>
<Popover
withArrow
@@ -302,17 +300,7 @@ function DebouncedGroupSettingsItem({
<FiPlus /> Bookmark
</Button>
</Popover.Target>
<Popover.Dropdown
w={isMobile ? '100%' : undefined}
style={{
'--color-text-pri': theme.primaryColor,
'--color-text-acc': theme.accentColor,
'--color-background': theme.backgroundColor,
'--color-border': theme.borderColor,
'--color-search-background': theme.searchColor,
'--image-background': `url(${theme.backgroundImage})`,
}}
>
<Popover.Dropdown w={isMobile ? '100%' : undefined}>
<Card className={cardClasses.settingsItem} classNames={cardClasses}>
<Stack w={'100%'} display={'flex'} pos={'relative'}>
<Group w={'100%'} justify='center'>
@@ -320,7 +308,7 @@ function DebouncedGroupSettingsItem({
label={'Name'}
labelProps={{
style: {
color: theme.primaryColor,
color: 'var(--mantine-color-primary-0)',
},
}}
className={textInputClasses.settingsItem}
@@ -337,7 +325,7 @@ function DebouncedGroupSettingsItem({
label={'Category'}
labelProps={{
style: {
color: theme.primaryColor,
color: 'var(--mantine-color-primary-0)',
},
}}
className={textInputClasses.settingsItem}
@@ -358,7 +346,7 @@ function DebouncedGroupSettingsItem({
label={'URL'}
labelProps={{
style: {
color: theme.primaryColor,
color: 'var(--mantine-color-primary-0)',
},
}}
className={textInputClasses.settingsItem}