5ffad0d956
* Made notice Sass color mixing in based on $background-color and $text-color instead of hard-coded black and white values. * Made some style adjustments to notices to improve readability. Notice links are slightly darkened from the notice color, mostly because the gray-on-gray default notice links were very hard to read. Rather than being $notice-color, they are `mix(#000, $notice-color, 10%)`. The notice background mix and code-background mix can now be set with the SCSS variables $notice-background-mix and $code-notice-background-mix. The default mix for background was adjusted to 80%, from 90%. The default mix for code-background was adjusted to 90%, from 95%. Skins that still didn't read well were adjusted individually. * Adjusted sunrise $notice-background-mix to 75% * Adjusted dark theme notice background mix colors back to the default Co-authored-by: Tom Manner <tsmanner@us.ibm.com>
30 lines
1.2 KiB
SCSS
30 lines
1.2 KiB
SCSS
/* ==========================================================================
|
|
Dark skin
|
|
========================================================================== */
|
|
|
|
/* Colors */
|
|
$background-color: #252a34 !default;
|
|
$text-color: #eaeaea !default;
|
|
$primary-color: #00adb5 !default;
|
|
$border-color: mix(#fff, $background-color, 20%) !default;
|
|
$code-background-color: mix(#000, $background-color, 15%) !default;
|
|
$code-background-color-dark: mix(#000, $background-color, 20%) !default;
|
|
$form-background-color: mix(#000, $background-color, 15%) !default;
|
|
$footer-background-color: mix(#000, $background-color, 30%) !default;
|
|
$link-color: mix($primary-color, $text-color, 40%) !default;
|
|
$link-color-hover: mix(#fff, $link-color, 25%) !default;
|
|
$link-color-visited: mix(#000, $link-color, 25%) !default;
|
|
$masthead-link-color: $text-color !default;
|
|
$masthead-link-color-hover: mix(#000, $text-color, 20%) !default;
|
|
$navicon-link-color-hover: mix(#000, $background-color, 30%) !default;
|
|
|
|
.author__urls.social-icons i,
|
|
.author__urls.social-icons .svg-inline--fa,
|
|
.page__footer-follow .social-icons i,
|
|
.page__footer-follow .social-icons .svg-inline--fa {
|
|
color: inherit;
|
|
}
|
|
|
|
.ais-search-box .ais-search-box--input {
|
|
background-color: $form-background-color;
|
|
}
|