diff --git a/src/newsreader/scss/components/navbar/_navbar.scss b/src/newsreader/scss/components/navbar/_navbar.scss index 54ddde6..5b8ea7f 100644 --- a/src/newsreader/scss/components/navbar/_navbar.scss +++ b/src/newsreader/scss/components/navbar/_navbar.scss @@ -3,10 +3,11 @@ justify-content: center; align-items: center; - margin: 0 0 5px 0; padding: 10px 0; width: 100%; + background-color: var(--lightest-accent-color); + ol { display: flex; justify-content: flex-start; @@ -28,5 +29,7 @@ &__item:last-child { margin: 0 10px 0 auto; + + border-right: 2px solid var(--lighter-accent-color); } } diff --git a/src/newsreader/scss/components/posts-info/_posts-info.scss b/src/newsreader/scss/components/posts-info/_posts-info.scss index 58a2da4..47eae4f 100644 --- a/src/newsreader/scss/components/posts-info/_posts-info.scss +++ b/src/newsreader/scss/components/posts-info/_posts-info.scss @@ -10,8 +10,8 @@ } & .badge { - & a { - color: $black; + & .link { + color: var(--font-color); } } } diff --git a/src/newsreader/scss/partials/_colors.scss b/src/newsreader/scss/partials/_colors.scss index 4683c54..ca20537 100644 --- a/src/newsreader/scss/partials/_colors.scss +++ b/src/newsreader/scss/partials/_colors.scss @@ -25,18 +25,18 @@ $focus-blue: darken($azureish-white, +10%); $checkbox-blue: rgba(34, 170, 253, 1); // White theme -$background-color: $white; +$background-color: rgba(255, 249, 176, 1); $font-color: rgba(83, 87, 91, 1); $link-color: darken($azureish-white, 30%); $read-color: darken($gainsboro, 10%); $confirm-button-font-color: rgba(255, 255, 255, 1); -$accent-color: $gainsboro; -$lighter-accent-color: $gainsboro; -$lightest-accent-color: $orange; +$accent-color: rgba(255, 171, 115, 1); +$lighter-accent-color: rgba(255, 211, 132, 1); +$lightest-accent-color: rgba(255, 174, 192, 1); -$confirm-color: rgba(89, 181, 128, 1); +$confirm-color: rgba(117, 207, 184, 1); $danger-color: rgba(237, 118, 105, 1); $warning-color: rgba(255, 218, 119, 1); $info-color: rgba(162, 213, 242, 1); @@ -51,7 +51,7 @@ $dark-confirm-button-font-color: $dark-font-color; $dark-accent-color: rgba(19, 59, 92, 1); $dark-lighter-accent-color: rgba(30, 95, 116, 1); -$dark-lightest-accent-color: rgba(252, 218, 183, 1); +$dark-lightest-accent-color: rgba(88, 61, 114, 1); $dark-confirm-color: rgba(0, 121, 101, 1); $dark-danger-color: rgba(175, 45, 45, 1);