unchained/mission-control
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: update templates and improve UI styling across components

Browse Source
This commit is contained in:
Abhimanyu Saharan
2026-02-04 13:03:18 +05:30
parent b24e3e1dcd
commit f6105fa0d2
32 changed files with 399 additions and 321 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
frontend/src/components/templates/DashboardShell.tsx
View File

@@ -8,22 +8,24 @@ import { BrandMark } from "@/components/atoms/BrandMark";
export function DashboardShell({ children }: { children: ReactNode }) {
return (
<div className="relative min-h-screen bg-white text-gray-900">
<div className="relative min-h-screen bg-app text-strong">
<div
className="absolute inset-0 bg-landing-grid opacity-[0.35] pointer-events-none"
className="absolute inset-0 bg-landing-grid opacity-[0.18] pointer-events-none"
aria-hidden="true"
/>
<div className="relative flex min-h-screen w-full flex-col gap-8 px-6 pb-10 pt-8">
<header className="flex flex-wrap items-center justify-between gap-4">
<div className="relative flex min-h-screen w-full flex-col">
<header className="flex flex-wrap items-center justify-between gap-4 border-b border-[color:var(--border)] bg-[color:rgba(244,246,250,0.8)] px-6 py-5 backdrop-blur">
<BrandMark />
<SignedIn>
<div className="rounded-lg border-2 border-gray-200 bg-white px-2 py-1">
<div className="rounded-full border border-[color:var(--border)] bg-[color:var(--surface)] px-2 py-1 shadow-sm">
<UserButton />
</div>
</SignedIn>
</header>
<div className="grid flex-1 gap-6 lg:grid-cols-[320px_1fr]">
{children}
<div className="flex-1 px-6 py-6">
<div className="grid gap-6 lg:grid-cols-[260px_1fr]">
{children}
</div>
</div>
</div>
</div>

16
frontend/src/components/templates/LandingShell.tsx
View File

@@ -8,26 +8,26 @@ import { BrandMark } from "@/components/atoms/BrandMark";
export function LandingShell({ children }: { children: ReactNode }) {
return (
<div className="landing-page bg-white text-gray-900">
<section className="relative overflow-hidden pt-24 pb-16 px-4 sm:px-6 lg:px-8">
<div className="landing-page bg-app text-strong">
<section className="relative overflow-hidden px-4 pb-20 pt-16 sm:px-6 lg:px-8">
<div
className="absolute inset-0 bg-landing-grid opacity-[0.35] pointer-events-none"
className="absolute inset-0 bg-landing-grid opacity-[0.18] pointer-events-none"
aria-hidden="true"
/>
<div
className="absolute -top-28 right-0 h-64 w-64 rounded-full bg-gray-100 blur-3xl pointer-events-none"
className="absolute -top-40 right-0 h-72 w-72 rounded-full bg-[color:var(--accent-soft)] blur-3xl pointer-events-none"
aria-hidden="true"
/>
<div
className="absolute -bottom-32 left-0 h-72 w-72 rounded-full bg-gray-100 blur-3xl pointer-events-none"
className="absolute -bottom-32 left-0 h-72 w-72 rounded-full bg-[color:var(--surface-strong)] blur-3xl pointer-events-none"
aria-hidden="true"
/>
<div className="relative w-full">
<header className="flex items-center justify-between pb-12">
<div className="relative mx-auto flex w-full max-w-6xl flex-col gap-12">
<header className="flex items-center justify-between gap-4">
<BrandMark />
<SignedIn>
<div className="rounded-lg border-2 border-gray-200 bg-white px-2 py-1">
<div className="rounded-full border border-[color:var(--border)] bg-[color:var(--surface)] px-2 py-1 shadow-sm">
<UserButton />
</div>
</SignedIn>