Jannis Braun
4d9454382c
Split monolithic UserSettings into AccountPanel, VoicePanel, ConnectionsPanel, and InstancePanel tabs. Remove standalone InstanceSettings modal. Add reusable Toggle component fixing size deformation, color inconsistency (green→purple), and flex-shrink issues. Fix custom status clearing by always sending the field to the server. Wrap Log Out button in glass bubble. Add subtle card depth with borders.
23 lines
615 B
TypeScript
23 lines
615 B
TypeScript
interface ToggleProps {
|
|
enabled: boolean;
|
|
onChange: (enabled: boolean) => void;
|
|
}
|
|
|
|
export function Toggle({ enabled, onChange }: ToggleProps) {
|
|
return (
|
|
<button
|
|
type="button"
|
|
onClick={() => onChange(!enabled)}
|
|
className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors flex-shrink-0 ${
|
|
enabled ? 'bg-accent-primary' : 'bg-interactive-muted'
|
|
}`}
|
|
>
|
|
<span
|
|
className={`inline-block h-4 w-4 rounded-full bg-white transition-transform ${
|
|
enabled ? 'translate-x-6' : 'translate-x-1'
|
|
}`}
|
|
/>
|
|
</button>
|
|
);
|
|
}
|