Consistent styling

app/assets/javascripts/dropdown.coffee

@@ -11,7 +11,7 @@ class Selector
     self = this
 
     @dropdown.on 'click', (e) ->
-      $(this).toggleClass('active')
+      $(this).toggleClass('active') unless $(this).hasClass('disabled')
       false
 
     @options.on 'click', (e) ->

app/assets/javascripts/pastemaster.coffee

@@ -3,6 +3,7 @@ $ ->
   $contents = $form.find('textarea')
   $_button = $form.find('input[type="submit"]')
   $button = $form.find('a[role="submit"]')
+  $syntax_selector = $('#syntax-selector')
 
   # Hide generic button, show styled button
   $_button.hide()
@@ -10,6 +11,8 @@ $ ->
   $contents.focus()
 
   # Binding submit event to new button
-  $button.on 'mouseup', ->
-    $form.submit()
+  $button.on 'click', (e) ->
+    $form.submit() unless $(this).hasClass('disabled')
+    $(this).addClass('disabled')
+    $syntax_selector.addClass('disabled')
     false

app/assets/stylesheets/dropdown.styl

@@ -1,10 +1,5 @@
 .wrapper-dropdown
-  position absolute
-  right 9em
-
-  width 15em
-  margin 0.4em auto
-
+  position relative
 
   &:after
     content ""
@@ -16,7 +11,7 @@
     margin-top -6px
     border-width 6px 0 6px 6px
     border-style solid
-    border-color transparent #666
+    border-color transparent #888
 
   .dropdown
     position absolute

app/assets/stylesheets/pastemaster.styl

@@ -47,10 +47,10 @@ textarea, input
 
 .btn
   background-color #fefefe
-  background-image -webkit-linear-gradient(top, #fff, #f0f0f0)
-  background-image linear-gradient(to bottom, #fff, #f0f0f0)
+  background-image -webkit-linear-gradient(top, #fff, #eaeaea)
+  background-image linear-gradient(to bottom, #fff, #eaeaea)
   color #666
-  text-shadow 0 0 .2em #fff
+  text-shadow 0 1px 1px #fff
   border #ddd 1px solid
   border-radius 4px
   font-size 1em
@@ -63,6 +63,10 @@ textarea, input
     box-shadow 0 .1em .2em .1em #eee inset
     border-bottom-width 1px
 
+  &.disabled
+    background #f0f0f0
+    cursor not-allowed
+
 textarea
   background-color #fff
   width 100%
@@ -73,11 +77,17 @@ textarea
   border-radius 5px
   padding .5em
 
+#syntax-selector
+  float right
+  width 13em
+  margin 0.4em
+
 form input[type="submit"], form a[role="submit"]
   float right
 
 form a[role="submit"]
   width 5em
+  font-weight 600
   text-align center
   margin .4em 0
   display none

app/views/form.slim

@@ -1,5 +1,9 @@
 form action="/" method="post" accept-charset="UTF-8"
   textarea name="contents"
+
+  input.btn type="submit" value="Save"
+  a.btn href="#" role="submit" Save
+
   input id="syntax-input" type="hidden" name="syntax" value=""
   div.btn id="syntax-selector" class="wrapper-dropdown" tabindex="1"
     span Syntax
@@ -7,5 +11,3 @@ form action="/" method="post" accept-charset="UTF-8"
       li.selected data-value="" Plain Text
       - for code, name in @syntaxes
         li data-value=code =name
-  input type="submit" value="Save"
-  a.btn href="#" role="submit" Save