diff options
Diffstat (limited to 'src/components/organisms/modals')
| -rw-r--r-- | src/components/organisms/modals/settings-modal.module.scss | 2 | ||||
| -rw-r--r-- | src/components/organisms/modals/settings-modal.tsx | 14 |
2 files changed, 9 insertions, 7 deletions
diff --git a/src/components/organisms/modals/settings-modal.module.scss b/src/components/organisms/modals/settings-modal.module.scss index 95626ab..6576cf5 100644 --- a/src/components/organisms/modals/settings-modal.module.scss +++ b/src/components/organisms/modals/settings-modal.module.scss @@ -30,7 +30,5 @@ } .icon { - --icon-size: #{fun.convert-px(30)}; - margin-right: var(--spacing-2xs); } diff --git a/src/components/organisms/modals/settings-modal.tsx b/src/components/organisms/modals/settings-modal.tsx index bb3d886..5a53bbd 100644 --- a/src/components/organisms/modals/settings-modal.tsx +++ b/src/components/organisms/modals/settings-modal.tsx @@ -1,6 +1,6 @@ -import { FC } from 'react'; +import { useCallback, type FC, type FormEvent } from 'react'; import { useIntl } from 'react-intl'; -import { Cog, Form, Heading, Modal, type ModalProps } from '../../atoms'; +import { Form, Heading, Icon, Modal, type ModalProps } from '../../atoms'; import { AckeeToggle, type AckeeToggleProps, @@ -8,7 +8,7 @@ import { type MotionToggleProps, PrismThemeToggle, ThemeToggle, -} from '../../organisms'; +} from '../forms'; import styles from './settings-modal.module.scss'; export type SettingsModalProps = Pick<ModalProps, 'className'> & { @@ -44,12 +44,16 @@ export const SettingsModal: FC<SettingsModalProps> = ({ description: 'SettingsModal: an accessible form name', }); + const submitHandler = useCallback((e: FormEvent) => { + e.preventDefault(); + }, []); + return ( <Modal className={`${styles.wrapper} ${className}`} heading={ <Heading isFake level={3}> - <Cog className={styles.icon} /> + <Icon className={styles.icon} shape="cog" /> {title} </Heading> } @@ -57,7 +61,7 @@ export const SettingsModal: FC<SettingsModalProps> = ({ <Form aria-label={ariaLabel} className={styles.form} - onSubmit={() => null} + onSubmit={submitHandler} > <ThemeToggle className={styles.item} /> <PrismThemeToggle className={styles.item} /> |
