Cleaned up some derpy settings padding and widths

ghost/admin/app/styles/layouts/about.scss

@@ -23,16 +23,18 @@
     }
 }
 
+@media (min-width: 901px) {
+    .settings-content .settings-about {
+        padding: 25px 40px 0;
+    }
+}
+
 
 //
 // Logo & Version
 // --------------------------------------------------
 
 .about-ghost-intro {
-    @media (max-width: 550px) {
-        padding-top: 40px;
-    }
-
     h1 {
         margin-top: -6px;
         margin-bottom: -21px;

ghost/admin/app/styles/layouts/settings.scss

@@ -174,11 +174,7 @@
     }
 
     .content {
-        padding: 40px;
+        padding: 0 40px;
-
-        @media (max-width: 550px) {
-            padding-top: 15px;
-        }
 
         @media (max-width: 900px) {
             position: absolute;
@@ -186,12 +182,13 @@
             right: 0;
             bottom: 0;
             left: 0;
-            padding-left: 15px;
+            padding: 15px;
-            padding-right: 15px;
             overflow-x: hidden;
             overflow-y: auto;
             -webkit-overflow-scrolling: touch;
         }
+
+
     }//.content
 
     .word-count {
@@ -409,7 +406,7 @@
 
     // &.last-navigation-item {
     &:last-child {
-        padding-left: 27px; // simulate .navigation-item-drag-handle width + horizontal padding
+        padding-left: 17px; // simulate .navigation-item-drag-handle width + horizontal padding
 
         .navigation-item-drag-handle {
             display: none;
@@ -418,15 +415,15 @@
 }
 
 .navigation-item-drag-handle {
-    padding: 6px 17px 0 10px;
+    padding: 6px 17px 0 0;
-    width: 27px;
+    width: 17px;
     cursor: move;
 
     @media (max-width: 600px) {
         &:before {
             position: absolute;
             top: 50%;
-            left: 4px;
+            left: 0;
             margin-top: -9px;
             z-index: 20;
         }
@@ -517,6 +514,19 @@
 // Code Injection
 // --------------------------------------------------
 
+.settings-code {
+    .form-group {
+        max-width: 700px;
+
+        p {
+            margin: 0 0 4px 0;
+        }
+    }
+    code {
+        vertical-align: middle;
+    }
+}
+
 .settings-code-editor {
     width: 100%;
     min-width: 250px;

ghost/admin/app/templates/settings/code-injection.hbs

@@ -9,21 +9,19 @@
 <section class="content settings-code">
     <form id="settings-code" novalidate="novalidate">
         <fieldset>
-            <div class="form-group">
             <p>
-                    Ghost allows you to inject code into the top and bottom of your template files without editing them. This allows for quick modifications to insert useful things like tracking codes and meta data.
+                Ghost allows you to inject code into the top and bottom of your theme files without editing them. This allows for quick modifications to insert useful things like tracking codes and meta tags.
             </p>
-            </div>
 
             <div class="form-group">
                 <label for="ghost-head">Blog Header</label>
-                <p>Code here will be injected to the \{{ghost_head}} helper at the top of your page</p>
+                <p>Code here will be injected into the <code>\{{ghost_head}}</code> tag on every page of your blog</p>
                 {{gh-cm-editor id="ghost-head" name="codeInjection[ghost_head]" class="settings-code-editor" type="text" value=model.ghost_head}}
             </div>
 
             <div class="form-group">
                 <label for="ghost-foot">Blog Footer</label>
-                <p>Code here will be injected to the \{{ghost_foot}} helper at the bottom of your page</p>
+                <p>Code here will be injected into the <code>\{{ghost_foot}}</code> tag on every page of your blog</p>
                 {{gh-cm-editor id="ghost-foot" name="codeInjection[ghost_foot]" class="settings-code-editor" type="text" value=model.ghost_foot}}
             </div>
         </fieldset>