2022-03-08 14:49:40 -08:00
|
|
|
:root {
|
|
|
|
|
// base color e.g. #17541f = hsl(128, 57%, 21%)
|
2022-03-09 11:13:58 -08:00
|
|
|
--pngx-primary: 128, 57%;
|
|
|
|
|
--pngx-primary-lightness: 21%;
|
2022-04-07 13:51:36 -07:00
|
|
|
--pngx-primary-text-contrast: var(--bs-light);
|
2022-03-08 14:49:40 -08:00
|
|
|
|
2022-03-09 11:13:58 -08:00
|
|
|
--bs-primary: hsl(var(--pngx-primary), var(--pngx-primary-lightness));
|
2022-03-08 16:28:58 -08:00
|
|
|
--bs-border-color: var(--bs-gray-400);
|
2022-04-07 13:51:36 -07:00
|
|
|
--pngx-primary-faded: hsl(var(--pngx-primary), calc(var(--pngx-primary-lightness) + 72%));
|
|
|
|
|
--pngx-primary-lighten-10: hsl(var(--pngx-primary), calc(var(--pngx-primary-lightness) + 10%));
|
|
|
|
|
--pngx-primary-lighten-30: hsl(var(--pngx-primary), calc(var(--pngx-primary-lightness) + 30%));
|
|
|
|
|
--pngx-primary-darken-10: hsl(var(--pngx-primary), calc(var(--pngx-primary-lightness) - 10%));
|
|
|
|
|
--pngx-primary-darken-15: hsl(var(--pngx-primary), calc(var(--pngx-primary-lightness) - 15%));
|
|
|
|
|
--pngx-primary-darken-18: hsl(var(--pngx-primary), calc(var(--pngx-primary-lightness) - 18%));
|
|
|
|
|
--pngx-bg-darker: var(--bs-gray-100);
|
|
|
|
|
--pngx-focus-alpha: 0.3;
|
2022-03-08 14:49:40 -08:00
|
|
|
}
|