Upgrade to middleman 4

Gemfile

 source 'https://rubygems.org'
 
 # Middleman
-gem 'middleman', '~>3.3.10'
+gem 'middleman', '~>4.0.0'
 gem 'middleman-gh-pages', '~> 0.0.3'
-gem 'middleman-syntax', '~> 2.0.0'
-gem 'middleman-autoprefixer', '~> 2.5.0'
-gem 'rouge', '~> 1.9.1'
+gem 'middleman-syntax', '~> 2.1.0'
+gem 'middleman-autoprefixer', '~> 2.7.0'
+gem "middleman-sprockets", "~> 4.0.0.rc"
+gem 'rouge', '~> 1.10.1'
 gem 'redcarpet', '~> 3.3.2'
 
 gem 'rake', '~> 10.4.2'

Gemfile.lock

 GEM
   remote: https://rubygems.org/
   specs:
-    activesupport (4.1.12)
-      i18n (~> 0.6, >= 0.6.9)
+    activesupport (4.2.5.1)
+      i18n (~> 0.7)
       json (~> 1.7, >= 1.7.7)
       minitest (~> 5.1)
-      thread_safe (~> 0.1)
+      thread_safe (~> 0.3, >= 0.3.4)
       tzinfo (~> 1.1)
-    autoprefixer-rails (5.2.1.1)
+    addressable (2.4.0)
+    autoprefixer-rails (6.3.1)
       execjs
       json
-    celluloid (0.16.0)
-      timers (~> 4.0.0)
-    chunky_png (1.3.4)
+    backports (3.6.7)
+    capybara (2.5.0)
+      mime-types (>= 1.16)
+      nokogiri (>= 1.3.3)
+      rack (>= 1.0.0)
+      rack-test (>= 0.5.4)
+      xpath (~> 2.0)
     coffee-script (2.4.1)
       coffee-script-source
       execjs
-    coffee-script-source (1.9.1.1)
-    compass (1.0.3)
-      chunky_png (~> 1.2)
-      compass-core (~> 1.0.2)
-      compass-import-once (~> 1.0.5)
-      rb-fsevent (>= 0.9.3)
-      rb-inotify (>= 0.9)
-      sass (>= 3.3.13, < 3.5)
-    compass-core (1.0.3)
-      multi_json (~> 1.0)
-      sass (>= 3.3.0, < 3.5)
+    coffee-script-source (1.10.0)
     compass-import-once (1.0.5)
       sass (>= 3.2, < 3.5)
+    concurrent-ruby (0.9.2)
+    contracts (0.12.0)
     erubis (2.7.0)
-    execjs (2.5.2)
+    execjs (2.6.0)
+    fastimage (1.8.1)
+      addressable (~> 2.3, >= 2.3.5)
     ffi (1.9.10)
-    haml (4.0.6)
+    haml (4.0.7)
       tilt
-    hike (1.2.3)
-    hitimes (1.2.2)
-    hooks (0.4.0)
-      uber (~> 0.0.4)
+    hamster (2.0.0)
+      concurrent-ruby (~> 0.8)
+    hashie (3.4.3)
     i18n (0.7.0)
     json (1.8.3)
-    kramdown (1.8.0)
-    listen (2.10.1)
-      celluloid (~> 0.16.0)
+    kramdown (1.9.0)
+    listen (3.0.5)
       rb-fsevent (>= 0.9.3)
       rb-inotify (>= 0.9)
-    middleman (3.3.12)
+    middleman (4.0.0)
       coffee-script (~> 2.2)
-      compass (>= 1.0.0, < 2.0.0)
       compass-import-once (= 1.0.5)
-      execjs (~> 2.0)
       haml (>= 4.0.5)
       kramdown (~> 1.2)
-      middleman-core (= 3.3.12)
-      middleman-sprockets (>= 3.1.2)
+      middleman-cli (= 4.0.0)
+      middleman-core (= 4.0.0)
       sass (>= 3.4.0, < 4.0)
-      uglifier (~> 2.5)
-    middleman-autoprefixer (2.5.0)
-      autoprefixer-rails (~> 5.2.0)
+    middleman-autoprefixer (2.7.0)
+      autoprefixer-rails (>= 6.3.1, < 7.0.0)
       middleman-core (>= 3.3.3)
