made nsfw shield nicer and more condensed [ci skip]

config/locales/javascript/javascript.en.yml

@@ -83,8 +83,7 @@ en:
         reshare: "Reshare"
         comment: "Comment"
         original_post_deleted: "Original post deleted by author."
-        nsfw: "This post has been flagged NSFW by its author."
+        show_post: "Show post"
-        show: "Show"
 
         likes:
           zero: "<%= count %> Pins"

public/javascripts/app/templates/stream-element.handlebars

@@ -45,23 +45,23 @@
     </div>
 
     {{#if nsfw}}
-      <div class="shield_wrapper">
+      <div class="nsfw-shield">
-        <div class="shield">
+        <strong>
-          {{t "stream.nsfw"}}
+          NSFW
+        </strong>
+        |
         <a href="#">
-            {{t "stream.show"}}
+          {{t "stream.show_post"}}
         </a>
       </div>
-    {{/if}}
+
+    {{else}}
 
       <div class="post-content"> </div>
 
-    {{#if nsfw}}
-      </div>
-    {{/if}}
-
       <div class="feedback"> </div>
       <div class="likes"> </div>
       <div class="comments"> </div>
+    {{/if}}
 
   </div>

public/javascripts/app/views/post_view.js

@@ -6,7 +6,7 @@ app.views.Post = app.views.StreamObject.extend({
 
   events: {
     "click .focus_comment_textarea": "focusCommentTextarea",
-    "click .shield a": "removeNsfwShield",
+    "click .nsfw-shield a": "removeNsfwShield",
     "click .remove_post": "destroyModel",
     "click .hide_post": "hidePost",
     "click .block_user": "blockUser"
@@ -55,9 +55,8 @@ app.views.Post = app.views.StreamObject.extend({
 
   removeNsfwShield: function(evt){
     if(evt){ evt.preventDefault(); }
-
+    this.model.set({nsfw : false})
-    $(evt.target).parent(".shield").remove();
+    this.render();
-
     return this;
   },
 

public/stylesheets/sass/application.sass

@@ -2786,20 +2786,13 @@ a.toggle_selector
       &:hover
         @include opacity(1)
 
-.shield
+.nsfw-shield
   @include border-radius(3px)
-  :z-index 3
   :background-color #eee
-  :position absolute
+  :width 90%
-  :width 100%
+  :padding 5px 10px
-  :min-height 100%
-  :padding 5px
   :border 1px solid #ddd
-
+  :color #999
-.shield_wrapper
-  :position relative
-  :margin
-    :bottom 15px
 
 #back-to-top
   :display block

spec/javascripts/app/views/post_view_spec.js

@@ -68,7 +68,7 @@ describe("app.views.Post", function(){
         var view = new app.views.Post({model : this.statusMessage}).render();
         var statusElement = $(view.el)
 
-        expect(statusElement.find(".shield").length).toBe(1)
+        expect(statusElement.find(".nsfw-shield").length).toBe(1)
       })
 
       it("does not contain a shield element", function(){