From 1d5dcfcd46b973791c4f19f1dd66f33f3498800a Mon Sep 17 00:00:00 2001
From: Eugen Rochko <eugen@zeonfederated.com>
Date: Sat, 13 May 2017 01:38:51 +0200
Subject: [PATCH] Make direct statuses stand out more (#3025)

Resolves #2515
---
 app/javascript/mastodon/components/status.js |  2 +-
 app/javascript/styles/components.scss        | 12 ++++++++++++
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/app/javascript/mastodon/components/status.js b/app/javascript/mastodon/components/status.js
index e82f1d7aa4..d2049c44a4 100644
--- a/app/javascript/mastodon/components/status.js
+++ b/app/javascript/mastodon/components/status.js
@@ -97,7 +97,7 @@ class Status extends ImmutablePureComponent {
     }
 
     return (
-      <div className={this.props.muted ? 'status muted' : 'status'}>
+      <div className={`status ${this.props.muted ? 'muted' : ''} status-${status.get('visibility')}`}>
         <div className='status__info'>
           <div className='status__info-time'>
             <a href={status.get('url')} className='status__relative-time' target='_blank' rel='noopener'><RelativeTimestamp timestamp={status.get('created_at')} /></a>
diff --git a/app/javascript/styles/components.scss b/app/javascript/styles/components.scss
index b5bbe749da..773ef0a5b7 100644
--- a/app/javascript/styles/components.scss
+++ b/app/javascript/styles/components.scss
@@ -501,6 +501,18 @@
   border-bottom: 1px solid lighten($ui-base-color, 8%);
   cursor: default;
 
+  &.status-direct {
+    background: lighten($ui-base-color, 8%);
+
+    .status__display-name strong {
+      color: $primary-text-color;
+    }
+
+    .icon-button.disabled {
+      color: lighten($ui-base-color, 16%);
+    }
+  }
+
   &.light {
     .status__relative-time {
       color: $ui-primary-color;