Issue #2446889: Merge in dev branch

sass/partials/common/_comment.scss

@@ -45,6 +45,9 @@
   .picture {
     float: left;
     width: 40px;
+    img {
+      display: block;
+    }
   }
   // Move out of the way of the user picture.
   > h3, .submitted, .content {
@@ -112,6 +115,12 @@
       }
     }
   }
+
+  .new-user {
+    @include new-user-badge;
+    font-size: .7692em; /* 10px */
+    line-height: 1.3; /* 13px */
+  }
 }
 
 .user-signature {

sass/partials/common/_user-profile.scss

@@ -16,6 +16,17 @@
       width: 100%; // IE SVG scaling.
     }
   }
+
+  .user-picture {
+    img {
+      display: block;
+    }
+    .new-user {
+      @include new-user-badge;
+      line-height: 2.4;
+      width: 140px;
+    }
+  }
 }
 
 @media all and (min-width: 451px) {

sass/partials/utilities/_mixins.scss

@@ -64,3 +64,28 @@
     cursor: pointer;
   }
 }
+
+@mixin element-invisible {
+  position: absolute !important;
+  clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
+  clip: rect(1px, 1px, 1px, 1px);
+  overflow: hidden;
+  height: 1px;
+}
+
+@mixin element-visible {
+  position: inherit !important;
+  clip: inherit;
+  overflow: inherit;
+  height: inherit;
+}
+
+@mixin new-user-badge {
+  background-color: #0D7DC1;
+  color: white;
+  text-align: center;
+  text-transform: uppercase;
+  span {
+    @include element-invisible;
+  }
+}