This commit is contained in:
2026-02-15 01:51:34 -06:00
parent ba8c6e9050
commit c29ec8e210
6 changed files with 183 additions and 18 deletions

View File

@@ -81,23 +81,21 @@ export default function PushNotificationToggle() {
if (!supported) return null;
return (
<div className="flex items-center justify-between bg-white rounded-xl p-4 shadow-sm">
<div className="flex items-center justify-between p-4">
<div>
<h3 className="font-semibold text-gray-900 text-sm">Push Notifications</h3>
<p className="text-xs text-gray-500">Get reminders on this device</p>
<p className="font-medium text-gray-900">Push notifications</p>
<p className="text-sm text-gray-500">Get reminders on this device</p>
</div>
<button
onClick={toggle}
disabled={loading}
className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${
enabled ? 'bg-indigo-600' : 'bg-gray-300'
className={`w-12 h-7 rounded-full transition-colors ${
enabled ? 'bg-indigo-500' : 'bg-gray-300'
} ${loading ? 'opacity-50' : ''}`}
>
<span
className={`inline-block h-4 w-4 transform rounded-full bg-white transition-transform ${
enabled ? 'translate-x-6' : 'translate-x-1'
}`}
/>
<div className={`w-5 h-5 bg-white rounded-full shadow transition-transform ml-1 ${
enabled ? 'translate-x-5' : ''
}`} />
</button>
</div>
);