Replace usages of `darken` and `lighten`

This commit is contained in:
Christopher C. Wells 2021-11-13 05:47:11 -08:00
parent 9371b1a100
commit fd9a0eb656
1 changed files with 7 additions and 13 deletions

View File

@ -1,8 +1,8 @@
@use 'sass:color';
// Blue Orange theme variables. // Blue Orange theme variables.
//
// Color system // Color system
//
$blue: #37abe9; $blue: #37abe9;
$indigo: #472395; $indigo: #472395;
@ -30,7 +30,6 @@ $theme-colors: (
// Body // Body
//
// Settings for the `<body>` element. // Settings for the `<body>` element.
$body-bg: $gray-900; $body-bg: $gray-900;
@ -38,15 +37,13 @@ $body-color: $gray-400;
// Links // Links
//
// Style anchor elements. // Style anchor elements.
$link-color: theme-color('info'); $link-color: theme-color('info');
$link-hover-color: darken($link-color, 15%); $link-hover-color: color.adjust($link-color, $lightness: -15%);
// Components // Components
//
// Define common padding and border radius sizes and more. // Define common padding and border radius sizes and more.
$border-color: $gray-200; $border-color: $gray-200;
@ -55,7 +52,6 @@ $component-active-bg: theme-color('primary');
// Fonts // Fonts
//
// Font, line-height, and color for body text, headings, and more. // Font, line-height, and color for body text, headings, and more.
$text-muted: $gray-600 !default; $text-muted: $gray-600 !default;
@ -65,7 +61,6 @@ $mark-bg: #fcf8e3 !default;
// Tables // Tables
//
// Customizes the `.table` component with basic values, each used across all table variations. // Customizes the `.table` component with basic values, each used across all table variations.
$table-border-color: $gray-800; $table-border-color: $gray-800;
@ -85,24 +80,23 @@ $input-group-addon-bg: $gray-500;
// Dropdowns // Dropdowns
//
// Dropdown menu container and contents. // Dropdown menu container and contents.
$dropdown-bg: $gray-700; $dropdown-bg: $gray-700;
$dropdown-divider-bg: $gray-800; $dropdown-divider-bg: $gray-800;
$dropdown-link-color: $body-color; $dropdown-link-color: $body-color;
$dropdown-link-hover-color: darken($body-color, 5%); $dropdown-link-hover-color: color.adjust($body-color, $lightness: -5%);
$dropdown-link-hover-bg: theme-color('primary'); $dropdown-link-hover-bg: theme-color('primary');
$dropdown-link-active-color: $component-active-color; $dropdown-link-active-color: $component-active-color;
$dropdown-link-active-bg: $component-active-bg; $dropdown-link-active-bg: $component-active-bg;
$dropdown-header-color: darken($body-color, 25%); $dropdown-header-color: color.adjust($body-color, $lightness: -25%);
// Pagination // Pagination
$pagination-color: $link-color; $pagination-color: $link-color;
$pagination-bg: theme-color('dark'); $pagination-bg: theme-color('dark');
$pagination-border-color: lighten(theme-color('dark'), 5%); $pagination-border-color: color.adjust(theme-color('dark'), $lightness: 5%);
$pagination-hover-color: $link-hover-color; $pagination-hover-color: $link-hover-color;
$pagination-hover-bg: $gray-900; $pagination-hover-bg: $gray-900;
@ -136,7 +130,7 @@ $progress-bg: $gray-600;
// List group // List group
$list-group-bg: theme-color('dark'); $list-group-bg: theme-color('dark');
$list-group-hover-bg: darken($list-group-bg, 5%); $list-group-hover-bg: color.adjust($list-group-bg, $lightness: -5%);
$list-group-active-color: $component-active-color !default; $list-group-active-color: $component-active-color !default;
$list-group-active-bg: $component-active-bg !default; $list-group-active-bg: $component-active-bg !default;
$list-group-active-border-color: $list-group-active-bg !default; $list-group-active-border-color: $list-group-active-bg !default;