Remove $window dependency in markdown directive

Covert px values in markdown-editor.scss to use em. Note: I did this for all values except min-height on .markdown-preview which for some strange reason caused a weird flicker in Firefox.

Add 'markdown-' namespace to .preview and .preview-toggle classes.

Unnested CSS in markdown-editor.scss. Everything is well namespaced now so this is no longer necessary.

Apply consistent sentence case to the title attributes of the markdown tools.

h/static/scripts/directives/markdown.coffee

@@ -7,7 +7,7 @@
 # the markdown editor.
 ###
 
-markdown = ['$filter', '$timeout', '$window', ($filter, $timeout, $window) ->
+markdown = ['$filter', '$timeout', ($filter, $timeout) ->
   link: (scope, elem, attr, ctrl) ->
     return unless ctrl?
 
@@ -19,10 +19,7 @@ markdown = ['$filter', '$timeout', '$window', ($filter, $timeout, $window) ->
       if input.selectionStart != undefined
         startPos = input.selectionStart
         endPos = input.selectionEnd
-        if $window.getSelection().toString()
-          selectedText = $window.getSelection().toString()
-        else
-          selectedText = input.value.substring(startPos, endPos)
+        selectedText = input.value.substring(startPos, endPos)
         textBefore = input.value.substring(0, (startPos))
         textAfter = input.value.substring(endPos)
         selection = {

h/static/styles/markdown-editor.scss

+@import 'compass/css3/user-interface';
+
 //MARKDOWN EDITOR //////////////////////////
-[markdown] {
-  .preview {
-    overflow: auto;
-    border: 1px solid $gray-lighter;
-    background-color: $gray-lightest;
-    min-height: 120px;
-    padding-left: 10px;
-    resize: vertical;
-  }
+.markdown-preview {
+  overflow: auto;
+  border: .1em solid $gray-lighter;
+  background-color: $gray-lightest;
+  min-height: 120px;
+  padding-left: 0.9em;
+  resize: vertical;
+}
 
-  .markdown-tools {
-    margin-top: 10px;
-    border-top: 1px solid #D3D3D3;
-    border-left: 1px solid #D3D3D3;
-    border-right: 1px solid #D3D3D3;
-    border-radius: 2px 2px 0 0;
-    width: 100%;
-    margin-bottom: -1px;
-    padding: .7em .7em .7em .5em;
-    user-select: none;
-    -webkit-touch-callout: none;
-    -webkit-user-select: none;
-    -khtml-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
+.markdown-tools {
+  border-top: .1em solid #D3D3D3;
+  border-left: .1em solid #D3D3D3;
+  border-right: .1em solid #D3D3D3;
+  border-radius: .15em .15em 0 0;
+  width: 100%;
+  margin-bottom: -.1em;
+  padding: .7em .7em .7em .5em;
+  @include user-select(none);
 
-    &.disable {
-      .markdown-tools-button {
-        color: $gray-lighter;
-        pointer-events: none;
-      }
+  &.disable {
+    .markdown-tools-button {
+      color: $gray-lighter;
+      pointer-events: none;
     }
+  }
 
-    .markdown-tools-button {padding: 5px;}
+  .markdown-tools-button {padding: .4em;}
 
-    .markdown-tools-button, .markdown-tools-toggle, .icon-markdown {
-      color: $gray;
+  .markdown-tools-button, .markdown-tools-toggle, .icon-markdown {
+    color: $gray;
 
-      &:hover {
-        color: black;
-      }
+    &:hover {
+      color: black;
     }
+  }
 
-    .preview-toggle {
-      float: right;
-    }
+  .markdown-preview-toggle {
+    float: right;
   }
-}
\ No newline at end of file
+}