fix(dashboard): separate theme identity from layout scale
Themes previously embedded layout-affecting values (baseSize, lineHeight, density, letterSpacing) alongside visual identity properties, coupling user ergonomic preferences to color theme selection. This change establishes a clear separation of concerns: - Themes own: palette, font family, border-radius, and font-coupled letterSpacing (e.g. Inter's -0.005em tracking) - Layout scale (baseSize, lineHeight, density) is standardized via DEFAULT_TYPOGRAPHY and DEFAULT_LAYOUT — not overridden per theme All themes now spread DEFAULT_TYPOGRAPHY and DEFAULT_LAYOUT as their base, removing silent divergence and making future layout settings (e.g. user-configurable density) trivially applicable across all themes without per-theme special-casing.
This commit is contained in:
@@ -70,12 +70,11 @@ export const midnightTheme: DashboardTheme = {
|
|||||||
fontMono: `"JetBrains Mono", ${SYSTEM_MONO}`,
|
fontMono: `"JetBrains Mono", ${SYSTEM_MONO}`,
|
||||||
fontUrl:
|
fontUrl:
|
||||||
"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap",
|
"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap",
|
||||||
lineHeight: "1.6",
|
|
||||||
letterSpacing: "-0.005em",
|
letterSpacing: "-0.005em",
|
||||||
},
|
},
|
||||||
layout: {
|
layout: {
|
||||||
|
...DEFAULT_LAYOUT,
|
||||||
radius: "0.75rem",
|
radius: "0.75rem",
|
||||||
density: "comfortable",
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -96,12 +95,10 @@ export const emberTheme: DashboardTheme = {
|
|||||||
fontMono: `"IBM Plex Mono", ${SYSTEM_MONO}`,
|
fontMono: `"IBM Plex Mono", ${SYSTEM_MONO}`,
|
||||||
fontUrl:
|
fontUrl:
|
||||||
"https://fonts.googleapis.com/css2?family=Spectral:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;700&display=swap",
|
"https://fonts.googleapis.com/css2?family=Spectral:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;700&display=swap",
|
||||||
lineHeight: "1.6",
|
|
||||||
letterSpacing: "0",
|
|
||||||
},
|
},
|
||||||
layout: {
|
layout: {
|
||||||
|
...DEFAULT_LAYOUT,
|
||||||
radius: "0.25rem",
|
radius: "0.25rem",
|
||||||
density: "comfortable",
|
|
||||||
},
|
},
|
||||||
colorOverrides: {
|
colorOverrides: {
|
||||||
destructive: "#c92d0f",
|
destructive: "#c92d0f",
|
||||||
@@ -126,12 +123,10 @@ export const monoTheme: DashboardTheme = {
|
|||||||
fontMono: `"IBM Plex Mono", ${SYSTEM_MONO}`,
|
fontMono: `"IBM Plex Mono", ${SYSTEM_MONO}`,
|
||||||
fontUrl:
|
fontUrl:
|
||||||
"https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap",
|
"https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap",
|
||||||
lineHeight: "1.5",
|
|
||||||
letterSpacing: "0",
|
|
||||||
},
|
},
|
||||||
layout: {
|
layout: {
|
||||||
|
...DEFAULT_LAYOUT,
|
||||||
radius: "0",
|
radius: "0",
|
||||||
density: "comfortable",
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -152,12 +147,10 @@ export const cyberpunkTheme: DashboardTheme = {
|
|||||||
fontMono: `"Share Tech Mono", "JetBrains Mono", ${SYSTEM_MONO}`,
|
fontMono: `"Share Tech Mono", "JetBrains Mono", ${SYSTEM_MONO}`,
|
||||||
fontUrl:
|
fontUrl:
|
||||||
"https://fonts.googleapis.com/css2?family=Share+Tech+Mono&family=JetBrains+Mono:wght@400;700&display=swap",
|
"https://fonts.googleapis.com/css2?family=Share+Tech+Mono&family=JetBrains+Mono:wght@400;700&display=swap",
|
||||||
lineHeight: "1.5",
|
|
||||||
letterSpacing: "0",
|
|
||||||
},
|
},
|
||||||
layout: {
|
layout: {
|
||||||
|
...DEFAULT_LAYOUT,
|
||||||
radius: "0",
|
radius: "0",
|
||||||
density: "comfortable",
|
|
||||||
},
|
},
|
||||||
colorOverrides: {
|
colorOverrides: {
|
||||||
success: "#00ff88",
|
success: "#00ff88",
|
||||||
@@ -183,11 +176,10 @@ export const roseTheme: DashboardTheme = {
|
|||||||
fontMono: `"DM Mono", ${SYSTEM_MONO}`,
|
fontMono: `"DM Mono", ${SYSTEM_MONO}`,
|
||||||
fontUrl:
|
fontUrl:
|
||||||
"https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600&family=DM+Mono:wght@400;500&display=swap",
|
"https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600&family=DM+Mono:wght@400;500&display=swap",
|
||||||
letterSpacing: "0",
|
|
||||||
},
|
},
|
||||||
layout: {
|
layout: {
|
||||||
|
...DEFAULT_LAYOUT,
|
||||||
radius: "1rem",
|
radius: "1rem",
|
||||||
density: "comfortable",
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user