refactor: update notification frequency selection button styling and layout in settings.

This commit is contained in:
pradeepkumar
2026-03-08 00:55:04 +05:30
parent 4255d28c50
commit 8bfd60efa1

View File

@@ -270,24 +270,24 @@ export function NotificationsForm({ onSave }: NotificationsFormProps) {
</p>
{/* Frequency Tabs */}
<div className="inline-flex border border-[#00293D]/10 rounded-[7px] overflow-hidden">
<div className="inline-flex items-center border border-[#00293D]/10 rounded-[7px] h-[49px] px-2">
{frequencyOptions.map((option, index) => (
<div key={option.value} className="flex items-center h-full">
<button
key={option.value}
type="button"
onClick={() => setDigestFrequency(option.value)}
className={`px-5 py-2 text-[14px] font-fractul transition-colors ${
className={`px-5 py-1.5 text-[14px] font-fractul transition-colors rounded-[15px] ${
digestFrequency === option.value
? 'bg-[#e58625] text-[#00293D] font-medium'
: 'bg-white text-[#00293D] hover:bg-[#00293D]/5'
} ${
index < frequencyOptions.length - 1
? 'border-r border-[#00293D]/10'
: ''
? 'bg-[#e58625] text-[#00293D]'
: 'text-[#00293D] hover:bg-[#00293D]/5'
}`}
>
{option.label}
</button>
{index < frequencyOptions.length - 1 && (
<div className="w-px h-full bg-[#00293D]/10 mx-1" />
)}
</div>
))}
</div>
</div>