UX: Use smaller messages for moderator actions.

app/assets/stylesheets/desktop/topic-post.scss

@@ -726,35 +726,56 @@ $topic-avatar-width: 45px;
   width: calc(#{$topic-avatar-width} + #{$topic-body-width} + 2 * #{$topic-body-width-padding});
 }
 
-.time-gap {
+.small-action {
   width: 755px;
   border-top: 1px solid dark-light-diff($primary, $secondary, 90%, -60%);
+
   .topic-avatar {
     padding: 5px 0;
     border-top: none;
+    float: left;
+    i {
+      font-size: 35px;
+      width: 45px;
+      text-align: center;
+      color: lighten($primary, 75%);
+    }
   }
-}
 
-.time-gap .topic-avatar i {
-  font-size: 35px;
-  width: 45px;
-  text-align: center;
-  color: lighten($primary, 75%);
-}
-.time-gap-words {
-  display: inline-block;
-  padding: 0.5em 1em;
-  margin-top: 9px;
-  text-transform: uppercase;
-  font-weight: bold;
-  font-size: 0.9em;
-  color: lighten($primary, 60%);
+  .small-action-desc {
+    display: inline-block;
+    padding: 0.5em 1em;
+    margin-top: 5px;
+    text-transform: uppercase;
+    font-weight: bold;
+    font-size: 0.9em;
+    color: lighten($primary, 60%);
+    width: 680px;
+
+    .avatar {
+      margin-right: 0.8em;
+      float: left;
+    }
+
+    p {
+      margin: 0;
+      padding-top: 4px;
+    }
+  }
+
+  button {
+    background: transparent;
+    border: 0;
+    float: right;
+  }
+
+  clear: both;
 }
 
 .posts-wrapper {
   position: relative;
   -webkit-font-smoothing: subpixel-antialiased;
-  }
+}
 
 .dropdown {
   position: relative;