Use more of the style variables in customer-segmentation-server
This commit is contained in:
parent
9888c6a20b
commit
d797ed11f8
1 changed files with 16 additions and 9 deletions
|
|
@ -16,12 +16,19 @@
|
|||
--color-border-primary: light-dark(#e5e7eb, #374151);
|
||||
--color-border-secondary: light-dark(#d1d5db, #4b5563);
|
||||
|
||||
/* Accent colors */
|
||||
--color-accent-info: light-dark(#2563eb, #3b82f6);
|
||||
/* Ring colors */
|
||||
--color-ring-info: light-dark(#2563eb, #3b82f6);
|
||||
|
||||
/* Border radius */
|
||||
--border-radius-sm: 6px;
|
||||
--border-radius-md: 8px;
|
||||
--border-radius-full: 9999px;
|
||||
|
||||
/* Border width */
|
||||
--border-width-regular: 1px;
|
||||
|
||||
/* Shadows */
|
||||
--shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.1);
|
||||
|
||||
/* App-specific colors (not from host) */
|
||||
--color-enterprise: light-dark(#1e40af, #3b82f6);
|
||||
|
|
@ -94,7 +101,7 @@ html, body {
|
|||
.select {
|
||||
padding: 4px 8px;
|
||||
font-size: 0.8125rem;
|
||||
border: 1px solid var(--color-border-primary);
|
||||
border: var(--border-width-regular) solid var(--color-border-primary);
|
||||
border-radius: var(--border-radius-sm);
|
||||
background: var(--color-background-secondary);
|
||||
color: var(--color-text-primary);
|
||||
|
|
@ -102,7 +109,7 @@ html, body {
|
|||
}
|
||||
|
||||
.select:focus {
|
||||
outline: 2px solid var(--color-accent-info);
|
||||
outline: 2px solid var(--color-ring-info);
|
||||
outline-offset: 1px;
|
||||
}
|
||||
|
||||
|
|
@ -113,7 +120,7 @@ html, body {
|
|||
background: var(--color-background-secondary);
|
||||
border-radius: var(--border-radius-md);
|
||||
padding: 8px;
|
||||
border: 1px solid var(--color-border-primary);
|
||||
border: var(--border-width-regular) solid var(--color-border-primary);
|
||||
}
|
||||
|
||||
.chart-container {
|
||||
|
|
@ -143,15 +150,15 @@ html, body {
|
|||
font-size: 0.75rem;
|
||||
cursor: pointer;
|
||||
padding: 4px 10px;
|
||||
border-radius: 16px;
|
||||
border: 1px solid var(--color-border-primary);
|
||||
border-radius: var(--border-radius-full);
|
||||
border: var(--border-width-regular) solid var(--color-border-primary);
|
||||
background: var(--color-background-secondary);
|
||||
transition: all 0.15s ease;
|
||||
}
|
||||
|
||||
.legend-item:hover {
|
||||
border-color: var(--color-text-secondary);
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
|
||||
box-shadow: var(--shadow-sm);
|
||||
}
|
||||
|
||||
.legend-item.hidden {
|
||||
|
|
@ -192,7 +199,7 @@ html, body {
|
|||
background: var(--color-background-secondary);
|
||||
border-radius: var(--border-radius-sm);
|
||||
padding: 0 12px;
|
||||
border: 1px solid var(--color-border-primary);
|
||||
border: var(--border-width-regular) solid var(--color-border-primary);
|
||||
font-size: 0.8125rem;
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue