fix(theme): align component styles with shared theme CSS variables
This commit is contained in:
@@ -142,16 +142,16 @@ export class DeesInputCode extends DeesInputBase<string> {
|
||||
padding: 4px 10px;
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
background: ${cssManager.bdTheme('hsl(0 0% 100%)', 'hsl(0 0% 12%)')};
|
||||
border: 1px solid ${cssManager.bdTheme('hsl(0 0% 89.8%)', 'hsl(0 0% 20%)')};
|
||||
background: var(--dees-color-bg-primary);
|
||||
border: 1px solid var(--dees-color-border-default);
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
color: ${cssManager.bdTheme('hsl(0 0% 20%)', 'hsl(0 0% 90%)')};
|
||||
color: var(--dees-color-text-secondary);
|
||||
transition: all 0.15s ease;
|
||||
}
|
||||
|
||||
.language-button:hover {
|
||||
background: ${cssManager.bdTheme('hsl(0 0% 95%)', 'hsl(0 0% 15%)')};
|
||||
background: var(--dees-color-hover);
|
||||
}
|
||||
|
||||
.language-dropdown {
|
||||
@@ -159,8 +159,8 @@ export class DeesInputCode extends DeesInputBase<string> {
|
||||
top: 100%;
|
||||
left: 0;
|
||||
margin-top: 4px;
|
||||
background: ${cssManager.bdTheme('hsl(0 0% 100%)', 'hsl(0 0% 9%)')};
|
||||
border: 1px solid ${cssManager.bdTheme('hsl(0 0% 89.8%)', 'hsl(0 0% 20%)')};
|
||||
background: var(--dees-color-bg-primary);
|
||||
border: 1px solid var(--dees-color-border-default);
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
||||
z-index: 100;
|
||||
@@ -173,16 +173,16 @@ export class DeesInputCode extends DeesInputBase<string> {
|
||||
padding: 8px 12px;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
color: ${cssManager.bdTheme('hsl(0 0% 20%)', 'hsl(0 0% 90%)')};
|
||||
color: var(--dees-color-text-secondary);
|
||||
transition: background 0.15s ease;
|
||||
}
|
||||
|
||||
.language-option:hover {
|
||||
background: ${cssManager.bdTheme('hsl(0 0% 95%)', 'hsl(0 0% 15%)')};
|
||||
background: var(--dees-color-hover);
|
||||
}
|
||||
|
||||
.language-option.selected {
|
||||
background: ${cssManager.bdTheme('hsl(0 0% 90%)', 'hsl(0 0% 20%)')};
|
||||
background: var(--dees-color-active);
|
||||
}
|
||||
|
||||
.toolbar-button {
|
||||
@@ -195,18 +195,18 @@ export class DeesInputCode extends DeesInputBase<string> {
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
color: ${cssManager.bdTheme('hsl(0 0% 45%)', 'hsl(0 0% 60%)')};
|
||||
color: var(--dees-color-text-muted);
|
||||
transition: all 0.15s ease;
|
||||
}
|
||||
|
||||
.toolbar-button:hover {
|
||||
background: ${cssManager.bdTheme('hsl(0 0% 90%)', 'hsl(0 0% 15%)')};
|
||||
color: ${cssManager.bdTheme('hsl(0 0% 20%)', 'hsl(0 0% 90%)')};
|
||||
background: var(--dees-color-hover);
|
||||
color: var(--dees-color-text-secondary);
|
||||
}
|
||||
|
||||
.toolbar-button.active {
|
||||
background: ${cssManager.bdTheme('hsl(0 0% 85%)', 'hsl(0 0% 20%)')};
|
||||
color: ${cssManager.bdTheme('hsl(0 0% 20%)', 'hsl(0 0% 90%)')};
|
||||
background: var(--dees-color-active);
|
||||
color: var(--dees-color-text-secondary);
|
||||
}
|
||||
|
||||
.toolbar-button.success {
|
||||
@@ -226,7 +226,7 @@ export class DeesInputCode extends DeesInputBase<string> {
|
||||
.toolbar-divider {
|
||||
width: 1px;
|
||||
height: 20px;
|
||||
background: ${cssManager.bdTheme('hsl(0 0% 85%)', 'hsl(0 0% 20%)')};
|
||||
background: var(--dees-color-border-default);
|
||||
margin: 0 4px;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user