mirrors/signal-desktop
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 2 Wiki Activity Actions

Update quote reply color in iOS theme

Browse source
This commit is contained in:
Josh Perez 2020-04-01 12:33:16 -07:00 • committed by Scott Nonnenberg
parent 12c2017b2e
commit efd12028f0
3 changed files with 34 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

8
stylesheets/_conversation.scss
View file

@ -232,9 +232,13 @@
margin: 0; margin: 0;
border-left-style: none; border-left-style: none;
@include ios-dark-theme {
background-color: $ultramarine-brand-dark;
border-left-color: $color-black;
}
@include ios-theme { @include ios-theme {
background-color: $ultramarine-ui-light-alpha-25; background-color: $color-ios-blue-tint;
border-left-color: $ultramarine-ui-light; border-left-color: $color-white;
} }
} }

42
stylesheets/_modules.scss
View file

@ -1626,13 +1626,13 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
} }
// Note: both of these override all of the specific color classes below // Note: both of these override all of the specific color classes below
@include ios-theme {
border-left-color: $color-white;
background-color: $color-white-alpha-60;
}
@include ios-dark-theme { @include ios-dark-theme {
background-color: $ultramarine-brand-dark;
border-left-color: $color-black; border-left-color: $color-black;
background-color: $color-conversation-blue-shade; }
@include ios-theme {
background-color: $color-ios-blue-tint;
border-left-color: $color-white;
} }
} }
@ -1668,12 +1668,12 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
// Note: both of these override all of the specific color classes below // Note: both of these override all of the specific color classes below
@include ios-theme { @include ios-theme {
background-color: $ultramarine-ui-light-alpha-25; background-color: $color-ios-blue-tint;
border-left-color: $ultramarine-ui-light; border-left-color: $color-white;
} }
@include ios-dark-theme { @include ios-dark-theme {
background-color: $color-conversation-blue-shade; background-color: $ultramarine-ui-dark;
border-left-color: $ultramarine-ui-dark; border-left-color: $color-black;
} }
} }
@each $color, $value in $conversation-colors-tint { @each $color, $value in $conversation-colors-tint {
@ -1942,6 +1942,7 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
} }
.module-quote__reference-warning { .module-quote__reference-warning {
color: $color-gray-90;
height: 26px; height: 26px;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -1957,17 +1958,20 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
background-color: $color-white-alpha-20; background-color: $color-white-alpha-20;
} }
@include ios-theme { @include ios-theme {
background-color: $ultramarine-ui-light-tint-alpha-50; background-color: $color-ios-ref-warning-light;
} }
@include ios-dark-theme { @include ios-dark-theme {
background-color: $color-white-alpha-40; background-color: $color-ios-ref-warning-dark;
} }
} }
.module-quote__reference-warning--incoming { .module-quote__reference-warning--incoming {
color: $color-gray-90;
@include ios-theme {
background-color: $color-ios-ref-warning-light;
}
@include ios-dark-theme { @include ios-dark-theme {
color: $color-gray-15; background-color: $color-ios-ref-warning-dark;
background-color: $ultramarine-ui-light-alpha-50;
} }
} }
@ -1981,14 +1985,20 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
@include dark-theme { @include dark-theme {
@include color-svg('../images/icons/v2/link-broken-16.svg', $color-gray-25); @include color-svg('../images/icons/v2/link-broken-16.svg', $color-gray-25);
} }
@include ios-theme {
@include color-svg('../images/icons/v2/link-broken-16.svg', $color-gray-90);
}
@include ios-dark-theme { @include ios-dark-theme {
@include color-svg('../images/icons/v2/link-broken-16.svg', $color-gray-90); @include color-svg('../images/icons/v2/link-broken-16.svg', $color-gray-90);
} }
} }
.module-quote__reference-warning__icon--incoming { .module-quote__reference-warning__icon--incoming {
@include ios-theme {
@include color-svg('../images/icons/v2/link-broken-16.svg', $color-gray-90);
}
@include ios-dark-theme { @include ios-dark-theme {
@include color-svg('../images/icons/v2/link-broken-16.svg', $color-gray-15); @include color-svg('../images/icons/v2/link-broken-16.svg', $color-gray-90);
} }
} }
@ -2010,7 +2020,7 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
.module-quote__reference-warning__text--incoming { .module-quote__reference-warning__text--incoming {
@include ios-dark-theme { @include ios-dark-theme {
color: $color-gray-05; color: $color-gray-90;
} }
} }
@ -7356,7 +7366,7 @@ button.module-image__border-overlay:focus {
background-color: $ultramarine-ui-light; background-color: $ultramarine-ui-light;
&:hover { &:hover {
background-color: $color-ios-blue-shade; background-color: $ultramarine-brand-dark;
} }
} }

8
stylesheets/_variables.scss
View file

@ -57,7 +57,8 @@ $color-steel: #6b6b78;
$color-ios-blue-tint: #b0c8f9; $color-ios-blue-tint: #b0c8f9;
// Used for scroll down button hover state when it has new messages // Used for scroll down button hover state when it has new messages
$color-ios-blue-shade: #1851b4; $color-ios-ref-warning-light: #d2def8;
$color-ios-ref-warning-dark: #7b97cd;
$color-crimson-tint: #eda6ae; $color-crimson-tint: #eda6ae;
$color-vermilion-tint: #eba78e; $color-vermilion-tint: #eba78e;
@ -176,11 +177,6 @@ $color-white-alpha-40: rgba($color-white, 0.4);
// Used in tap-to-view error states // Used in tap-to-view error states
$color-deep-red: #ff261f; $color-deep-red: #ff261f;
// Used in iOS quote composition and reference warnings
$ultramarine-ui-light-alpha-25: rgba($ultramarine-ui-light, 0.25);
$ultramarine-ui-light-alpha-50: rgba($ultramarine-ui-light, 0.5);
$ultramarine-ui-light-tint-alpha-50: rgba($color-ios-blue-tint, 0.5);
// -- A few layout variables used cross-file // -- A few layout variables used cross-file
$left-pane-width: 320px; $left-pane-width: 320px;