-    middleman-core (3.3.12)
-      activesupport (~> 4.1.0)
+    middleman-cli (4.0.0)
+      thor (>= 0.17.0, < 2.0)
+    middleman-core (4.0.0)
+      activesupport (~> 4.2)
+      addressable (~> 2.4.0)
+      backports (~> 3.6)
       bundler (~> 1.1)
+      capybara (~> 2.5.0)
+      contracts (~> 0.12.0)
       erubis
-      hooks (~> 0.3)
+      execjs (~> 2.0)
+      fastimage (~> 1.8)
+      hamster (~> 2.0)
+      hashie (~> 3.4)
       i18n (~> 0.7.0)
-      listen (>= 2.7.9, < 3.0)
-      padrino-helpers (~> 0.12.3)
+      listen (~> 3.0)
+      padrino-helpers (~> 0.13.0)
       rack (>= 1.4.5, < 2.0)
-      rack-test (~> 0.6.2)
-      thor (>= 0.15.2, < 2.0)
-      tilt (~> 1.4.1, < 2.0)
+      sass (>= 3.4)
+      tilt (~> 1.4.1)
+      uglifier (~> 2.6)
     middleman-gh-pages (0.0.3)
       rake (> 0.9.3)
-    middleman-sprockets (3.4.2)
-      middleman-core (>= 3.3)
-      sprockets (~> 2.12.1)
-      sprockets-helpers (~> 1.1.0)
-      sprockets-sass (~> 1.3.0)
-    middleman-syntax (2.0.0)
-      middleman-core (~> 3.2)
+    middleman-sprockets (4.0.0.rc.1)
+      middleman-core (>= 4.0.0.rc.1)
+      sprockets (~> 3.0)
+    middleman-syntax (2.1.0)
+      middleman-core (>= 3.2)
       rouge (~> 1.0)
-    minitest (5.7.0)
-    multi_json (1.11.2)
-    padrino-helpers (0.12.5)
+    mime-types (3.0)
+      mime-types-data (~> 3.2015)
+    mime-types-data (3.2015.1120)
+    mini_portile2 (2.0.0)
+    minitest (5.8.4)
+    nokogiri (1.6.7.2)
+      mini_portile2 (~> 2.0.0.rc2)
+    padrino-helpers (0.13.1)
       i18n (~> 0.6, >= 0.6.7)
-      padrino-support (= 0.12.5)
+      padrino-support (= 0.13.1)
       tilt (~> 1.4.1)
-    padrino-support (0.12.5)
+    padrino-support (0.13.1)
       activesupport (>= 3.1)
     rack (1.6.4)
     rack-test (0.6.3)
       rack (>= 1.0)
     rake (10.4.2)
-    rb-fsevent (0.9.5)
+    rb-fsevent (0.9.7)
     rb-inotify (0.9.5)
       ffi (>= 0.5.0)
-    redcarpet (3.3.2)
-    rouge (1.9.1)
-    sass (3.4.16)
-    sprockets (2.12.4)
-      hike (~> 1.2)
-      multi_json (~> 1.0)
-      rack (~> 1.0)
-      tilt (~> 1.1, != 1.3.0)
-    sprockets-helpers (1.1.0)
-      sprockets (~> 2.0)
-    sprockets-sass (1.3.1)
-      sprockets (~> 2.0)
-      tilt (~> 1.1)
+    redcarpet (3.3.4)
+    rouge (1.10.1)
+    sass (3.4.21)
+    sprockets (3.4.1)
+      rack (> 1, < 3)
     thor (0.19.1)
     thread_safe (0.3.5)
     tilt (1.4.1)
-    timers (4.0.1)
-      hitimes
     tzinfo (1.2.2)
       thread_safe (~> 0.1)
-    uber (0.0.13)
-    uglifier (2.7.1)
+    uglifier (2.7.2)
       execjs (>= 0.3.0)
       json (>= 1.8.0)
+    xpath (2.0.0)
+      nokogiri (~> 1.3)
 
 PLATFORMS
   ruby
 
 DEPENDENCIES
