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

Style bugfixes and updates

Browse Source
This commit is contained in:
Sean Edmunds
2025-07-07 16:33:30 -05:00
parent dcea54ffaa
commit 9ef9cde336
32 changed files with 271 additions and 414 deletions
Download Patch File Download Diff File Expand all files Collapse all files

102
src/pages/settings/components/Applications/DebouncedApplication.tsx
View File

@@ -14,7 +14,7 @@ import {
import { useDebouncedValue, useDisclosure } from '@mantine/hooks';
import { useCommonHooks, useMutationAPI } from 'hooks';
import { useEffect, useState } from 'react';
import { FiTrash } from 'react-icons/fi';
import { FiPower, FiTrash } from 'react-icons/fi';
import { cardClasses, selectClasses, switchClasses, textInputClasses } from 'styles';
import type { Application } from 'types';
import DeleteItemModal from '../Shared/DeleteItemModal';
@@ -79,48 +79,70 @@ function DebouncedApplication({
</Stack>
}
/>
<Tooltip
c={'var(--mantine-color-primary-0)'}
bg={'var(--mantine-color-background-0)'}
bd={'solid 1px var(--mantine-color-border-0)'}
label={'Delete'}
<Group
style={{
position: 'absolute',
right: '1rem',
top: '.5rem',
width: 'fit-content',
backgroundColor:
'color-mix(in srgb, var(--mantine-color-background-0), transparent 50%)',
padding: '.5rem',
borderRadius: '10px',
color: 'var(--mantine-color-search-0)',
backdropFilter: 'brightness(0.5)',
}}
>
<ActionIcon
pos={'absolute'}
top={'1rem'}
right={'1rem'}
color='red'
onClick={() => {
setIsOpen(true);
openModal();
}}
>
<FiTrash color='black' />
</ActionIcon>
</Tooltip>
<Tooltip
c={'var(--mantine-color-primary-0)'}
bg={'var(--mantine-color-background-0)'}
bd={'solid 1px var(--mantine-color-border-0)'}
label={'Enabled'}
>
<Switch
className={switchClasses.default}
classNames={switchClasses}
<Tooltip
c={'var(--mantine-color-primary-0)'}
bg={'var(--mantine-color-background-0)'}
bd={'solid 1px var(--mantine-color-border-0)'}
label={'Enabled'}
labelPosition='left'
pos={'absolute'}
left={'1rem'}
defaultChecked={app.enabled === 1}
defaultValue={app.enabled}
onChange={(event) => {
setUpdate({
...app,
enabled: event.target.checked ? 1 : 0,
});
refProp='rootRef'
styles={{
tooltip: { marginTop: '-.5rem' },
arrow: { border: 'solid 1px var(--mantine-color-accent-0)' },
}}
/>
</Tooltip>
withArrow
>
<Switch
className={switchClasses.enable}
classNames={switchClasses}
defaultChecked={app.enabled === 1}
defaultValue={app.enabled}
thumbIcon={
<FiPower
style={{
color: app.enabled === 1 ? 'var(--mantine-color-accent-0)' : 'red',
}}
/>
}
onChange={(event) => {
setUpdate({
...app,
enabled: event.target.checked ? 1 : 0,
});
}}
/>
</Tooltip>
|
<Tooltip
c={'var(--mantine-color-primary-0)'}
bg={'var(--mantine-color-background-0)'}
bd={'solid 1px var(--mantine-color-border-0)'}
label={'Delete'}
>
<ActionIcon
color='red'
onClick={() => {
setIsOpen(true);
openModal();
}}
>
<FiTrash color='black' />
</ActionIcon>
</Tooltip>
</Group>
<Group justify='center' style={{ flexDirection: isMobile ? 'column' : 'row' }}>
<TextInput
label={'Name'}