move container max-width configuration to theme

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%;
 }

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;
 }
 

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;
 }

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'];

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':