Make card border more subtle. Addresses point 6 of @konrads suggestions
All checks were successful
continuous-integration/drone/pr Build is passing
All checks were successful
continuous-integration/drone/pr Build is passing
for #954
This commit is contained in:
parent
38ed29052e
commit
b1425e8c4a
|
@ -60,13 +60,13 @@ export default {
|
||||||
background-color: var(--white);
|
background-color: var(--white);
|
||||||
border-radius: $radius;
|
border-radius: $radius;
|
||||||
margin-bottom: 1rem;
|
margin-bottom: 1rem;
|
||||||
border: 1px solid var(--grey-200);
|
border: 1px solid var(--card-border-color);
|
||||||
box-shadow: var(--shadow-sm);
|
box-shadow: var(--shadow-sm);
|
||||||
}
|
}
|
||||||
|
|
||||||
.card-header {
|
.card-header {
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
border-bottom: 1px solid var(--grey-200);
|
border-bottom: 1px solid var(--card-border-color);
|
||||||
border-radius: $radius $radius 0 0;
|
border-radius: $radius $radius 0 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -74,9 +74,12 @@
|
||||||
--primary: hsla(var(--primary-h), var(--primary-s), var(--primary-l), var(--primary-a));
|
--primary: hsla(var(--primary-h), var(--primary-s), var(--primary-l), var(--primary-a));
|
||||||
--primary-light: hsla(var(--primary-h), var(--primary-s), var(--primary-light-l), var(--primary-a));
|
--primary-light: hsla(var(--primary-h), var(--primary-s), var(--primary-light-l), var(--primary-a));
|
||||||
|
|
||||||
// Define custom color to prevent change in dark mode
|
// Define custom color variable to prevent change in dark mode
|
||||||
--switch-view-color: hsla(var(--white-h), var(--white-s), var(--white-l), var(--white-a));
|
--switch-view-color: hsla(var(--white-h), var(--white-s), var(--white-l), var(--white-a));
|
||||||
|
|
||||||
|
// Define custom color variable to alow change in dark mode
|
||||||
|
--card-border-color: var(--grey-200);
|
||||||
|
|
||||||
|
|
||||||
@media (prefers-color-scheme: dark) {
|
@media (prefers-color-scheme: dark) {
|
||||||
// Light mode colours reversed for dark mode
|
// Light mode colours reversed for dark mode
|
||||||
|
@ -108,5 +111,7 @@
|
||||||
// need to be overriden in dark mode
|
// need to be overriden in dark mode
|
||||||
--input-placeholder-color: hsla(var(--grey-900-hsl), 0.6) !important;
|
--input-placeholder-color: hsla(var(--grey-900-hsl), 0.6) !important;
|
||||||
|
|
||||||
|
// Custom color variables we need to override
|
||||||
|
--card-border-color: hsla(var(--grey-100-hsl), 0.3);
|
||||||
}
|
}
|
||||||
}
|
}
|
Reference in New Issue
Block a user