diff options
Diffstat (limited to 'src/components/organisms/modals/settings-modal.tsx')
| -rw-r--r-- | src/components/organisms/modals/settings-modal.tsx | 33 |
1 files changed, 16 insertions, 17 deletions
diff --git a/src/components/organisms/modals/settings-modal.tsx b/src/components/organisms/modals/settings-modal.tsx index 4e2b119..d4a3a49 100644 --- a/src/components/organisms/modals/settings-modal.tsx +++ b/src/components/organisms/modals/settings-modal.tsx @@ -1,15 +1,16 @@ import { FC } from 'react'; import { useIntl } from 'react-intl'; -import Form from '../../atoms/forms/form'; -import AckeeToggle, { - AckeeToggleProps, -} from '../../molecules/forms/ackee-toggle'; -import MotionToggle, { - MotionToggleProps, -} from '../../molecules/forms/motion-toggle'; -import PrismThemeToggle from '../../molecules/forms/prism-theme-toggle'; -import ThemeToggle from '../../molecules/forms/theme-toggle'; -import Modal, { type ModalProps } from '../../molecules/modals/modal'; +import { Form } from '../../atoms'; +import { + AckeeToggle, + type AckeeToggleProps, + Modal, + type ModalProps, + MotionToggle, + type MotionToggleProps, + PrismThemeToggle, + ThemeToggle, +} from '../../molecules'; import styles from './settings-modal.module.scss'; export type SettingsModalProps = Pick<ModalProps, 'className'> & @@ -29,7 +30,7 @@ export type SettingsModalProps = Pick<ModalProps, 'className'> & * * Render a modal with settings options. */ -const SettingsModal: FC<SettingsModalProps> = ({ +export const SettingsModal: FC<SettingsModalProps> = ({ className = '', ackeeStorageKey, motionStorageKey, @@ -49,9 +50,9 @@ const SettingsModal: FC<SettingsModalProps> = ({ return ( <Modal - title={title} - icon="cogs" className={`${styles.wrapper} ${className}`} + icon="cogs" + title={title} > <Form aria-label={ariaLabel} @@ -70,16 +71,16 @@ const SettingsModal: FC<SettingsModalProps> = ({ legendClassName={styles.label} /> <MotionToggle - defaultValue="on" bodyClassName={styles.fieldset__body} + defaultValue="on" groupClassName={styles.group} legendClassName={styles.label} storageKey={motionStorageKey} /> <AckeeToggle - defaultValue="full" bodyClassName={styles.fieldset__body} buttonClassName={styles.btn} + defaultValue="full" groupClassName={`${styles.group} ${styles['group--ackee']}`} legendClassName={`${styles.label} ${styles['label--ackee']}`} storageKey={ackeeStorageKey} @@ -89,5 +90,3 @@ const SettingsModal: FC<SettingsModalProps> = ({ </Modal> ); }; - -export default SettingsModal; |
