docker
/
docs
mirror of https://github.com/docker/docs.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

changing light mode colors to use color-palette variables

This commit is contained in:
smokhtar1 2021-11-03 16:37:54 +01:00
parent 2d457d7f8c
commit 5e01630e77
3 changed files with 26 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
_scss/_landing.scss
View File

@ -210,7 +210,7 @@ body.landing {
} }
.cardlet { .cardlet {
background-color: #F2F3F5; background-color: $white-25;
padding: 24px 36px; padding: 24px 36px;
.title { .title {

2
_scss/_notes.scss
View File

@ -109,7 +109,7 @@ blockquote {
&.warning { &.warning {
@include notification( @include notification(
$bg-color: $red-10, $bg-color: #FEEFEF, // Hardcoding this variable temporary till we migrate to the new color pallette
$header-color: $red-50, $header-color: $red-50,
$body-text-color: inherit, $body-text-color: inherit,
$icon: "\f06a" $icon: "\f06a"

47
_scss/_variables.scss
View File

@ -1,4 +1,7 @@
@import "color-palette";
/* /*
* global * global
*/ */
@ -14,30 +17,28 @@ $top-navigation-height: 92px; // top navigation height is: nav (55px) + breadcru
/* /*
* standard mode * standard mode
*/ */
$body-text: hsl(199, 20%, 25%); $body-text: $black-0;
$primary-links: hsl(206, 85%, 54%); $primary-links: $blue-70;
//
$bg-body: $white-0;
$bg-body-landing: $white-10;
$bg-header: $blue-60;
$bg-secondary: $blue-60;
$bg-sidebar: $white-10;
$bg-sidebar-active: $white-15;
$bg-footer: $white-0;
$bg-footer-landing: $marine-90;
$bg-component: $white-5;
$bg-card: $white-0;
$bg-body: hsl(206, 0%, 100%); // notes, warnings//
$bg-body-landing: hsl(206, 14%, 99%); $note-color: $blue-80;
$bg-header: hsl(206, 85%, 54%); $important-color: $orange-90;
$bg-secondary: hsl(206, 85%, 54%); $warning-color: $red-90;
$bg-sidebar: hsl(206, 14%, 99%);
$bg-sidebar-active: hsl(206, 33%, 97%);
$bg-footer: hsl(206, 0%, 100%);
$bg-footer-landing: hsl(214, 100%, 20%);
$bg-component: hsl(240, 14%, 99%); $slider-bg: $marine-10;
$bg-card: hsl( 0, 0%, 100%); $slider-btn: $blue-60;
$table-head: $grey-10;
// notes, warnings
$note-color: hsl(206, 82%, 43%);
$important-color: hsl( 35, 91%, 35%);
$warning-color: hsl( 2, 58%, 54%);
$slider-bg: hsl(206, 76%, 87%);
$slider-btn: hsl(206, 85%, 54%);
$table-head: hsl(206, 5%, 82%);
/* /*
* night mode * night mode
@ -55,7 +56,7 @@ $bg-footer-night: hsl(203, 0%, 0%);
$bg-footer-landing-night: hsl(214, 100%, 20%); $bg-footer-landing-night: hsl(214, 100%, 20%);
$bg-component-night: hsl(203, 44%, 10%); $bg-component-night: hsl(203, 44%, 10%);
$bg-card-night: hsl(203, 33%, 8%); $bg-card-night: #0e161b;
$active-sidebar-night: hsl(203, 85%, 79%); $active-sidebar-night: hsl(203, 85%, 79%);