paulononato/backstage
1
0
Fork 0
Code Issues Pull Requests Actions 40 Packages Projects Releases Wiki Activity

Rename and remove CSS design tokens

Browse Source 
Signed-off-by: Charles de Dreuille <charles.dedreuille@gmail.com>
This commit is contained in:
Charles de Dreuille
2026-02-13 13:11:29 +00:00
parent 6209c67072
commit 4137a43a1b
41 changed files with 144 additions and 191 deletions
Download Patch File Download Diff File Expand all files Collapse all files
plugins/mui-to-bui/src/components/BuiThemerPage/BuiThemePreview.test.tsx
+1 -1
View File
@@ -26,7 +26,7 @@ describe('BuiThemePreview', () => {
mode="light"
styleObject={{
'--bui-bg-neutral-2': '#ffffff',
'--bui-border': '#cccccc',
'--bui-border-2': '#cccccc',
'--bui-radius-2': '4px',
'--bui-space-3': '12px',
'--bui-fg-secondary': '#777777',
plugins/mui-to-bui/src/components/BuiThemerPage/BuiThemePreview.tsx
+1 -1
View File
@@ -49,7 +49,7 @@ export function BuiThemePreview({ mode, styleObject }: IsolatedPreviewProps) {
backgroundColor: 'var(--bui-bg-neutral-2)',
padding: 'var(--bui-space-3)',
borderRadius: 'var(--bui-radius-2)',
border: '1px solid var(--bui-border)',
border: '1px solid var(--bui-border-2)',
}}
>
<Flex direction="column" gap="4">
plugins/mui-to-bui/src/components/BuiThemerPage/ThemeContent.tsx
+1 -1
View File
@@ -99,7 +99,7 @@ export function ThemeContent({
p="3"
style={{
backgroundColor: 'var(--bui-bg-neutral-2)',
border: '1px solid var(--bui-border)',
border: '1px solid var(--bui-border-2)',
borderRadius: 'var(--bui-radius-2)',
fontFamily: 'monospace',
fontSize: '14px',
plugins/mui-to-bui/src/components/BuiThemerPage/convertMuiToBuiTheme.test.ts
+2 -2
View File
@@ -59,7 +59,7 @@ describe('convertMuiToBuiTheme', () => {
// Border radius tokens are only generated when radius is 0
expect(result.css).not.toContain('--bui-radius-3:');
// Background default maps to surface-2
expect(result.css).toContain('--bui-bg-neutral-0: #f5f5f5;');
expect(result.css).toContain('--bui-bg-app: #f5f5f5;');
expect(result.css).toContain('--bui-bg-neutral-2: #f5f5f5;');
expect(result.css).toContain('--bui-bg-neutral-1: #ffffff;');
expect(result.css).toContain('--bui-fg-primary: #000000;');
@@ -98,7 +98,7 @@ describe('convertMuiToBuiTheme', () => {
expect(result.css).toContain("[data-theme-mode='dark'] {");
// Background default maps to surface-2 in dark mode as well
expect(result.css).toContain('--bui-bg-neutral-0: #121212;');
expect(result.css).toContain('--bui-bg-app: #121212;');
expect(result.css).toContain('--bui-bg-neutral-2: #121212;');
expect(result.css).toContain('--bui-bg-neutral-1: #1e1e1e;');
expect(result.css).toContain('--bui-fg-primary: #ffffff;');
plugins/mui-to-bui/src/components/BuiThemerPage/convertMuiToBuiTheme.ts
+2 -2
View File
@@ -110,8 +110,8 @@ function generateBuiVariables(theme: Mui5Theme): Record<string, string> {
});
// Generate neutral background colors
styleObject['--bui-bg-app'] = palette.background.default;
Object.entries({
'neutral-0': palette.background.default,
'neutral-1': palette.background.paper,
'neutral-2': palette.background.default,
'neutral-3': palette.background.default,
@@ -138,7 +138,7 @@ function generateBuiVariables(theme: Mui5Theme): Record<string, string> {
});
// Base border color if available
styleObject['--bui-border'] = palette.border || palette.divider;
styleObject['--bui-border-2'] = palette.border || palette.divider;
styleObject['--bui-border-danger'] = palette.error.main;
styleObject['--bui-border-warning'] = palette.warning.main;
styleObject['--bui-border-success'] = palette.success.main;