From e97345b4527f5f22272573fc769a7d5f6800235b Mon Sep 17 00:00:00 2001 From: Tayane Fernandes Date: Wed, 23 Nov 2016 18:26:39 -0200 Subject: [#722] Changed color for the email list and action buttons --- web-ui/app/scss/_others.scss | 2 +- web-ui/app/scss/base/_colors.scss | 1 + web-ui/app/scss/views/_action-bar.scss | 5 +++-- web-ui/app/scss/views/_compose-view.scss | 2 +- web-ui/app/scss/views/_mail-list.scss | 32 +++++++++++++++++++++++++++++--- 5 files changed, 35 insertions(+), 7 deletions(-) (limited to 'web-ui') diff --git a/web-ui/app/scss/_others.scss b/web-ui/app/scss/_others.scss index a5796ebe..039d94bd 100644 --- a/web-ui/app/scss/_others.scss +++ b/web-ui/app/scss/_others.scss @@ -59,7 +59,7 @@ section { } &#middle-pane { - background: $contrast; + background: $white; } &#right-pane { diff --git a/web-ui/app/scss/base/_colors.scss b/web-ui/app/scss/base/_colors.scss index b95a02f6..17333ff9 100644 --- a/web-ui/app/scss/base/_colors.scss +++ b/web-ui/app/scss/base/_colors.scss @@ -4,6 +4,7 @@ $light_gray: #C2C2C2; $lighter_blue: #91C2D1; $light_blue: #3DABC4; $dark_blue: #178CA6; +$bullet-blue: #5cacde; $light_orange: #FF9C00; $dark_orange: #FF7902; diff --git a/web-ui/app/scss/views/_action-bar.scss b/web-ui/app/scss/views/_action-bar.scss index 8de07876..40e677b0 100644 --- a/web-ui/app/scss/views/_action-bar.scss +++ b/web-ui/app/scss/views/_action-bar.scss @@ -10,9 +10,10 @@ margin: 0; border-top: 1px solid $white; border-bottom: 2px solid lighten($top_pane, 30%); - background: $top_pane; + background: $white; clear: both; overflow: hidden; + padding-left: 10px; li { display: inline-block; @@ -33,7 +34,7 @@ input[type=button] { margin: 2px; padding: 4px 10px; - background: lighten($contrast, 70%); + background: $background_light_grey; color: $dark_grey; text-transform: uppercase; font-weight: 400; diff --git a/web-ui/app/scss/views/_compose-view.scss b/web-ui/app/scss/views/_compose-view.scss index d4de5fa4..9e120357 100644 --- a/web-ui/app/scss/views/_compose-view.scss +++ b/web-ui/app/scss/views/_compose-view.scss @@ -44,7 +44,7 @@ padding: 5px; border: 1px solid $border_light_grey; border-radius: 2px; - background-color: $background_light_grey; + background-color: $contrast; &-label { color: $attachment_text; diff --git a/web-ui/app/scss/views/_mail-list.scss b/web-ui/app/scss/views/_mail-list.scss index 66bcabbe..f5c4c60f 100644 --- a/web-ui/app/scss/views/_mail-list.scss +++ b/web-ui/app/scss/views/_mail-list.scss @@ -15,11 +15,24 @@ &.status-read { font-weight: normal; color: $attachment_text; + + .mail-list-entry__checkbox::after { + display: none; + } } + &.selected { - background: $white; + background: $light_blue; z-index: 10; // overlay the box-shadow of the right page (z-index: 2) + + &:hover { + background: $light_blue; + } + + a { + color: $white; + } } &:hover { @@ -35,6 +48,20 @@ left: 20px; } + &::after { + content: ''; + display: inline-block; + width: 8px; + height: 8px; + -moz-border-radius: 15px; + -webkit-border-radius: 15px; + border-radius: 15px; + background-color: $bullet-blue; + position: absolute; + left: 48px; + top: 13px; + } + & > input[type=checkbox] { @include check-box; } @@ -43,7 +70,7 @@ &__item { display: block; color: $dark_grey; - padding: 8px 10px 10px 34px; + padding: 8px 10px 10px 67px; height: 100%; &-from { @@ -95,4 +122,3 @@ } } } - -- cgit v1.2.3