Scott.Idem/OSIT-AE-App-Svelte
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(core): standardized search UI and improved form padding

Browse Source 
- Standardized User Management search to match People Management style.
- Added 'p-3' padding to main search inputs and 'p-2' to selects for better visual clarity.
- Improved search icon spacing with enhanced shim padding (!px-4).
- Applied consistent padding enhancements to Account, Site, and User detail pages.
- Standardized 'Go' button prominence across search sections.
This commit is contained in:
Scott Idem
2026-01-15 18:01:52 -05:00
parent 39d0707968
commit b2f695c846
5 changed files with 52 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
src/routes/core/accounts/[account_id]/+page.svelte
View File

@@ -5,7 +5,7 @@
import { editable_fields__account } from '$lib/ae_core/ae_core__account.editable_fields';
import { ae_api, ae_loc } from '$lib/stores/ae_stores';
import { goto } from '$app/navigation';
import { Save, Trash2, ArrowLeft, Building } from 'lucide-svelte';
import { Save, Trash2, ArrowLeft, Building, Settings, Activity, Info } from 'lucide-svelte';
let account_id = $page.params.account_id;
let account: any = $state(null);
@@ -105,64 +105,64 @@
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="card p-6 space-y-4 shadow-xl variant-glass-surface border border-surface-500/10">
<h3 class="h4 font-bold border-b border-surface-500/30 pb-2 flex items-center gap-2">
<span class="text-primary-500">◆</span> Basic Information
<Info size={18} class="text-primary-500" /> Basic Information
</h3>
<div class="space-y-4">
<div class="space-y-1">
<label class="label text-xs font-bold opacity-75">Account Name</label>
<input class="input variant-filled-surface rounded-lg p-2" type="text" bind:value={account.name} />
<label class="label text-xs font-bold opacity-75 uppercase tracking-wider ml-1">Account Name</label>
<input class="input variant-filled-surface rounded-lg p-3" type="text" bind:value={account.name} />
</div>
<div class="space-y-1">
<label class="label text-xs font-bold opacity-75">Short Name</label>
<input class="input variant-filled-surface rounded-lg p-2" type="text" bind:value={account.short_name} />
<label class="label text-xs font-bold opacity-75 uppercase tracking-wider ml-1">Short Name</label>
<input class="input variant-filled-surface rounded-lg p-3" type="text" bind:value={account.short_name} />
</div>
<div class="space-y-1">
<label class="label text-xs font-bold opacity-75">Account Code</label>
<input class="input variant-filled-surface rounded-lg font-mono p-2" type="text" bind:value={account.code} />
<label class="label text-xs font-bold opacity-75 uppercase tracking-wider ml-1">Account Code</label>
<input class="input variant-filled-surface rounded-lg font-mono p-3" type="text" bind:value={account.code} />
</div>
<div class="space-y-1">
<label class="label text-xs font-bold opacity-75">Description</label>
<textarea class="textarea variant-filled-surface rounded-lg p-2" rows="3" bind:value={account.description}></textarea>
<label class="label text-xs font-bold opacity-75 uppercase tracking-wider ml-1">Description</label>
<textarea class="textarea variant-filled-surface rounded-lg p-3" rows="3" bind:value={account.description}></textarea>
</div>
</div>
</div>
<div class="card p-6 space-y-4 shadow-xl variant-glass-surface border border-surface-500/10">
<h3 class="h4 font-bold border-b border-surface-500/30 pb-2 flex items-center gap-2">
<span class="text-secondary-500">◆</span> Settings & Status
<Settings size={18} class="text-secondary-500" /> Settings & Status
</h3>
<div class="flex flex-col gap-4 py-2">
<label class="flex items-center space-x-2 cursor-pointer">
<label class="flex items-center space-x-3 cursor-pointer group">
<input class="checkbox" type="checkbox" bind:checked={account.enable} />
<span class="text-sm font-medium">Enabled</span>
<span class="text-sm font-bold opacity-70 group-hover:opacity-100 transition-opacity">Enabled</span>
</label>
<label class="flex items-center space-x-2 cursor-pointer">
<label class="flex items-center space-x-3 cursor-pointer group">
<input class="checkbox" type="checkbox" bind:checked={account.hide} />
<span class="text-sm font-medium">Hidden</span>
<span class="text-sm font-bold opacity-70 group-hover:opacity-100 transition-opacity">Hidden</span>
</label>
<label class="flex items-center space-x-2 cursor-pointer">
<label class="flex items-center space-x-3 cursor-pointer group">
<input class="checkbox" type="checkbox" bind:checked={account.priority} />
<span class="text-sm font-medium">Priority Account</span>
<span class="text-sm font-bold opacity-70 group-hover:opacity-100 transition-opacity">Priority Account</span>
</label>
</div>
<div class="space-y-4 border-t border-surface-500/30 pt-4">
<div class="space-y-1">
<label class="label text-xs font-bold opacity-75">Group</label>
<input class="input variant-filled-surface rounded-lg p-2" type="text" bind:value={account.group} />
<label class="label text-xs font-bold opacity-75 uppercase tracking-wider ml-1">Group</label>
<input class="input variant-filled-surface rounded-lg p-3" type="text" bind:value={account.group} />
</div>
<div class="space-y-1">
<label class="label text-xs font-bold opacity-75">Sort Order</label>
<input class="input variant-filled-surface rounded-lg p-2" type="number" bind:value={account.sort} />
<label class="label text-xs font-bold opacity-75 uppercase tracking-wider ml-1">Sort Order</label>
<input class="input variant-filled-surface rounded-lg p-3" type="number" bind:value={account.sort} />
</div>
</div>
</div>
<div class="card p-6 space-y-4 md:col-span-2 shadow-xl variant-glass-surface border border-surface-500/10">
<h3 class="h4 font-bold border-b border-surface-500/30 pb-2 flex items-center gap-2">
<span class="text-tertiary-500">◆</span> Internal Notes
<Activity size={18} class="text-tertiary-500" /> Internal Notes
</h3>
<div class="space-y-1">
<textarea class="textarea variant-filled-surface rounded-lg p-2" rows="4" bind:value={account.notes} placeholder="Private notes for staff..."></textarea>
<textarea class="textarea variant-filled-surface rounded-lg p-3" rows="4" bind:value={account.notes} placeholder="Private notes for staff..."></textarea>
</div>
</div>
</div>