feat: isolate all four portals with route groups + polished design system
Fix blank /org/login (and /admin/login): the guarded portal layout was wrapping its own login route, rendering null when unauthenticated. Move each portal's authed pages into a (authed)/(chapter) route group so login pages live outside the guard. Structure: - app/(chapter)/* — chapter admin pages + guarded layout (was root-level) - app/org/(authed)/* — org pages + guarded layout; /org/login now free - app/admin/(authed)/* — admin pages + guarded layout; /admin/login free - Root layout slimmed to providers only (no shared sidebar) - Convert moved files' relative imports to @/app alias Design system: - PortalShell: shared sidebar shell (brand mark, themed active nav with accent bar, avatar dropdown user menu, loading skeletons) - portal-theme.ts: per-portal theme tokens (violet/slate/blue/emerald) - PortalLoginShell redesigned: two-column with gradient branding panel, dotted pattern, value-prop highlights, built-in back link - New shadcn components: Avatar, DropdownMenu, Skeleton - Move shared DraftCard to _components/draft-card.tsx (used by 2 portals) - Portal selector: remove Super Admin card, icon tiles, hover lift - All 4 login pages use react-hook-form + Zod + themed shell - Member nav restored to full 11-section list with icons Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,58 @@
|
||||
export type PortalTheme = 'violet' | 'slate' | 'blue' | 'emerald';
|
||||
|
||||
interface ThemeTokens {
|
||||
/** Gradient for the logo mark and login branding panel */
|
||||
gradient: string;
|
||||
/** Text accent for the brand wordmark */
|
||||
text: string;
|
||||
/** Active nav item background */
|
||||
activeBg: string;
|
||||
/** Active nav item text */
|
||||
activeText: string;
|
||||
/** Active left indicator bar */
|
||||
bar: string;
|
||||
/** Ring/border tint used in login branding */
|
||||
soft: string;
|
||||
}
|
||||
|
||||
export const PORTAL_THEMES: Record<PortalTheme, ThemeTokens> = {
|
||||
violet: {
|
||||
gradient: 'bg-gradient-to-br from-violet-500 to-purple-700',
|
||||
text: 'text-violet-600',
|
||||
activeBg: 'bg-violet-50',
|
||||
activeText: 'text-violet-700',
|
||||
bar: 'bg-violet-600',
|
||||
soft: 'text-violet-100',
|
||||
},
|
||||
slate: {
|
||||
gradient: 'bg-gradient-to-br from-slate-700 to-slate-900',
|
||||
text: 'text-slate-800',
|
||||
activeBg: 'bg-slate-100',
|
||||
activeText: 'text-slate-900',
|
||||
bar: 'bg-slate-800',
|
||||
soft: 'text-slate-200',
|
||||
},
|
||||
blue: {
|
||||
gradient: 'bg-gradient-to-br from-blue-500 to-indigo-700',
|
||||
text: 'text-blue-600',
|
||||
activeBg: 'bg-blue-50',
|
||||
activeText: 'text-blue-700',
|
||||
bar: 'bg-blue-600',
|
||||
soft: 'text-blue-100',
|
||||
},
|
||||
emerald: {
|
||||
gradient: 'bg-gradient-to-br from-emerald-500 to-teal-700',
|
||||
text: 'text-emerald-600',
|
||||
activeBg: 'bg-emerald-50',
|
||||
activeText: 'text-emerald-700',
|
||||
bar: 'bg-emerald-600',
|
||||
soft: 'text-emerald-100',
|
||||
},
|
||||
};
|
||||
|
||||
export function initials(name?: string | null, email?: string | null): string {
|
||||
const source = (name ?? email ?? '?').trim();
|
||||
const parts = source.split(/\s+/).filter(Boolean);
|
||||
if (parts.length >= 2) return (parts[0][0] + parts[1][0]).toUpperCase();
|
||||
return source.slice(0, 2).toUpperCase();
|
||||
}
|
||||
Reference in New Issue
Block a user