Make .status CSS rules more specific to fix onboarding text (#1547)
FREEBIE
This commit is contained in:
parent
b64f2969fd
commit
c2fa61d0b4
3 changed files with 18 additions and 17 deletions
|
@ -391,23 +391,24 @@ li.entry .error-icon-container {
|
|||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.status {
|
||||
// There's a p.status used in the onboarding screen, so this needs to be more specific
|
||||
span.status {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
}
|
||||
.sent .status {
|
||||
.sent span.status {
|
||||
display: inline-block;
|
||||
@include color-svg('../images/check.svg', black);
|
||||
}
|
||||
.delivered .status {
|
||||
.delivered span.status {
|
||||
display: inline-block;
|
||||
@include color-svg('../images/double-check.svg', black);
|
||||
}
|
||||
.read .status {
|
||||
.read span.status {
|
||||
display: inline-block;
|
||||
@include color-svg('../images/double-check.svg', $blue);
|
||||
}
|
||||
.pending .status {
|
||||
.pending span.status {
|
||||
display: inline-block;
|
||||
background: none;
|
||||
&:before { content: '...'; }
|
||||
|
|
|
@ -125,15 +125,15 @@ $text-dark_l2: darken($text-dark, 30%);
|
|||
@include color-svg('../images/verified-check.svg', $text-dark);
|
||||
}
|
||||
}
|
||||
.sent .status {
|
||||
.sent span.status {
|
||||
display: inline-block;
|
||||
@include color-svg('../images/check.svg', white);
|
||||
}
|
||||
.delivered .status {
|
||||
.delivered span.status {
|
||||
display: inline-block;
|
||||
@include color-svg('../images/double-check.svg', white);
|
||||
}
|
||||
.read .status {
|
||||
.read span.status {
|
||||
display: inline-block;
|
||||
@include color-svg('../images/double-check.svg', $blue);
|
||||
}
|
||||
|
|
|
@ -1393,32 +1393,32 @@ li.entry .error-icon-container {
|
|||
margin-right: 3px;
|
||||
white-space: nowrap; }
|
||||
|
||||
.status {
|
||||
span.status {
|
||||
width: 18px;
|
||||
height: 18px; }
|
||||
|
||||
.sent .status {
|
||||
.sent span.status {
|
||||
display: inline-block;
|
||||
-webkit-mask: url("../images/check.svg") no-repeat center;
|
||||
-webkit-mask-size: 100%;
|
||||
background-color: black; }
|
||||
|
||||
.delivered .status {
|
||||
.delivered span.status {
|
||||
display: inline-block;
|
||||
-webkit-mask: url("../images/double-check.svg") no-repeat center;
|
||||
-webkit-mask-size: 100%;
|
||||
background-color: black; }
|
||||
|
||||
.read .status {
|
||||
.read span.status {
|
||||
display: inline-block;
|
||||
-webkit-mask: url("../images/double-check.svg") no-repeat center;
|
||||
-webkit-mask-size: 100%;
|
||||
background-color: #2090ea; }
|
||||
|
||||
.pending .status {
|
||||
.pending span.status {
|
||||
display: inline-block;
|
||||
background: none; }
|
||||
.pending .status:before {
|
||||
.pending span.status:before {
|
||||
content: '...'; }
|
||||
|
||||
.message-container,
|
||||
|
@ -2347,17 +2347,17 @@ li.entry .error-icon-container {
|
|||
-webkit-mask: url("../images/verified-check.svg") no-repeat center;
|
||||
-webkit-mask-size: 100%;
|
||||
background-color: #CCCCCC; }
|
||||
.android-dark .sent .status {
|
||||
.android-dark .sent span.status {
|
||||
display: inline-block;
|
||||
-webkit-mask: url("../images/check.svg") no-repeat center;
|
||||
-webkit-mask-size: 100%;
|
||||
background-color: white; }
|
||||
.android-dark .delivered .status {
|
||||
.android-dark .delivered span.status {
|
||||
display: inline-block;
|
||||
-webkit-mask: url("../images/double-check.svg") no-repeat center;
|
||||
-webkit-mask-size: 100%;
|
||||
background-color: white; }
|
||||
.android-dark .read .status {
|
||||
.android-dark .read span.status {
|
||||
display: inline-block;
|
||||
-webkit-mask: url("../images/double-check.svg") no-repeat center;
|
||||
-webkit-mask-size: 100%;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue