mirror/Compass
1
0
Fork 0
mirror of https://github.com/CompassConnections/Compass.git synced 2026-04-16 04:27:45 -04:00
Code Issues Packages Projects Releases Wiki Activity

Refine notification UI: adjust layout spacing, add conditional divider for "opt_out_all" type.

Browse Source
This commit is contained in:
MartinBraquet
2026-04-08 15:38:14 +02:00
parent 0952070076
commit 3bd0241dec
1 changed files with 14 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
web/components/notifications.tsx
View File

@@ -175,17 +175,20 @@ const NotificationOption = (props: {
if (!selected) return
return (
<Row className="gap-2 w-full justify-between">
<div className="text-ink-700 font-medium">{question}</div>
<Row className="gap-3">
{SHOWN_NOTIFICATION_DESTINATION_TYPES.map((destinationType) => (
<SwitchSetting
checked={selectedValues[destinationType]}
onChange={(checked) => setValue(checked, destinationType)}
disabled={optOut.includes(destinationType) && type !== 'opt_out_all'}
/>
))}
<>
{type === 'opt_out_all' && <div className="border-canvas-200 border-b"></div>}
<Row className="gap-4 sm:gap-16 w-full justify-between">
<div className="text-ink-700 font-medium">{question}</div>
<Row className="gap-3">
{SHOWN_NOTIFICATION_DESTINATION_TYPES.map((destinationType) => (
<SwitchSetting
checked={selectedValues[destinationType]}
onChange={(checked) => setValue(checked, destinationType)}
disabled={optOut.includes(destinationType) && type !== 'opt_out_all'}
/>
))}
</Row>
</Row>
</Row>
</>
)
}