FIX: mobile modal close button position, mobile layout of radio buttons and checkboxes

app/assets/javascripts/discourse/templates/modal.hbs

@@ -3,11 +3,11 @@
     <div class="modal-middle-container">
       <div class="modal-inner-container">
         <div class="modal-header">
-          <h3>{{title}}</h3>
-
           <div class='modal-close'>
             <a class="close" {{action "closeModal"}}>{{fa-icon "times"}}</a>
           </div>
+
+          <h3>{{title}}</h3>
         </div>
 
         <div id='modal-alert'></div>

app/assets/stylesheets/common/base/discourse.scss

@@ -149,6 +149,43 @@ body {
   .profiler-results.profiler-left {
     top: 60px !important;
   }
+
+  label {
+    display: block;
+    margin-bottom: 5px;
+  }
+  input {
+    &[type="radio"], &[type="checkbox"] {
+      margin: 3px 0;
+      line-height: normal;
+      cursor: pointer;
+    }
+    &[type="submit"], &[type="reset"], &[type="button"], &[type="radio"], &[type="checkbox"] {
+      width: auto;
+    }
+  }
+  .radio, .checkbox {
+    min-height: 18px;
+    padding-left: 18px;
+  }
+  .radio input[type="radio"], .checkbox input[type="checkbox"] {
+    float: left;
+    margin-left: -18px;
+  }
+  .controls > {
+    .radio:first-child, .checkbox:first-child {
+      padding-top: 5px;
+    }
+  }
+  .radio.inline, .checkbox.inline {
+    display: inline-block;
+    padding-top: 5px;
+    margin-bottom: 0;
+    vertical-align: middle;
+  }
+  .radio.inline .radio.inline, .checkbox.inline .checkbox.inline {
+    margin-left: 10px;
+  }
 }
 
 .unread-private-messages {

app/assets/stylesheets/desktop/discourse.scss

@@ -191,10 +191,6 @@ body {
   input, button, select, textarea {
     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
   }
-  label {
-    display: block;
-    margin-bottom: 5px;
-  }
   select, textarea {
     display: inline-block;
     padding: 4px;
@@ -246,17 +242,6 @@ body {
     }
   }
 
-  input {
-    &[type="radio"], &[type="checkbox"] {
-      margin: 3px 0;
-      line-height: normal;
-      cursor: pointer;
-    }
-    &[type="submit"], &[type="reset"], &[type="button"], &[type="radio"], &[type="checkbox"] {
-      width: auto;
-    }
-  }
-
   select, input[type="file"] {
     line-height: 28px;
   }
@@ -269,28 +254,6 @@ body {
     }
   }
 
-  .radio, .checkbox {
-    min-height: 18px;
-    padding-left: 18px;
-  }
-  .radio input[type="radio"], .checkbox input[type="checkbox"] {
-    float: left;
-    margin-left: -18px;
-  }
-  .controls > {
-    .radio:first-child, .checkbox:first-child {
-      padding-top: 5px;
-    }
-  }
-  .radio.inline, .checkbox.inline {
-    display: inline-block;
-    padding-top: 5px;
-    margin-bottom: 0;
-    vertical-align: middle;
-  }
-  .radio.inline .radio.inline, .checkbox.inline .checkbox.inline {
-    margin-left: 10px;
-  }
   .input-xxlarge {
     width: 530px;
   }

app/assets/stylesheets/mobile/discourse.scss

@@ -56,10 +56,6 @@ body {
   .control-group {
     margin-bottom: 9px;
   }
-  label {
-    display: block;
-    margin-bottom: 5px;
-  }
 }
 
 blockquote {

app/assets/stylesheets/mobile/modal.scss

@@ -55,12 +55,11 @@
 }
 
 .modal-header {
-  padding: 10px 0px;
+  padding: 10px 0px 10px 10px;
 
   h3 {
-    display: inline-block;
+    display: inline;
     font-size: 1.286em;
-    padding-left: 15px;
     margin: 0px;
   }
 }