-  middleman (~> 3.3.10)
-  middleman-autoprefixer (~> 2.5.0)
+  middleman (~> 4.0.0)
+  middleman-autoprefixer (~> 2.7.0)
   middleman-gh-pages (~> 0.0.3)
-  middleman-syntax (~> 2.0.0)
+  middleman-sprockets (~> 4.0.0.rc)
+  middleman-syntax (~> 2.1.0)
   rake (~> 10.4.2)
   redcarpet (~> 3.3.2)
-  rouge (~> 1.9.1)
+  rouge (~> 1.10.1)
 
 BUNDLED WITH
-   1.10.5
+   1.10.6

source/layouts/layout.erb

@@ -24,6 +24,9 @@ under the License.
 
     <%= stylesheet_link_tag :screen, media: :screen %>
     <%= stylesheet_link_tag :print, media: :print %>
+    <style>
+      <%= Rouge::Themes::Base16::Monokai.render(:scope => '.highlight') %>
+    </style>
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
     <% if current_page.data.search %>
       <%= javascript_include_tag  "all" %>

source/stylesheets/_syntax.scss.erb

-/*
-Copyright 2008-2013 Concur Technologies, Inc.
-
-Licensed under the Apache License, Version 2.0 (the "License"); you may
-not use this file except in compliance with the License. You may obtain
-a copy of the License at
-
-  http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
-WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
-License for the specific language governing permissions and limitations
-under the License.
-*/
-
-@import 'variables';
-
-<%= Rouge::Themes::Base16::Monokai.render(:scope => '.highlight') %>
-
-.highlight .c, .highlight .cm, .highlight .c1, .highlight .cs {
-  color: #909090;
-}
-
-.highlight, .highlight .w {
-  background-color: $code-bg;
-}
\ No newline at end of file

source/stylesheets/screen.css.scss

 @charset "utf-8";
 @import 'normalize';
-@import 'compass';
 @import 'variables';
-@import 'syntax';
 @import 'icon-font';
 
 /*
@@ -340,7 +338,7 @@ html, body {
     padding: 0 $main-padding;
     box-sizing: border-box;
     display: block;
-    @include text-shadow($main-embossed-text-shadow);
+    text-shadow: $main-embossed-text-shadow;
 
     @extend %left-col;
   }
@@ -471,7 +469,7 @@ html, body {
   aside {
     padding-top: 1em;
     padding-bottom: 1em;
-    @include text-shadow(0 1px 0 lighten($aside-notice-bg, 15%));
+    text-shadow: 0 1px 0 lighten($aside-notice-bg, 15%);
     margin-top: 1.5em;
     margin-bottom: 1.5em;
     background: $aside-notice-bg;
@@ -479,12 +477,12 @@ html, body {
 
     &.warning {
       background-color: $aside-warning-bg;
-      @include text-shadow(0 1px 0 lighten($aside-warning-bg, 15%));
+      text-shadow: 0 1px 0 lighten($aside-warning-bg, 15%);
     }
 
     &.success {
       background-color: $aside-success-bg;
-      @include text-shadow(0 1px 0 lighten($aside-success-bg, 15%));
+      text-shadow: 0 1px 0 lighten($aside-success-bg, 15%);
     }
   }
 
@@ -511,7 +509,7 @@ html, body {
     margin: -2px;
     border-radius: 4px;
     border: 1px solid #F7E633;
-    @include text-shadow(1px 1px 0 #666);
+    text-shadow: 1px 1px 0 #666;
     background: linear-gradient(to top left, #F7E633 0%, #F1D32F 100%);
   }
 }
@@ -534,7 +532,7 @@ html, body {
     clear:right;
 
     box-sizing: border-box;
-    @include text-shadow(0px 1px 2px rgba(0,0,0,0.4));
+    text-shadow: 0px 1px 2px rgba(0,0,0,0.4);
 
     @extend %right-col;
 
@@ -618,3 +616,11 @@ html, body {
     margin-top: $main-padding;
   }
 }
+
+.highlight .c, .highlight .cm, .highlight .c1, .highlight .cs {
+  color: #909090;
+}
+
+.highlight, .highlight .w {
+  background-color: $code-bg;
+}
\ No newline at end of file