thang/notes
1
0
Fork 0
mirror of https://github.com/thangisme/notes.git synced 2025-01-03 06:56:52 -05:00
Code Issues Projects Releases Wiki Activity

Added variables for background colors

Browse Source
This commit is contained in:
Silvio Giebl 2019-05-19 02:41:40 +02:00
parent 48a4a37977
commit 447ba4f20c
5 changed files with 15 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
_sass/color_schemes/dark.scss
View File

@ -6,9 +6,12 @@ $border-color: $grey-dk-200;
$body-text-color: $grey-lt-300; $body-text-color: $grey-lt-300;
$body-heading-color: $grey-lt-000; $body-heading-color: $grey-lt-000;
$nav-child-link-color: $grey-dk-000; $nav-child-link-color: $grey-dk-000;
$search-result-preview-color: $grey-dk-000;
$link-color: $blue-000; $link-color: $blue-000;
$btn-primary-color: $blue-200; $btn-primary-color: $blue-200;
$base-button-color: $grey-dk-250; $base-button-color: $grey-dk-250;
$code-background-color: $grey-dk-250; $code-background-color: $grey-dk-250;
$search-background-color: $grey-dk-250;
$table-background-color: $grey-dk-250;

13
_sass/search.scss
View File

@ -17,7 +17,7 @@
.search-input-wrap { .search-input-wrap {
display: flex; display: flex;
height: 100%; height: 100%;
background-color: $body-background-color; background-color: $search-background-color;
padding: $sp-2; padding: $sp-2;
border-radius: $border-radius; border-radius: $border-radius;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 3px 10px rgba(0, 0, 0, 0.08); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 3px 10px rgba(0, 0, 0, 0.08);
@ -28,6 +28,7 @@
padding-bottom: 0; padding-bottom: 0;
padding-left: 0; padding-left: 0;
border-radius: 0; border-radius: 0;
background-color: $body-background-color;
box-shadow: none; box-shadow: none;
} }
} }
@ -37,12 +38,13 @@
width: 100%; width: 100%;
padding-top: $sp-1; padding-top: $sp-1;
padding-bottom: $sp-1; padding-bottom: $sp-1;
background-color: $body-background-color; background-color: $search-background-color;
border-top: 0; border-top: 0;
border-right: 0; border-right: 0;
border-bottom: 0; border-bottom: 0;
border-left: 0; border-left: 0;
order: 2; order: 2;
@include fs-4;
&:focus { &:focus {
outline: 0; outline: 0;
@ -53,9 +55,8 @@
} }
} }
@include fs-4;
@include mq(md) { @include mq(md) {
background-color: $body-background-color;
@include fs-3; @include fs-3;
} }
} }
@ -73,7 +74,7 @@
z-index: 100; z-index: 100;
width: 100%; width: 100%;
border-radius: $border-radius; border-radius: $border-radius;
background: lighten($body-background-color, 1%); background: $search-background-color;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 3px 10px rgba(0, 0, 0, 0.08); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 3px 10px rgba(0, 0, 0, 0.08);
&.active { &.active {
@ -110,7 +111,7 @@
padding-right: $sp-3; padding-right: $sp-3;
&:hover, &.active { &:hover, &.active {
background-color: darken($body-background-color, 5%); background-color: darken($search-background-color, 5%);
} }
@include mq(md) { @include mq(md) {

2
_sass/support/_variables.scss
View File

@ -52,6 +52,8 @@ $red-300: #dd2e2e !default;
$body-background-color: $white !default; $body-background-color: $white !default;
$sidebar-color: $grey-lt-000 !default; $sidebar-color: $grey-lt-000 !default;
$search-background-color: $white !default;
$table-background-color: $white !default;
$code-background-color: $grey-lt-000 !default; $code-background-color: $grey-lt-000 !default;
$body-text-color: $grey-dk-100 !default; $body-text-color: $grey-dk-100 !default;

4
_sass/tables.scss
View File

@ -27,7 +27,7 @@ td {
padding-right: $sp-3; padding-right: $sp-3;
padding-bottom: $sp-2; padding-bottom: $sp-2;
padding-left: $sp-3; padding-left: $sp-3;
background-color: lighten($body-background-color, 2%); background-color: $table-background-color;
border-bottom: $border rgba($border-color, 0.5); border-bottom: $border rgba($border-color, 0.5);
border-left: $border $border-color; border-left: $border $border-color;
@ -49,6 +49,6 @@ tbody {
thead { thead {
th { th {
border-bottom: 1px solid $border-color; border-bottom: $border $border-color;
} }
} }

1
assets/css/dark-mode-preview.scss
View File

@ -33,6 +33,7 @@
@import "./search"; @import "./search";
@import "./tables"; @import "./tables";
@import "./code"; @import "./code";
@import "./anchor_headings";
@import "./utilities/utilities"; @import "./utilities/utilities";
// //