UX: More accessible colors (#105)

This commit is contained in:
Jordan Vidrine
2025-04-01 20:01:29 -05:00
committed by GitHub
parent f4c6876923
commit 1c85ae4626
4 changed files with 31 additions and 16 deletions
+14 -9
View File
@@ -1,9 +1,9 @@
html {
--accent-color: #{$tertiary} !important;
--accent-text-color: light-dark(#ffffff, #212121) !important;
--accent-text-color: #ffffff;
// Background Colors
--background-color: light-dark(
oklch(from #{$tertiary} 98% calc(c * 0.25) h),
oklch(from #{$tertiary} 96% calc(c * 0.125) h),
oklch(from #{$tertiary} 10% 0.025 h)
) !important;
--d-content-background: light-dark(
@@ -22,13 +22,14 @@ html {
// Sidebar Colors
--d-sidebar-border-color: light-dark(
oklch(from #{$tertiary} 90% c h),
oklch(from #{$tertiary} 88% calc(c * 0.25) h),
oklch(from #{$tertiary} calc(l * 0.7) calc(c * 0.25) h)
) !important;
--d-sidebar-link-color: light-dark(
oklch(from #{$tertiary} calc(l * 0.8) calc(c * 0.25) h),
oklch(from #{$tertiary} calc(l * 1.5) calc(c * 0.25) h)
) !important;
--d-sidebar-active-color: #{$primary} !important;
--d-sidebar-suffix-color: light-dark(
oklch(from #{$tertiary} l calc(c * 0.9) h),
oklch(from #{$tertiary} l calc(c * 0.9) h)
@@ -40,25 +41,29 @@ html {
oklch(from #{$tertiary} calc(l * 0.7) calc(c * 0.25) h)
) !important;
--d-nav-color--active: #{$tertiary} !important;
--d-nav-color--active: light-dark(
oklch(from #{$tertiary} l c h),
oklch(from #{$tertiary} calc(l * 1.2) c h)
) !important;
--link-color: light-dark(
#{$tertiary},
oklch(from #{$tertiary} l c h),
oklch(from #{$tertiary} calc(l * 0.95) c h)
) !important;
--link-color-hover: light-dark(
#{$tertiary},
oklch(from #{$tertiary} l c h),
oklch(from #{$tertiary} calc(l * 1.5) calc(c * 2.25) h)
) !important;
--tertiary-hover: #{$tertiary} !important;
// Search Colors
--search-color: light-dark(
oklch(from #{$tertiary} calc(l * 0.65) calc(c * 0.65) h),
oklch(from #{$tertiary} calc(l * 1.5) calc(c * 2) h)
oklch(from #{$tertiary} l c h),
oklch(from #{$tertiary} calc(l * 1.5) c h)
) !important;
--search-banner-text-color: light-dark(
oklch(from #{$tertiary} calc(l * 0.65) calc(c * 0.65) h),
oklch(from #{$tertiary} calc(l * 1.85) calc(c * 2) h)
oklch(from #{$tertiary} calc(l * 1.5) c h)
) !important;
// Topic Card Colors