Make .status CSS rules more specific to fix onboarding text (#1547)

FREEBIE

stylesheets/_conversation.scss

@@ -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: '...'; }

stylesheets/android-dark.scss

@@ -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);
   }

stylesheets/manifest.css

@@ -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%;