diff --git a/src/app/header/header.component.scss b/src/app/header/header.component.scss index 304251c5745605c06e538b8b9c0db0201197c6fb..724e589e8e29a0e0c0c0c3ffb9a039837b8fe1f4 100644 --- a/src/app/header/header.component.scss +++ b/src/app/header/header.component.scss @@ -15,8 +15,10 @@ padding: 0 20px; a { font-style: italic; + color: $primary-color; &.active { font-weight: bold; + color: $grey-1; } } .right-header { diff --git a/src/app/map/components/map.component.scss b/src/app/map/components/map.component.scss index 765479d97438b5c8ea22185127e5f0f44740f93a..b45b2ff1f76993a47e38c81d334abe691df46866 100644 --- a/src/app/map/components/map.component.scss +++ b/src/app/map/components/map.component.scss @@ -55,7 +55,7 @@ padding: 8px 10px 8px 10px; border-radius: 6px; h1 { - color: $purple; + color: $grey-1; @include cn-bold-20; margin: 0; } diff --git a/src/app/structure-list/components/card/card.component.scss b/src/app/structure-list/components/card/card.component.scss index 8abcee027715a551051cf2519c4606e9c930aa75..b9682472abf591071f67faf654aa2b03ec623de1 100644 --- a/src/app/structure-list/components/card/card.component.scss +++ b/src/app/structure-list/components/card/card.component.scss @@ -12,13 +12,13 @@ } .nomStructure { padding-top: 13px; - color: $purple; + color: $grey-1; @include cn-bold-20; padding-bottom: 5px; } .distanceStructure { @include cn-regular-16; - color: $purple; + color: $grey-1; } &:last-child { border-bottom: none; diff --git a/src/assets/scss/_color.scss b/src/assets/scss/_color.scss index 1a854b6a070cdafd46abb3d287b19605e60ba4cc..2efedea700ac4a3c385be8e9bea6876aea3cebe9 100644 --- a/src/assets/scss/_color.scss +++ b/src/assets/scss/_color.scss @@ -8,24 +8,16 @@ $grey-2: #4f4f4f; $grey-3: #828282; $grey-4: #bdbdbd; $grey-6: #f2f2f2; -/* YELLOW */ -$yellow: #f2cb04; -$yellow-light: #fff8d6; -/* ORANGES */ -$orange: #f27405; -$orange-light: #f29f05; -$orange-3: #fff4ea; -/* GREEN */ +/* Status colors */ $green: #41c29c; +$red: #f98181; /* OTHERS */ -$blue: #b3f8f8; -$blue-dark: #2f5480; -$purple: #594d59; -$red: #eb5757; +$blue: #348899; +$grey-1: #594d59; $red-metro: #d50000; /* APP COLORS */ -$primary-color: $yellow; -$secondary-color: $orange; +$primary-color: $red-metro; +$secondary-color: $blue; $default-link-color: $grey-2; -$button-secondary: $blue-dark; +$button-secondary: $blue; $app-background: $grey-6; diff --git a/src/assets/scss/_icons.scss b/src/assets/scss/_icons.scss index 1d52f59d64a1672c19ae2d56bdade06f481d90f6..98209578e17e40ec42df0134f29e8b396a80ff71 100644 --- a/src/assets/scss/_icons.scss +++ b/src/assets/scss/_icons.scss @@ -5,7 +5,7 @@ display: inline-block; background: transparent; border-radius: 30px; - border: 2px solid $purple; + border: 2px solid $grey-1; height: 12px; width: 12px; min-width: 12px; @@ -15,7 +15,7 @@ content: ''; height: 2px; width: 8px; - background: $purple; + background: $grey-1; position: absolute; top: 14px; left: 10px; @@ -45,10 +45,6 @@ background: transparent; border-radius: 50%; } - - &.orange { - background: $orange; - } } .ico-dot-available { height: 12px; @@ -76,14 +72,14 @@ width: 30px; height: 30px; border-radius: 50% 50% 50% 0; - background: $purple; + background: $secondary-color; position: absolute; transform: rotate(-45deg); left: 50%; top: 50%; margin: -15px 0 0 -15px; &.selected { - background: $red-metro; + background: $primary-color; } } @@ -125,15 +121,15 @@ width: 12px; height: 12px; border-radius: 25px; - border: 2px solid $purple; + border: 2px solid $grey-1; } .body { width: 28px; height: 10px; border-radius: 20px 20px 0px 0px; - border-top: 2px solid $purple; - border-right: 2px solid $purple; - border-left: 2px solid $purple; + border-top: 2px solid $grey-1; + border-right: 2px solid $grey-1; + border-left: 2px solid $grey-1; } }