Improved code pasting experience. Fixes #6

@@ -7,10 +7,6 @@ h1 {
   line-height: 1.22222222em;
   margin-top: 0.48888889em;
   margin-bottom: 0.48888889em;
-  //padding-bottom: 0.3333em;
-  //border-bottom: 1px solid #EAEAEA;
-  //margin-left: -$-xxl;
-  //margin-right: -$-xxl;
 }
 h2 {
   font-size: 2.8275em;
@@ -111,6 +107,13 @@ sup, .superscript {
 pre {
   font-family: monospace;
   white-space:pre;
+  font-size: 0.8em;
+  overflow: hidden;
+  border-radius: 4px;
+  box-shadow: 0 1px 2px 0px rgba(10, 10, 10, 0.06);
+  border: 1px solid rgba(221, 221, 221, 0.66);
+  background-color: #fdf6e3;
+  padding: 0.5em;
 }
 
 blockquote {

@@ -146,6 +146,7 @@ header {
   margin-top: $-xxl;
   margin-left: 0;
   max-width: 240px;
+  display: none;
 }
 
 .page-nav-list {

@@ -10,7 +10,11 @@
         </div>
     </div>
     <div class="edit-area">
-        @include('form/textarea', ['name' => 'html'])
+        <textarea id="html" name="html" rows="5"
+                  @if($errors->has('html')) class="neg" @endif>@if(isset($model) || old('html')){{htmlspecialchars( old('html') ? old('html') : $model->html)}}@endif</textarea>
+        @if($errors->has('html'))
+            <div class="text-neg text-small">{{ $errors->first('html') }}</div>
+        @endif
     </div>
     <div class="margin-top large">
         <a onclick="window.history.back();" class="button muted">Cancel</a>
@@ -37,8 +41,9 @@
             statusbar: false,
             menubar: false,
             height: 700,
-            plugins: "image table textcolor paste link imagetools fullscreen",
-            toolbar: "undo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | table image link | fullscreen",
+            extended_valid_elements: 'pre[*]',
+            plugins: "image table textcolor paste link imagetools fullscreen code",
+            toolbar: "code undo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | table image link | fullscreen",
             content_style: "body {padding-left: 15px !important; padding-right: 15px !important; margin:0!important; margin-left:auto!important;margin-right:auto!important;}",
             file_browser_callback: function(field_name, url, type, win) {
                 ImageManager.show(function(image) {

@@ -6,4 +6,15 @@
         @include('pages/page-display')
     </div>
 
+    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.7/styles/solarized_light.min.css">
+    <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.7/highlight.min.js"></script>
+    <script>
+        window.onload = function() {
+            var aCodes = document.getElementsByTagName('pre');
+            for (var i=0; i < aCodes.length; i++) {
+                hljs.highlightBlock(aCodes[i]);
+            }
+        };
+    </script>
+
 @stop

@@ -62,6 +62,7 @@
                         header.smoothScrollTo();
                     })
                 });
+                $('.side-nav').fadeIn();
             } else {
                 $('.side-nav').hide();
             }
@@ -93,4 +94,15 @@
             //$('[data-toggle="popover"]').popover()
         });
     </script>
+
+    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.7/styles/solarized_light.min.css">
+    <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.7/highlight.min.js"></script>
+    <script>
+        window.onload = function() {
+            var aCodes = document.getElementsByTagName('pre');
+            for (var i=0; i < aCodes.length; i++) {
+                hljs.highlightBlock(aCodes[i]);
+            }
+        };
+    </script>
 @stop