feat: standardize input styling with tier system, add depth and admin features
- Define 4 input tier CSS classes (input-standard, input-search, input-embedded, input-danger) in globals.css, migrating ~50 inputs across ~28 component files to use them - Add subtle border and inset shadow to solid input tiers for resting-state visibility - Fix focus ring clipping in settings panel scroll container - Fix phantom Tailwind tokens (border-border-primary, placeholder-txt-muted) - Add admin user management panel, storage management, and account deletion utilities
This commit is contained in:
@@ -114,7 +114,7 @@ export function CreateChannelModal() {
|
||||
type="text"
|
||||
value={name}
|
||||
onChange={(e) => setName(e.target.value)}
|
||||
className="w-full px-3 py-2 bg-surface-input border border-border-soft rounded text-txt-primary outline-none focus:ring-2 focus:ring-accent-primary transition-colors"
|
||||
className="input-standard w-full"
|
||||
placeholder="new-channel"
|
||||
autoFocus
|
||||
/>
|
||||
@@ -129,7 +129,7 @@ export function CreateChannelModal() {
|
||||
type="text"
|
||||
value={topic}
|
||||
onChange={(e) => setTopic(e.target.value)}
|
||||
className="w-full px-3 py-2 bg-surface-input border border-border-soft rounded text-txt-primary outline-none focus:ring-2 focus:ring-accent-primary transition-colors"
|
||||
className="input-standard w-full"
|
||||
placeholder="What's this channel about?"
|
||||
/>
|
||||
</div>
|
||||
@@ -143,7 +143,7 @@ export function CreateChannelModal() {
|
||||
<select
|
||||
value={categoryId}
|
||||
onChange={(e) => setCategoryId(e.target.value)}
|
||||
className="w-full px-3 py-2 bg-surface-input border border-border-soft rounded text-txt-primary outline-none focus:ring-2 focus:ring-accent-primary transition-colors"
|
||||
className="input-standard w-full"
|
||||
>
|
||||
<option value="">No Category</option>
|
||||
{[...categories].sort((a, b) => a.position - b.position).map((cat) => (
|
||||
|
||||
Reference in New Issue
Block a user