Deprecate remaining color-signal-blue

This commit is contained in:
Josh Perez 2020-03-19 17:41:47 -07:00 committed by Scott Nonnenberg
parent 8d6cba1b43
commit d7b64cd986
14 changed files with 117 additions and 112 deletions

View file

@ -25,7 +25,7 @@
}
&.module-logo-blue {
background-color: $color-ultramarine-brand-light;
background-color: $ultramarine-brand-light;
}
}
@ -321,7 +321,7 @@
}
.module-message:focus .module-message__container {
@include keyboard-mode {
box-shadow: 0 0 0 3px $color-signal-blue;
box-shadow: 0 0 0 3px $ultramarine-ui-light;
}
}
@ -330,10 +330,10 @@
box-shadow: 0 0 0 5px transparent;
}
10% {
box-shadow: 0 0 0 5px $color-signal-blue;
box-shadow: 0 0 0 5px $ultramarine-ui-light;
}
70% {
box-shadow: 0 0 0 5px $color-signal-blue;
box-shadow: 0 0 0 5px $ultramarine-ui-light;
}
100% {
box-shadow: 0 0 0 5px transparent;
@ -371,11 +371,11 @@
background-color: $color-gray-75;
}
@include ios-theme {
background-color: $color-ultramarine-ui-light;
background-color: $ultramarine-ui-light;
color: $color-white;
}
@include ios-dark-theme {
background-color: $color-ultramarine-ui-light;
background-color: $ultramarine-ui-light;
color: $color-gray-05;
}
}
@ -688,7 +688,7 @@
@include keyboard-mode {
&:focus {
box-shadow: 0px 0px 0px 2px $color-signal-blue;
box-shadow: 0px 0px 0px 2px $ultramarine-ui-light;
}
}
}
@ -848,7 +848,7 @@
@include keyboard-mode {
&:focus {
box-shadow: 0px 0px 0px 2px $color-signal-blue;
box-shadow: 0px 0px 0px 2px $ultramarine-ui-light;
}
}
}
@ -1336,19 +1336,19 @@
border-bottom-right-radius: 16px;
@include light-theme {
color: $color-signal-blue;
color: $ultramarine-ui-light;
background-color: $color-gray-02;
border: 1px solid $color-black-alpha-20;
}
@include dark-theme {
color: $color-signal-blue;
color: $ultramarine-ui-dark;
background-color: $color-gray-75;
border: 1px solid $color-gray-45;
}
@include keyboard-mode {
&:focus {
box-shadow: 0px 0px 0px 2px $color-signal-blue;
box-shadow: 0px 0px 0px 2px $ultramarine-ui-light;
}
}
}
@ -1428,7 +1428,7 @@
@include keyboard-mode {
&:focus {
box-shadow: 0px 0px 0px 2px $color-signal-blue;
box-shadow: 0px 0px 0px 2px $ultramarine-ui-light;
}
}
@ -1590,7 +1590,7 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
@include keyboard-mode {
&:focus {
box-shadow: 0px 0px 0px 2px $color-signal-blue;
box-shadow: 0px 0px 0px 2px $ultramarine-ui-light;
}
}
}
@ -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
@include ios-theme {
background-color: $color-signal-blue-alpha-25;
border-left-color: $color-signal-blue;
background-color: $ultramarine-ui-light-alpha-25;
border-left-color: $ultramarine-ui-light;
}
@include ios-dark-theme {
background-color: $color-conversation-blue-shade;
border-left-color: $color-signal-blue;
border-left-color: $ultramarine-ui-dark;
}
}
@each $color, $value in $conversation-colors-tint {
@ -1816,7 +1816,7 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
@include keyboard-mode {
&:focus-within {
background-color: $color-signal-blue;
background-color: $ultramarine-ui-light;
}
}
}
@ -1880,25 +1880,25 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
}
.module-quote__icon-container__icon--file {
@include color-svg('../images/file.svg', $color-signal-blue);
@include color-svg('../images/file.svg', $ultramarine-ui-light);
}
.module-quote__icon-container__icon--image {
@include color-svg('../images/image.svg', $color-signal-blue);
@include color-svg('../images/image.svg', $ultramarine-ui-light);
}
.module-quote__icon-container__icon--microphone {
@include color-svg(
'../images/icons/v2/mic-outline-24.svg',
$color-signal-blue
$ultramarine-ui-light
);
}
.module-quote__icon-container__icon--play {
@include color-svg(
'../images/icons/v2/play-solid-24.svg',
$color-signal-blue
$ultramarine-ui-light
);
}
.module-quote__icon-container__icon--movie {
@include color-svg('../images/movie.svg', $color-signal-blue);
@include color-svg('../images/movie.svg', $ultramarine-ui-light);
}
.module-quote__generic-file {
@ -1957,7 +1957,7 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
background-color: $color-white-alpha-20;
}
@include ios-theme {
background-color: $color-signal-blue-tint-alpha-50;
background-color: $ultramarine-ui-light-tint-alpha-50;
}
@include ios-dark-theme {
background-color: $color-white-alpha-40;
@ -1967,7 +1967,7 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
.module-quote__reference-warning--incoming {
@include ios-dark-theme {
color: $color-gray-15;
background-color: $color-signal-blue-alpha-50;
background-color: $ultramarine-ui-light-alpha-50;
}
}
@ -2028,7 +2028,7 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
@include keyboard-mode {
&:focus {
box-shadow: 0px 0px 0px 2px $color-signal-blue;
box-shadow: 0px 0px 0px 2px $ultramarine-ui-light;
}
}
}
@ -2151,7 +2151,7 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
@include button-reset;
border-radius: 4px;
background-color: $color-signal-blue;
background-color: $ultramarine-ui-light;
display: inline-block;
padding: 6px;
margin-top: 20px;
@ -2314,7 +2314,7 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
padding: 12px;
border-radius: 4px;
color: $color-signal-blue;
color: $ultramarine-ui-light;
@include light-theme {
background-color: $color-gray-02;
@ -2998,7 +2998,7 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
}
.module-media-gallery__tab--active {
border-bottom: 2px solid $color-signal-blue;
border-bottom: 2px solid $ultramarine-ui-light;
}
.module-media-gallery__content {
@ -3060,7 +3060,7 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
@include keyboard-mode {
&:focus {
box-shadow: 0px 0px 0px 2px $color-signal-blue;
box-shadow: 0px 0px 0px 2px $ultramarine-ui-light;
}
}
}
@ -3107,7 +3107,7 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
@include keyboard-mode {
&:focus {
box-shadow: 0px 0px 0px 2px $color-signal-blue;
box-shadow: 0px 0px 0px 2px $ultramarine-ui-light;
}
}
}
@ -3160,7 +3160,7 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
width: 24px;
@include color-svg(
'../images/icons/v2/play-solid-24.svg',
$color-signal-blue
$ultramarine-ui-light
);
}
@ -3213,11 +3213,11 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
padding-left: 12px;
@include light-theme {
border-left: 4px solid $color-ultramarine-ui-light;
border-left: 4px solid $ultramarine-ui-light;
}
@include dark-theme {
border-left: 4px solid $color-ultramarine-ui-dark;
border-left: 4px solid $ultramarine-ui-dark;
}
}
@ -3256,11 +3256,11 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
color: $color-white;
@include light-theme {
background-color: $color-ultramarine-ui-light;
background-color: $ultramarine-ui-light;
box-shadow: 0px 0px 0px 1px $color-gray-02;
}
@include dark-theme {
background-color: $color-ultramarine-ui-dark;
background-color: $ultramarine-ui-dark;
box-shadow: 0px 0px 0px 1px $color-gray-90;
}
}
@ -3467,7 +3467,7 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
@include keyboard-mode {
&:focus {
box-shadow: 0px 0px 0px 2px $color-signal-blue;
box-shadow: 0px 0px 0px 2px $ultramarine-ui-light;
}
}
}
@ -3683,7 +3683,7 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
}
.module-avatar--signal-blue {
background-color: $color-signal-blue;
background-color: $ultramarine-ui-light;
}
@each $color, $value in $conversation-colors {
@ -3749,7 +3749,7 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
}
&:focus {
border: solid 1px $color-signal-blue;
border: solid 1px $ultramarine-ui-light;
outline: none;
}
}
@ -3810,7 +3810,7 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
width: 16px;
border-radius: 8px;
background-color: $color-signal-blue;
background-color: $ultramarine-ui-light;
}
.module-main-header__search__in-conversation-pill__avatar {
height: 16px;
@ -3954,13 +3954,13 @@ $timer-icons: '55', '50', '45', '40', '35', '30', '25', '20', '15', '10', '05',
right: 1px;
border-radius: 10px;
box-shadow: 0 0 0 3px $color-signal-blue;
box-shadow: 0 0 0 3px $ultramarine-ui-light;
}
}
button.module-image__border-overlay:focus {
@include keyboard-mode {
box-shadow: inset 0px 0px 0px 2px $color-signal-blue;
box-shadow: inset 0px 0px 0px 2px $ultramarine-ui-light;
}
}
@ -4036,7 +4036,7 @@ button.module-image__border-overlay:focus {
width: 24px;
@include color-svg(
'../images/icons/v2/play-solid-24.svg',
$color-signal-blue
$ultramarine-ui-light
);
}
@ -4069,7 +4069,7 @@ button.module-image__border-overlay:focus {
@include keyboard-mode {
&:focus {
outline: 2px solid $color-signal-blue;
outline: 2px solid $ultramarine-ui-light;
}
}
}
@ -4227,7 +4227,7 @@ button.module-image__border-overlay:focus {
@include keyboard-mode {
&:focus {
@include color-svg('../images/icons/v2/x-24.svg', $color-signal-blue);
@include color-svg('../images/icons/v2/x-24.svg', $ultramarine-ui-light);
}
}
}
@ -4434,7 +4434,7 @@ button.module-image__border-overlay:focus {
color: $color-white-alpha-80;
}
&:focus {
border: 1px solid $color-signal-blue;
border: 1px solid $ultramarine-ui-light;
outline: none;
}
}
@ -4443,7 +4443,7 @@ button.module-image__border-overlay:focus {
@include button-reset;
position: absolute;
background-color: $color-signal-blue;
background-color: $ultramarine-ui-light;
color: $color-white;
height: 28px;
@ -4479,7 +4479,7 @@ button.module-image__border-overlay:focus {
}
@include keyboard-mode {
&:focus {
box-shadow: inset 0 0 0 2px $color-signal-blue;
box-shadow: inset 0 0 0 2px $ultramarine-ui-light;
}
}
@ -4492,7 +4492,7 @@ button.module-image__border-overlay:focus {
}
@include dark-keyboard-mode {
&:focus {
box-shadow: inset 0 0 0 2px $color-signal-blue;
box-shadow: inset 0 0 0 2px $ultramarine-ui-light;
}
}
}
@ -4591,7 +4591,7 @@ button.module-image__border-overlay:focus {
}
@include keyboard-mode {
&:focus {
@include color-svg('../images/icons/v2/x-24.svg', $color-signal-blue);
@include color-svg('../images/icons/v2/x-24.svg', $ultramarine-ui-light);
}
}
@ -4600,7 +4600,7 @@ button.module-image__border-overlay:focus {
}
@include dark-keyboard-mode {
&:focus {
@include color-svg('../images/icons/v2/x-24.svg', $color-signal-blue);
@include color-svg('../images/icons/v2/x-24.svg', $ultramarine-ui-dark);
}
}
}
@ -4979,7 +4979,7 @@ button.module-image__border-overlay:focus {
}
@include keyboard-mode {
&:focus {
box-shadow: 0px 0px 0px 2px $color-signal-blue;
box-shadow: 0px 0px 0px 2px $ultramarine-ui-light;
}
}
@ -5140,7 +5140,7 @@ button.module-image__border-overlay:focus {
display: block;
width: 4px;
height: 4px;
background: $color-signal-blue;
background: $ultramarine-ui-light;
border-radius: 2px;
position: absolute;
bottom: 4px;
@ -5218,7 +5218,7 @@ button.module-image__border-overlay:focus {
&:focus {
@include color-svg(
'../images/icons/v2/chevron-left-24.svg',
$color-signal-blue
$ultramarine-ui-light
);
}
}
@ -5233,7 +5233,7 @@ button.module-image__border-overlay:focus {
&:hover {
@include color-svg(
'../images/icons/v2/chevron-left-24.svg',
$color-signal-blue
$ultramarine-ui-dark
);
}
}
@ -5630,7 +5630,7 @@ button.module-image__border-overlay:focus {
width: 14px;
height: 14px;
border-radius: 7px;
background: $color-signal-blue;
background: $ultramarine-ui-light;
}
}
}
@ -5741,11 +5741,11 @@ button.module-image__border-overlay:focus {
&--hint {
@include light-theme() {
color: $color-signal-blue;
color: $ultramarine-ui-light;
}
@include dark-theme() {
color: $color-signal-blue;
color: $ultramarine-ui-dark;
}
}
@ -5868,7 +5868,7 @@ button.module-image__border-overlay:focus {
@include keyboard-mode {
&:focus {
box-shadow: 0px 0px 0px 2px $color-signal-blue;
box-shadow: 0px 0px 0px 2px $ultramarine-ui-light;
}
}
@ -5972,11 +5972,11 @@ button.module-image__border-overlay:focus {
&--blue {
@include light-theme {
background: $color-signal-blue;
background: $ultramarine-ui-light;
color: $color-white;
}
@include dark-theme {
background: $color-signal-blue;
background: $ultramarine-ui-dark;
color: $color-white;
}
}
@ -6507,13 +6507,13 @@ button.module-image__border-overlay:focus {
&:focus {
@include keyboard-mode {
box-shadow: 0 0 0 3px $color-signal-blue;
box-shadow: 0 0 0 3px $ultramarine-ui-light;
}
}
&:hover {
@include mouse-mode {
box-shadow: 0 0 0 3px $color-signal-blue;
box-shadow: 0 0 0 3px $ultramarine-ui-light;
}
}
}
@ -6612,7 +6612,7 @@ button.module-image__border-overlay:focus {
border-color: $color-gray-60;
&:focus {
border-color: $color-signal-blue;
border-color: $ultramarine-ui-light;
}
&:placeholder {
@ -6626,7 +6626,7 @@ button.module-image__border-overlay:focus {
color: $color-gray-05;
&:focus {
border-color: $color-signal-blue;
border-color: $ultramarine-ui-light;
}
&:placeholder {
@ -6977,11 +6977,11 @@ button.module-image__border-overlay:focus {
border-radius: 4px;
@include light-theme {
color: $color-signal-blue;
color: $ultramarine-ui-light;
background-color: $color-gray-02;
}
@include dark-theme {
color: $color-signal-blue;
color: $ultramarine-ui-dark;
background-color: $color-gray-75;
}
}
@ -7080,11 +7080,11 @@ button.module-image__border-overlay:focus {
&:focus-within {
@include light-theme() {
border: 1px solid $color-signal-blue;
border: 1px solid $ultramarine-ui-light;
}
@include dark-theme() {
border: 1px solid $color-signal-blue;
border: 1px solid $ultramarine-ui-light;
}
}
}
@ -7204,7 +7204,10 @@ button.module-image__border-overlay:focus {
width: 24px;
height: 24px;
flex-shrink: 0;
@include color-svg('../images/icons/v2/send-24.svg', $color-signal-blue);
@include color-svg(
'../images/icons/v2/send-24.svg',
$ultramarine-ui-light
);
}
}
&__input {
@ -7350,7 +7353,7 @@ button.module-image__border-overlay:focus {
}
.module-scroll-down__button--new-messages {
background-color: $color-signal-blue;
background-color: $ultramarine-ui-light;
&:hover {
background-color: $color-ios-blue-shade;
@ -7594,10 +7597,13 @@ button.module-image__border-overlay:focus {
@include keyboard-mode {
&:focus {
@include light-theme {
@include color-svg('../images/icons/v2/x-24.svg', $color-signal-blue);
@include color-svg(
'../images/icons/v2/x-24.svg',
$ultramarine-ui-light
);
}
@include dark-theme {
@include color-svg('../images/icons/v2/x-24.svg', $color-signal-blue);
@include color-svg('../images/icons/v2/x-24.svg', $ultramarine-ui-dark);
}
}
}