Improving design

app/assets/stylesheets/home.scss

@@ -1,3 +1,10 @@
-// Place all the styles related to the Home controller here.
-// They will automatically be included in application.css.
-// You can use Sass (SCSS) here: http://sass-lang.com/
+.footer {
+  text-align: center;
+  padding: 100px 0;
+
+  .mastodon-link {
+    color: #566270;
+    text-decoration: none;
+    font-size: 16px;
+  }
+}

app/assets/stylesheets/profile.scss

@@ -53,36 +53,56 @@ body {
 
 .activity-stream {
   clear: both;
+  box-shadow: 4px 3px 0 rgba(0, 0, 0, 0.1);
 
   .entry {
-    padding: 10px;
     border-bottom: 1px solid #E0E3DA;
     background: #FFFFF3;
+    border-left: 2px solid #A593E0;
 
-    &:first-child {
-      border-radius: 5px 5px 0 0;
+    &.entry-reblog {
+      border-left: 2px solid #566270;
     }
 
     &:last-child {
       border-bottom: 0;
-      border-radius: 0 0 5px 5px;
     }
   }
 
   .header {
     margin-bottom: 10px;
+    padding: 10px;
+    padding-bottom: 0;
+    padding-left: 8px;
+
+    .name {
+      text-decoration: none;
+      color: #566270;
+
+      strong {
+        color: #000;
+      }
+
+      &:hover {
+        strong {
+          text-decoration: underline;
+        }
+      }
+    }
   }
 
-  .name {
-    text-decoration: none;
+  .pre-header {
+    border-bottom: 1px solid #E0E3DA;
     color: #566270;
+    padding: 5px 10px;
+    padding-left: 8px;
 
-    strong {
-      color: #000;
-    }
+    .name {
+      color: #566270;
+      font-weight: bold;
+      text-decoration: none;
 
-    &:hover {
-      strong {
+      &:hover {
         text-decoration: underline;
       }
     }
@@ -90,6 +110,8 @@ body {
 
   .content {
     font-size: 16px;
+    padding: 0 10px;
+    padding-left: 8px;
   }
 
   .time {
@@ -105,10 +127,19 @@ body {
     margin-top: 15px;
     color: #566270;
     cursor: default;
+    padding: 10px;
+    padding-top: 0;
+    padding-left: 8px;
 
     .counter {
       display: inline-block;
       margin-right: 10px;
     }
+
+    .conversation-link {
+      color: #A593E0;
+      text-decoration: underline;
+      float: right;
+    }
   }
 }

app/views/layouts/application.html.haml

@@ -9,3 +9,5 @@
   %body
     .container
       = yield
+    .footer
+      = link_to 'Mastodon', 'https://github.com/Gargron/mastodon', class: 'mastodon-link'

app/views/profile/_status.html.haml

@@ -1,4 +1,9 @@
-%div.entry
+%div.entry{ class: status.reblog? ? 'entry-reblog' : 'entry-status' }
+  - if status.reblog?
+    .pre-header
+      %i.fa.fa-retweet
+      Shared by
+      = link_to status.account.display_name.blank? ? status.account.username : status.account.display_name, (status.account.local? ? profile_url(name: status.account.username) : status.account.url), class: 'name'
   .header
     = render partial: 'status_header', locals: { status: status.reblog? ? status.reblog : status }
   .content

app/views/profile/_status_footer.html.haml

@@ -5,3 +5,6 @@
 .counter.counter-favourites
   %i.fa.fa-star
   %span.num= status.favourites.count
+
+- if status.reply?
+  = link_to 'View conversation', status.thread.local? ? status_url(name: status.thread.account.username, id: status.thread.id) : status.thread.url, class: 'conversation-link'