feat(dashboard): grid wallpaper on all standalone screens + fluid 4K layout (#4158)

Integrated into release/v3.8.29
This commit is contained in:
Diego Rodrigues de Sa e Souza
2026-06-18 10:07:16 -03:00
committed by GitHub
parent a0e7e92e64
commit e0fe4facdf
13 changed files with 62 additions and 19 deletions

View File

@@ -224,14 +224,14 @@ export default function OnboardingWizard() {
if (loading) {
return (
<div className="min-h-screen flex items-center justify-center bg-bg">
<div className="min-h-screen flex items-center justify-center">
<div className="animate-pulse text-text-muted">{tc("loading")}</div>
</div>
);
}
return (
<div className="min-h-screen flex items-center justify-center bg-bg p-4">
<div className="min-h-screen flex items-center justify-center p-4">
<div className="w-full max-w-lg">
{/* Progress Indicator */}
<div className="flex items-center justify-center gap-2 mb-8">

View File

@@ -123,7 +123,7 @@ export default function CallbackPage() {
}, []);
return (
<div className="min-h-screen flex items-center justify-center bg-bg">
<div className="min-h-screen flex items-center justify-center">
<div className="text-center p-8 max-w-md">
{status === "processing" && (
<>

View File

@@ -30,7 +30,7 @@ export default function ForgotPasswordPage() {
}, [isElectron]);
return (
<div className="min-h-screen flex items-center justify-center bg-bg p-4">
<div className="min-h-screen flex items-center justify-center p-4">
<div className="w-full max-w-lg">
<div className="text-center mb-8">
<h1 className="text-3xl font-bold text-primary mb-2">{t("resetPassword")}</h1>

View File

@@ -121,7 +121,7 @@ export default function LoginPage() {
if (hasPassword === null || setupComplete === null) {
return (
<div className="min-h-screen flex flex-col items-center justify-center bg-bg p-6">
<div className="min-h-screen flex flex-col items-center justify-center p-6">
{nodeWarningBanner}
<div className="flex flex-col items-center gap-3">
<div className="relative">
@@ -136,7 +136,7 @@ export default function LoginPage() {
if (!hasPassword && !setupComplete) {
return (
<div className="min-h-screen flex flex-col items-center justify-center bg-bg p-6">
<div className="min-h-screen flex flex-col items-center justify-center p-6">
{nodeWarningBanner}
<div
className={`w-full max-w-md transition-all duration-700 ease-out ${mounted ? "opacity-100 translate-y-0" : "opacity-0 translate-y-4"}`}
@@ -174,7 +174,7 @@ export default function LoginPage() {
if (!hasPassword && setupComplete) {
return (
<div className="min-h-screen flex flex-col items-center justify-center bg-bg p-6">
<div className="min-h-screen flex flex-col items-center justify-center p-6">
{nodeWarningBanner}
<div
className={`w-full max-w-md transition-all duration-700 ease-out ${mounted ? "opacity-100 translate-y-0" : "opacity-0 translate-y-4"}`}
@@ -213,11 +213,11 @@ export default function LoginPage() {
}
return (
<div className="min-h-screen flex flex-col bg-bg">
<div className="min-h-screen flex flex-col">
{nodeWarningBanner && (
<div className="flex justify-center pt-6 px-6">{nodeWarningBanner}</div>
)}
<div className="flex-1 flex bg-bg">
<div className="flex-1 flex">
<div className="flex-1 flex items-center justify-center p-6">
<div
className={`w-full max-w-sm transition-all duration-700 ease-out ${mounted ? "opacity-100 translate-y-0" : "opacity-0 translate-y-4"}`}

View File

@@ -2,7 +2,7 @@ import Link from "next/link";
export default function MaintenancePage() {
return (
<main className="min-h-screen bg-bg text-text-main flex items-center justify-center p-6">
<main className="min-h-screen text-text-main flex items-center justify-center p-6">
<section className="w-full max-w-xl rounded-2xl border border-border bg-surface p-8 shadow-soft text-center">
<span className="material-symbols-outlined text-5xl text-primary mb-3" aria-hidden="true">
construction

View File

@@ -20,7 +20,7 @@ export default function OfflinePage() {
);
return (
<main className="min-h-screen bg-bg text-text-main flex items-center justify-center p-6">
<main className="min-h-screen text-text-main flex items-center justify-center p-6">
<section className="w-full max-w-xl rounded-2xl border border-border bg-surface p-8 shadow-soft text-center">
<span className="material-symbols-outlined text-5xl text-primary mb-3" aria-hidden="true">
wifi_off

View File

@@ -15,7 +15,7 @@ export default function PrivacyPage() {
const t = useTranslations("legal");
return (
<main className="min-h-screen bg-bg text-text-main">
<main className="min-h-screen text-text-main">
<div className="max-w-3xl mx-auto px-6 py-16">
<Link
href="/"

View File

@@ -65,7 +65,7 @@ export default function StatusPage() {
}, [health]);
return (
<main className="min-h-screen bg-bg text-text-main p-6 sm:p-10">
<main className="min-h-screen text-text-main p-6 sm:p-10">
<section className="max-w-4xl mx-auto space-y-6">
<header className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-3">
<div>

View File

@@ -15,7 +15,7 @@ export default function TermsPage() {
const t = useTranslations("legal");
return (
<main className="min-h-screen bg-bg text-text-main">
<main className="min-h-screen text-text-main">
<div className="max-w-3xl mx-auto px-6 py-16">
<Link
href="/"

View File

@@ -31,7 +31,7 @@ export default function ErrorPageScaffold({
return (
<main
className="min-h-screen bg-bg text-text-main flex items-center justify-center px-6 py-12"
className="min-h-screen text-text-main flex items-center justify-center px-6 py-12"
role="main"
aria-labelledby="error-page-title"
>

View File

@@ -102,7 +102,10 @@ export default function DashboardLayout({ children }) {
/>
{!isE2EMode && <MaintenanceBanner />}
<div className="flex-1 min-h-0 overflow-y-auto overflow-x-hidden custom-scrollbar p-4 sm:p-6 lg:p-10">
<div className="max-w-7xl mx-auto w-full h-full min-h-0 flex flex-col">
{/* Fluid up to a 4K cap (3840px): content follows the viewport on large
monitors and only centers (side gutters) beyond ~4K, instead of the prior
1280px cap that left big empty margins on wide screens. */}
<div className="max-w-[3840px] mx-auto w-full h-full min-h-0 flex flex-col">
<Breadcrumbs />
<div className="flex-1 min-h-0">
{children}