smedmunds/TriggerFrontend
1
0
Fork 0
Code Issues Pull Requests Actions Projects Releases Wiki Activity

Mobile and style improvements

Browse Source
This commit is contained in:
Sean Edmunds
2025-03-28 14:25:33 -05:00
parent e935b13baf
commit 332c759ed0
23 changed files with 743 additions and 572 deletions
Download Patch File Download Diff File Expand all files Collapse all files

184
src/pages/settings/components/Bookmarks/DebouncedGroupSettingsItem.tsx
View File

@@ -311,99 +311,101 @@ function DebouncedGroupSettingsItem({
'--image-background': `url(${theme.backgroundImage})`,
}}
>
<Stack w={'100%'} display={'flex'} pos={'relative'}>
<Group w={'100%'} justify='center'>
<TextInput
label={'Name'}
labelProps={{
style: {
color: theme.primaryColor,
},
}}
className={textInputClasses.settingsItem}
pt={16}
classNames={textInputClasses}
onChange={(event) => {
setNewBookmark({
...newBookmark,
name: event.target.value,
});
}}
/>
<TextInput
label={'Category'}
labelProps={{
style: {
color: theme.primaryColor,
},
}}
className={textInputClasses.settingsItem}
pt={16}
classNames={textInputClasses}
disabled
defaultValue={group.categoryName}
onChange={(event) => {
setNewBookmark({
...newBookmark,
category: event.target.value,
});
}}
/>
</Group>
<Group w={'100%'} justify='center' mb={60}>
<TextInput
label={'URL'}
labelProps={{
style: {
color: theme.primaryColor,
},
}}
className={textInputClasses.settingsItem}
w={'100%'}
pt={16}
classNames={textInputClasses}
onChange={(event) => {
setNewBookmark({
...newBookmark,
url: event.target.value,
});
}}
/>
</Group>
<Group
w={'100%'}
pos={'absolute'}
bottom={8}
align='center'
justify='center'
>
<Button
color={'green'}
styles={{ label: { color: 'black' } }}
onClick={() => {
if (newBookmark) {
mutateAsync({
method: 'POST',
endpoint: 'api/links',
body: { ...newBookmark, index: bookmarks.length },
<Card className={cardClasses.settingsItem} classNames={cardClasses}>
<Stack w={'100%'} display={'flex'} pos={'relative'}>
<Group w={'100%'} justify='center'>
<TextInput
label={'Name'}
labelProps={{
style: {
color: theme.primaryColor,
},
}}
className={textInputClasses.settingsItem}
pt={16}
classNames={textInputClasses}
onChange={(event) => {
setNewBookmark({
...newBookmark,
name: event.target.value,
});
}}
/>
<TextInput
label={'Category'}
labelProps={{
style: {
color: theme.primaryColor,
},
}}
className={textInputClasses.settingsItem}
pt={16}
classNames={textInputClasses}
disabled
defaultValue={group.categoryName}
onChange={(event) => {
setNewBookmark({
...newBookmark,
category: event.target.value,
});
}}
/>
</Group>
<Group w={'100%'} justify='center' mb={60}>
<TextInput
label={'URL'}
labelProps={{
style: {
color: theme.primaryColor,
},
}}
className={textInputClasses.settingsItem}
w={'100%'}
pt={16}
classNames={textInputClasses}
onChange={(event) => {
setNewBookmark({
...newBookmark,
url: event.target.value,
});
}}
/>
</Group>
<Group
w={'100%'}
pos={'absolute'}
bottom={8}
align='center'
justify='center'
>
<Button
color={'green'}
styles={{ label: { color: 'black' } }}
onClick={() => {
if (newBookmark) {
mutateAsync({
method: 'POST',
endpoint: 'api/links',
body: { ...newBookmark, index: bookmarks.length },
});
setPopoverOpened(false);
}
}}
>
Save
</Button>
<Button
color={'red'}
styles={{ label: { color: 'black' } }}
onClick={() => {
setPopoverOpened(false);
}
}}
>
Save
</Button>
<Button
color={'red'}
styles={{ label: { color: 'black' } }}
onClick={() => {
setPopoverOpened(false);
}}
>
Cancel
</Button>
</Group>
</Stack>
}}
>
Cancel
</Button>
</Group>
</Stack>
</Card>
</Popover.Dropdown>
</Popover>
</Group>