diff --git a/stylesheets/_mixins.scss b/stylesheets/_mixins.scss index 364c052d..1b81f195 100644 --- a/stylesheets/_mixins.scss +++ b/stylesheets/_mixins.scss @@ -34,6 +34,25 @@ &.grey { background-color: #999999 ; } &.default { background-color: $blue ; } } +@mixin dark-avatar-colors { + &.red { background-color: $dark_material_red ; } + &.pink { background-color: $dark_material_pink ; } + &.purple { background-color: $dark_material_purple ; } + &.deep_purple { background-color: $dark_material_deep_purple ; } + &.indigo { background-color: $dark_material_indigo ; } + &.blue { background-color: $dark_material_blue ; } + &.light_blue { background-color: $dark_material_light_blue ; } + &.cyan { background-color: $dark_material_cyan ; } + &.teal { background-color: $dark_material_teal ; } + &.green { background-color: $dark_material_green ; } + &.light_green { background-color: $dark_material_light_green ; } + &.orange { background-color: $dark_material_orange ; } + &.deep_orange { background-color: $dark_material_deep_orange ; } + &.amber { background-color: $dark_material_amber ; } + &.blue_grey { background-color: $dark_material_blue_grey ; } + &.grey { background-color: #666666 ; } + &.default { background-color: $blue ; } +} @mixin invert-text-color { color: white; diff --git a/stylesheets/_variables.scss b/stylesheets/_variables.scss index 3f8e230d..2c7afa04 100644 --- a/stylesheets/_variables.scss +++ b/stylesheets/_variables.scss @@ -64,3 +64,19 @@ $material_orange: #FF9800; $material_deep_orange: #FF5722; $material_amber: #FFB300; $material_blue_grey: #607D8B; + +$dark_material_red: #D32F2F; +$dark_material_pink: #C2185B; +$dark_material_purple: #7B1FA2; +$dark_material_deep_purple: #512DA8; +$dark_material_indigo: #303F9F; +$dark_material_blue: #1976D2; +$dark_material_light_blue: #0288D1; +$dark_material_cyan: #0097A7; +$dark_material_teal: #00796B; +$dark_material_green: #388E3C; +$dark_material_light_green: #689F38; +$dark_material_orange: #F57C00; +$dark_material_deep_orange: #E64A19; +$dark_material_amber: #FFA000; +$dark_material_blue_grey: #455A64; diff --git a/stylesheets/android-dark.scss b/stylesheets/android-dark.scss index 30be49ed..f354a1ab 100644 --- a/stylesheets/android-dark.scss +++ b/stylesheets/android-dark.scss @@ -62,8 +62,8 @@ $text-dark: #CCCCCC; .conversation.placeholder .conversation-header { display: none; } - .conversation-header, .bubble { - @include avatar-colors; + .avatar, .conversation-header, .bubble { + @include dark-avatar-colors; } .message-list .advisory .content { background-color: $grey-dark; diff --git a/stylesheets/manifest.css b/stylesheets/manifest.css index 4c937476..95127b40 100644 --- a/stylesheets/manifest.css +++ b/stylesheets/manifest.css @@ -1738,39 +1738,39 @@ li.entry .error-icon-container { border-color: #333333; } .android-dark .conversation.placeholder .conversation-header { display: none; } - .android-dark .conversation-header.red, .android-dark .bubble.red { - background-color: #EF5350; } - .android-dark .conversation-header.pink, .android-dark .bubble.pink { - background-color: #EC407A; } - .android-dark .conversation-header.purple, .android-dark .bubble.purple { - background-color: #AB47BC; } - .android-dark .conversation-header.deep_purple, .android-dark .bubble.deep_purple { - background-color: #7E57C2; } - .android-dark .conversation-header.indigo, .android-dark .bubble.indigo { - background-color: #5C6BC0; } - .android-dark .conversation-header.blue, .android-dark .bubble.blue { - background-color: #2196F3; } - .android-dark .conversation-header.light_blue, .android-dark .bubble.light_blue { - background-color: #03A9F4; } - .android-dark .conversation-header.cyan, .android-dark .bubble.cyan { - background-color: #00BCD4; } - .android-dark .conversation-header.teal, .android-dark .bubble.teal { - background-color: #009688; } - .android-dark .conversation-header.green, .android-dark .bubble.green { - background-color: #4CAF50; } - .android-dark .conversation-header.light_green, .android-dark .bubble.light_green { - background-color: #7CB342; } - .android-dark .conversation-header.orange, .android-dark .bubble.orange { - background-color: #FF9800; } - .android-dark .conversation-header.deep_orange, .android-dark .bubble.deep_orange { - background-color: #FF5722; } - .android-dark .conversation-header.amber, .android-dark .bubble.amber { - background-color: #FFB300; } - .android-dark .conversation-header.blue_grey, .android-dark .bubble.blue_grey { - background-color: #607D8B; } - .android-dark .conversation-header.grey, .android-dark .bubble.grey { - background-color: #999999; } - .android-dark .conversation-header.default, .android-dark .bubble.default { + .android-dark .avatar.red, .android-dark .conversation-header.red, .android-dark .bubble.red { + background-color: #D32F2F; } + .android-dark .avatar.pink, .android-dark .conversation-header.pink, .android-dark .bubble.pink { + background-color: #C2185B; } + .android-dark .avatar.purple, .android-dark .conversation-header.purple, .android-dark .bubble.purple { + background-color: #7B1FA2; } + .android-dark .avatar.deep_purple, .android-dark .conversation-header.deep_purple, .android-dark .bubble.deep_purple { + background-color: #512DA8; } + .android-dark .avatar.indigo, .android-dark .conversation-header.indigo, .android-dark .bubble.indigo { + background-color: #303F9F; } + .android-dark .avatar.blue, .android-dark .conversation-header.blue, .android-dark .bubble.blue { + background-color: #1976D2; } + .android-dark .avatar.light_blue, .android-dark .conversation-header.light_blue, .android-dark .bubble.light_blue { + background-color: #0288D1; } + .android-dark .avatar.cyan, .android-dark .conversation-header.cyan, .android-dark .bubble.cyan { + background-color: #0097A7; } + .android-dark .avatar.teal, .android-dark .conversation-header.teal, .android-dark .bubble.teal { + background-color: #00796B; } + .android-dark .avatar.green, .android-dark .conversation-header.green, .android-dark .bubble.green { + background-color: #388E3C; } + .android-dark .avatar.light_green, .android-dark .conversation-header.light_green, .android-dark .bubble.light_green { + background-color: #689F38; } + .android-dark .avatar.orange, .android-dark .conversation-header.orange, .android-dark .bubble.orange { + background-color: #F57C00; } + .android-dark .avatar.deep_orange, .android-dark .conversation-header.deep_orange, .android-dark .bubble.deep_orange { + background-color: #E64A19; } + .android-dark .avatar.amber, .android-dark .conversation-header.amber, .android-dark .bubble.amber { + background-color: #FFA000; } + .android-dark .avatar.blue_grey, .android-dark .conversation-header.blue_grey, .android-dark .bubble.blue_grey { + background-color: #455A64; } + .android-dark .avatar.grey, .android-dark .conversation-header.grey, .android-dark .bubble.grey { + background-color: #666666; } + .android-dark .avatar.default, .android-dark .conversation-header.default, .android-dark .bubble.default { background-color: #2090ea; } .android-dark .message-list .advisory .content { background-color: #333333; }