From 2b70adc1f6fe6d69ef66fa9c58e52e613d8dd73e Mon Sep 17 00:00:00 2001
From: jeffvli <jeffvictorli@gmail.com>
Date: Sat, 22 Nov 2025 14:12:02 -0800
Subject: [PATCH] move container max-width configuration to theme

---
 src/renderer/components/page-header/page-header.module.css      | 2 ++
 .../features/shared/components/library-container.module.css     | 2 +-
 .../features/shared/components/library-header-bar.module.css    | 1 +
 src/shared/themes/app-theme-types.ts                            | 1 +
 src/shared/themes/default.ts                                    | 1 +
 5 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/renderer/components/page-header/page-header.module.css b/src/renderer/components/page-header/page-header.module.css
index ec986286d..33289ed0c 100644
--- a/src/renderer/components/page-header/page-header.module.css
+++ b/src/renderer/components/page-header/page-header.module.css
@@ -81,6 +81,8 @@
 .title-wrapper {
     position: absolute;
     display: flex;
+    align-items: center;
+    justify-content: center;
     width: 100%;
     height: 100%;
 }
diff --git a/src/renderer/features/shared/components/library-container.module.css b/src/renderer/features/shared/components/library-container.module.css
index e6ecb274b..cc338fe90 100644
--- a/src/renderer/features/shared/components/library-container.module.css
+++ b/src/renderer/features/shared/components/library-container.module.css
@@ -1,7 +1,7 @@
 .container {
     position: relative;
     width: 100%;
-    max-width: 1600px;
+    max-width: var(--theme-content-max-width);
     margin: 0 auto;
 }
 
diff --git a/src/renderer/features/shared/components/library-header-bar.module.css b/src/renderer/features/shared/components/library-header-bar.module.css
index 3f4c2a7bd..57cc61c8a 100644
--- a/src/renderer/features/shared/components/library-header-bar.module.css
+++ b/src/renderer/features/shared/components/library-header-bar.module.css
@@ -4,6 +4,7 @@
     gap: 1rem;
     align-items: center;
     width: 100%;
+    max-width: var(--theme-content-max-width);
     height: 100%;
     padding: 0 1rem;
 }
diff --git a/src/shared/themes/app-theme-types.ts b/src/shared/themes/app-theme-types.ts
index 17ad83b72..a654bd017 100644
--- a/src/shared/themes/app-theme-types.ts
+++ b/src/shared/themes/app-theme-types.ts
@@ -11,6 +11,7 @@ export type AppThemeConfiguration = Partial<BaseAppThemeConfiguration>;
 
 export interface BaseAppThemeConfiguration {
     app: {
+        'content-max-width'?: CSSProperties['maxWidth'];
         'overlay-header'?: CSSProperties['background'];
         'overlay-subheader'?: CSSProperties['background'];
         'root-font-size'?: CSSProperties['fontSize'];
diff --git a/src/shared/themes/default.ts b/src/shared/themes/default.ts
index 92add0369..b8cd8045b 100644
--- a/src/shared/themes/default.ts
+++ b/src/shared/themes/default.ts
@@ -2,6 +2,7 @@ import { AppThemeConfiguration } from './app-theme-types';
 
 export const defaultTheme: AppThemeConfiguration = {
     app: {
+        'content-max-width': '1600px',
         'overlay-header':
             'linear-gradient(transparent 0%, rgb(0 0 0 / 85%) 100%), var(--theme-background-noise)',
         'overlay-subheader':