Improve readability of the theme, fixes #363

.gitignore

@@ -4,4 +4,4 @@ node_modules
 /sftp-config.json
 static
 
-vendor
+/vendor

docs/01_Features/Live_mode.md

@@ -2,7 +2,7 @@ Keep in mind, this mode can be used for production, but it is not recommended.
 
 The whole directory must be scanned on each request. This might not make a big impact on small documentations but can be a bottleneck on bigger ones.
 
-### Running Locally
+## Running Locally
 
 There are several ways to run the docs locally. You can use something like <a href="http://www.mamp.info/en/index.html" target="_blank">MAMP</a> or <a href="http://www.wampserver.com/en/" target="_blank">WAMP</a>.
 
@@ -11,9 +11,9 @@ The easiest is to use PHP 5.4's built-in server.
 For that i've included a short command, run `./serve` in the projects folder to start the local web server. By default the server will run at: <a href="http://localhost:8085" target="_blank">http://localhost:8085</a>
 
 
-### Running Remotely
+## Running Remotely
 
-#### Clean URLs configuration
+### Clean URLs configuration
 
 Daux provides native support for Clean URLs provided the webserver has its URL Rewrite module enabled.
 To enable the same, set the toggle in the `config.json` file in the `/docs` folder.
@@ -26,13 +26,13 @@ To enable the same, set the toggle in the `config.json` file in the `/docs` fold
 }
 ```
 
-#### Apache
+### Apache
 
 Copy the files from the repo to a web server that can run PHP 5.3 or greater.
 
 There is an included `.htaccess` for Apache web server.
 
-#### Nginx
+### Nginx
 
 Daux.io works perfectly fine on Nginx too, just drop this configuration in your `nginx.conf`
 
@@ -66,14 +66,14 @@ server {
 }
 ```
 
-### IIS
+## IIS
 
 If you have set up a local or remote IIS web site, you may need a `web.config` with:
 
 * A rewrite configuration, for handling clean urls.
 * A mime type handler for less files, if using a custom theme.
 
-#### Clean URLs
+### Clean URLs
 
 The `web.config` needs an entry for `<rewrite>` under `<system.webServer>`:
 

docs/05_Configuration/Confluence_upload.md

@@ -4,7 +4,7 @@ The connection requires three parameters `base_url`, `user` and `pass`. While `u
 ```json
 {
     "confluence": {
-		"base_url": "http://my_confluence_server.com/,
+        "base_url": "http://my_confluence_server.com/",
         "user" : "my_username",
         "pass" : "my_password",
     }
@@ -79,7 +79,9 @@ You can add a text in a "information" macro on top of the document by setting th
 
 ```json
 {
-	"confluence": { "header": "These pages are updated automatically, your changes will be overriden." }
+    "confluence": {
+        "header": "These pages are updated automatically, your changes will be overriden."
+    }
 }
 ```
 

docs/10_For_Developers/Creating_a_Processor.md

@@ -15,11 +15,11 @@ By default, we created a `daux/Processor.php` file to get you started.
 For the example we're just going to dump the tree and exit.
 
 ```php
-    public function manipulateTree(Root $root)
-    {
+public function manipulateTree(Root $root)
+{
     print_r($root->dump());
     exit;
-    }
+}
 ```
 
 also, add this at the beginning of the file:
@@ -43,21 +43,21 @@ By default, Daux.io parses your directory to find pages. but, for a reason or an
 This can be done with: 
 
 ```php
-    public function manipulateTree(Root $root)
-    {
-    }
+public function manipulateTree(Root $root)
+{
+}
 ```
 
 Two helpers from the class `Todaymade\Daux\Tree\Builder` will greatly help you doing that:
 
 ```php
-    $new = Builder::getOrCreateDir($root, 'New Pages');
+$new = Builder::getOrCreateDir($root, 'New Pages');
 
-    $page = Builder::getOrCreatePage($new, 'index');
-    $page->setContent('The index page for the new folder');
+$page = Builder::getOrCreatePage($new, 'index');
+$page->setContent('The index page for the new folder');
 
-    $page = Builder::getOrCreatePage($new, 'A New Hope');
-    $page->setContent('A long time ago in a galaxy far away');
+$page = Builder::getOrCreatePage($new, 'A New Hope');
+$page->setContent('A long time ago in a galaxy far away');
 ```
 
 Both methods `getOrCreateDir` and `getOrCreatePage` take two parameters : `parent` and `title`
@@ -73,9 +73,9 @@ If the extension is not mapped to a Generator, it will simply create the file as
 You can extend the Markdown Parser in any way wou want with this method.
 
 ```php
-    public function extendCommonMarkEnvironment(Environment $environment)
-    {
-    }
+public function extendCommonMarkEnvironment(Environment $environment)
+{
+}
 ```
 
 See the details on [CommonMark's website](http://commonmark.thephpleague.com/customization/overview/).
@@ -87,9 +87,9 @@ You can add new generators to Daux.io and use them right away, they must impleme
 you have to implement `\Todaymade\Daux\Format\Base\LiveGenerator`. 
 
 ```php
-    public function addGenerators()
-    {
+public function addGenerators()
+{
     return ['custom_generator' => '\Todaymade\Daux\Extension\MyNewGenerator'];
-    }
+}
 ```
 

gulpfile.js

@@ -4,7 +4,8 @@ var gulp = require('gulp'),
     less = require('gulp-less'),
     rename = require('gulp-rename'),
     plumber = require('gulp-plumber'),
-    postcss = require('gulp-postcss');
+    postcss = require('gulp-postcss'),
+    sourcemaps = require('gulp-sourcemaps');
 
 var resources = {
     daux:{source: "themes/daux/less/theme.less", dest: "themes/daux/css/"},
@@ -140,6 +141,7 @@ function createTask(source, dest) {
         };
 
         return gulp.src(source)
+            //.pipe(sourcemaps.init())
             .pipe(plumber())
             .pipe(less())
             .pipe(postcss([
@@ -147,11 +149,45 @@ function createTask(source, dest) {
                 require('cssnano')(nano_options)
             ]))
             .pipe(rename({suffix: '.min'}))
+            //.pipe(sourcemaps.write())
             .pipe(gulp.dest(dest));
     }
 }
 
 
+function createLinter() {
+    var gulpStylelint = require('gulp-stylelint');
+
+    var rules = {
+        "indentation": 4,
+        "selector-list-comma-newline-after": "always-multi-line",
+        "selector-no-id": true,
+
+        // Autoprefixer
+        "at-rule-no-vendor-prefix": true,
+        "media-feature-name-no-vendor-prefix": true,
+        "property-no-vendor-prefix": true,
+        "selector-no-vendor-prefix": true,
+        "value-no-vendor-prefix": true
+    };
+
+    return gulp
+        .src(['themes/**/less/**/*.less', '!themes/**/vendor/**/*.less'])
+        .pipe(gulpStylelint({
+            failAfterError: true,
+            config: {
+                extends: "stylelint-config-standard",
+                rules: rules
+            },
+            syntax: "less",
+            reporters: [
+                {formatter: 'string', console: true}
+            ],
+            debug: true
+        }));
+}
+
+
 
 var style_tasks = [];
 for (var style in resources) {
@@ -159,13 +195,16 @@ for (var style in resources) {
     style_tasks.push('style_' + style);
 }
 
+gulp.task('lint-css', createLinter);
+style_tasks.push('lint-css');
+
 gulp.task("styles", style_tasks);
 
 
 gulp.task('watch', function() {
 
     // Watch .less files
-    gulp.watch('themes/daux/less/**/*.less', ['styles']);
+    gulp.watch('themes/**/less/**/*.less', ['styles']);
 
 });
 

package.json

@@ -3,14 +3,17 @@
   "version": "0.1.1",
   "private": true,
   "devDependencies": {
+    "cssnano": "^3.5.2",
     "grunt": "^0.4.1",
     "grunt-php": "^1.0.0",
-        "cssnano": "^3.5.2",
     "gulp": "^3.9.1",
     "gulp-connect-php": "^0.0.7",
     "gulp-less": "^3.0.3",
     "gulp-plumber": "^1.1.0",
     "gulp-postcss": "^6.1.0",
-        "gulp-rename": "^1.2.2"
+    "gulp-rename": "^1.2.2",
+    "gulp-sourcemaps": "^2.0.0-alpha",
+    "gulp-stylelint": "^2.0.2",
+    "stylelint-config-standard": "^6.0.0"
   }
 }

templates/home.php

@@ -5,7 +5,7 @@
     </div>
 </div>
 <?php if ($params['html']['repo']) { ?>
-    <a href="https://github.com/<?= $params['html']['repo']; ?>" target="_blank" id="github-ribbon" class="hidden-print"><img src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub"></a>
+    <a href="https://github.com/<?= $params['html']['repo']; ?>" target="_blank" id="github-ribbon" class="github-ribbon hidden-print"><img src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub"></a>
 <?php } ?>
 
 <div class="homepage-hero container-fluid">

templates/layout/05_page.php

@@ -1,7 +1,7 @@
 <?php $this->layout('theme::layout/00_layout') ?>
 
 <?php if ($params['html']['repo']) { ?>
-    <a href="https://github.com/<?= $params['html']['repo']; ?>" target="_blank" id="github-ribbon" class="hidden-print"><img src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub"></a>
+    <a href="https://github.com/<?= $params['html']['repo']; ?>" target="_blank" id="github-ribbon" class="github-ribbon hidden-print"><img src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub"></a>
 <?php } ?>
 <div class="container-fluid fluid-height wrapper">
     <div class="navbar navbar-static-top hidden-print">

themes/common/less/_typography.less

@@ -0,0 +1,187 @@
+body {
+    font-size: 15px;
+}
+
+h1, h2, h3, h4, h5, h6 {
+    font-weight: 300;
+    -webkit-font-smoothing: antialiased;
+    cursor: text;
+
+    line-height: 1.4em;
+    padding-top: 0.4em;
+    margin-top: 0;
+    margin-bottom: 0.3em;
+
+    tt, code {
+        font-size: inherit;
+    }
+
+    i {
+        font-size: 0.7em;
+    }
+
+    p {
+        margin-top: 0;
+    }
+}
+
+h1 { // 40px
+    font-size: 2.6666666667em;
+    color: black;
+}
+
+h2 { // 30px
+    font-size: 2em;
+    border-bottom: 1px solid #eee;
+    color: black;
+}
+
+h3 { // 26px
+    font-size: 1.7333333333em;
+}
+
+h4 { // 22px
+    font-size: 1.4666666667em;
+}
+
+h5 { // 18px
+    font-size: 1.2em;
+}
+
+h6 { // 16px
+    font-size: 1.0666666667em;
+    color: #555;
+}
+
+a {
+    text-decoration: underline;
+}
+
+p { // 15px
+    line-height: 1.8em;
+    margin-bottom: 20px;
+}
+
+ul, ol {
+    padding-left: 30px;
+}
+
+ul p {
+    margin: 0;
+}
+
+ul ul {
+    margin: 0;
+}
+
+dl {
+    padding: 0;
+
+    dt {
+        font-weight: bold;
+        font-style: italic;
+        padding: 0;
+        margin: 15px 0 5px;
+
+        &:first-child {
+            padding: 0;
+        }
+    }
+
+    dd {
+        margin: 0 0 15px;
+        padding: 0 15px;
+    }
+}
+
+blockquote {
+    font-size: 1.2em;
+    border-left: 4px solid #ddd;
+    padding: 7px 15px;
+    color: #666;
+
+    p {
+        font-size: inherit;
+    }
+}
+
+table {
+    width: 100%;
+    padding: 0;
+
+    tr {
+        border-top: 1px solid #eee;
+        background-color: white;
+        margin: 0;
+        padding: 0;
+
+        &:nth-child(2n) {
+            background-color: #f8f8f8;
+        }
+    }
+
+    th {
+        font-weight: bold;
+        border: 1px solid #eee;
+        background: #eee;
+        margin: 0;
+        padding: 6px 13px;
+    }
+
+    td {
+        border: 1px solid #eee;
+        margin: 0;
+        padding: 6px 13px;
+    }
+}
+
+ul,
+ol,
+blockquote,
+dl dt,
+dl dd,
+table th,
+table td {
+    > :first-child {
+        margin-top: 0;
+    }
+
+    > :last-child {
+        margin-bottom: 0;
+    }
+}
+
+img {
+    max-width: 100%;
+    display: block;
+    margin: 0 auto;
+}
+
+code, tt {
+    margin: 0 2px;
+    padding: 0 5px;
+    white-space: nowrap;
+    border: 1px solid #eaeaea;
+    background-color: #f8f8f8;
+    border-radius: 3px;
+}
+
+pre {
+    background: #222;
+    color: #fff;
+    line-height: 1.5em;
+    overflow: auto;
+    padding: 20px;
+    margin: 0 -20px 20px -20px;
+
+    code {
+        margin: 0;
+        padding: 0;
+        white-space: pre;
+    }
+
+    code, tt {
+        background-color: transparent;
+        border: none;
+    }
+}

themes/daux/less/_components.less

@@ -1,9 +1,6 @@
 /* ===========================================================================================
-Componenets
+Components
 ============================================================================================== */
-a {
-    color: @light;
-}
 
 .btn {
     display: inline-block;
@@ -37,15 +34,11 @@ a {
     }
 }
 
-code {
-    color: @light;
-}
-
 //Navbar
 .navbar {
-    box-shadow: 0 1px 5px rgba(0,0,0,.25);
+    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
     background-color: @dark;
-    margin-bottom: 0px;
+    margin-bottom: 0;
 
     .container, .container-fluid {
         .kill-background-image;
@@ -94,25 +87,22 @@ code {
             .arrow {
                 display: inline-block;
                 position: relative;
-
                 width: 16px;
                 margin-left: -16px;
 
-                &:before {
-                    position:absolute;
-
-                    display:block;
-                    content:"";
-
-                    margin:-.25em 0 0 -.4em;
-                    left:50%;
+                &::before {
+                    position: absolute;
+                    display: block;
+                    content: "";
+                    margin: -0.25em 0 0 -0.4em;
+                    left: 50%;
                     top: 50%;
                     width: 0.5em;
                     height: 0.5em;
                     border-right: 0.15em solid @dark;
                     border-top: 0.15em solid @dark;
                     transform: rotate(45deg);
-                    transition-duration:.3s;
+                    transition-duration: 0.3s;
                 }
             }
 
@@ -136,11 +126,11 @@ code {
 
             > a {
                 &, &:focus, &:hover {
-                    background-color:transparent;
+                    background-color: transparent;
                 }
 
-                > .arrow:before {
-                    margin-left:-.25em;
+                > .arrow::before {
+                    margin-left: -0.25em;
                     transform: rotate(135deg);
                 }
             }
@@ -153,7 +143,7 @@ code {
             li {
                 a {
                     .sans-serif(normal, 14px);
-                    margin: 0px;
+                    margin: 0;
                     margin-left: -15px;
                     padding: 3px 30px;
                     border: none;
@@ -175,155 +165,16 @@ code {
 }
 
 .page-header {
-    margin: 10px 0px;
-    padding: 0px;
+    margin: 10px 0;
+    padding: 0;
 
     h1 {
-        margin-top: 0px;
-    }
-
-    sub-heading {
-        padding: 0px, 0px, 20px;
-    }
-}
-
-pre {
-    border: none;
-    background-color: @light;
-    border-radius: 0;
-    padding: 10px;
-    margin-left: -20px;
-    padding-left: 30px;
-    margin-right: -20px;
-    padding-right: 30px;
-
-    code {
-        background: transparent;
-        border: none;
-    }
-}
-
-//Content pages float view
-.float-view {
-    @media (min-width: 1150px) {
-        .content-page {
-            height: 100%;
-            overflow: auto;
-            padding: 0px !important;
-            background-color: transparent !important;
-            position: relative;
-
-            article {
-                width: 100%;
-                min-height: 100%;
-                overflow: auto;
-                position: relative;
-                z-index: 1;
-
-                &:before {
-                    content: "";
-                    width: 50%;
-                    min-height: 100%;
-                    overflow: auto;
-                    background-color: white;
-                    display: block;
-                    margin: 0px;
-                    position: absolute;
-                    z-index: -1;
-                }
-            }
-
-            table {
-                float: left;
-                clear: left;
-                width: 47%;
-                margin-left: 1.5%;
-                margin-right: 1.5%;
-                background-color: white;
-                white-space: normal;
-
-                pre, code {
-                    white-space: normal;
-                }
-            }
-
-            .page-header {
+        margin: 0;
         padding: 0;
     }
 
-            .page-header, blockquote,
-            p, ul, ol, dl, h2, h3, h4, h5, h6, hr {
-                float: left;
-                clear: left;
-                width: 47%;
-                margin-left: 1.5%;
-                margin-right: 1.5%;
-                background-color: white;
-
-                &:before {
-                    width: 100%;
-                    height: 10px;
-                    display: block;
-                    clear: both;
-                    //border-top: 1px solid @dark;
-                }
-
-                p, ul, ol, dl, h2, h3, h4, h5, h6, pre, hr {
-                    float: none;
-                    display: block;
-                }
-            }
-
-            hr {
-                border-color: #ddd;
-            }
-
-            // Paragraphs and code inside lists and
-            // blockquotes should have 100% width
-            li, blockquote {
-                p, pre {
-                    width:100%;
-                }
-            }
-
-            ul, ol {
-                li {
-                    margin-left: 30px;
-                }
-            }
-
-            pre {
-                float: left;
-                clear: right;
-                width: 47%;
-                border: none;
-                border-left: 10px solid white;
-                margin: 0 0 10px 0;
-                padding: 0 0 0 10px;
-            }
-        }
-    }
-}
-
-//Tables
-table {
-    width: 100%;
-    border-bottom: 1px solid @lines;
-    margin-bottom: 10px;
-
-    tr {
-        th, td {
-            padding: 8px;
-            line-height: 20px;
-            vertical-align: top;
-            border-top: 1px solid @lines;
-            border-left: 1px solid @lines;
-            border-color: @lines !important;
-
-            &:last-child {
-                border-right: 1px solid @lines;
-            }
-        }
+    a {
+        text-decoration: none;
     }
 }
 
@@ -335,8 +186,7 @@ table {
     padding: 15px;
 }
 
-//github ribbon
-#github-ribbon {
+.github-ribbon {
     position: absolute;
     top: 50px;
     right: 0;
@@ -344,7 +194,7 @@ table {
 }
 
 .sidebar-links {
-    padding:20px;
+    padding: 20px;
 
     a {
         font-size: 13px;
@@ -377,18 +227,16 @@ table {
 }
 
 .TableOfContents {
-
-    font-size:16px;
-    padding-left:30px;
-
-    border-left:6px solid #efefef;
+    font-size: 16px;
+    padding-left: 30px;
+    border-left: 6px solid #efefef;
 
     p {
-        margin-bottom:0;
+        margin-bottom: 0;
     }
 
     .TableOfContents {
-        border-left-width:0;
-        padding-left:20px;
+        border-left-width: 0;
+        padding-left: 20px;
     }
 }

themes/daux/less/_structure.less

@@ -1,43 +1,3 @@
-/* ===========================================================================================
-Base CSS
-============================================================================================== */
-
-//Fonts
-.roboto-slab {
-    &.light {
-        font-family: 'Roboto Slab', @font-family-sans-serif;
-        font-weight: 100;
-    }
-
-    &.book {
-        font-family: 'Roboto Slab', @font-family-sans-serif;
-        font-weight: 300;
-    }
-
-    &.regular {
-        font-family: 'Roboto Slab', @font-family-sans-serif;
-        font-weight: 400;
-    }
-
-    &.bold {
-        font-family: 'Roboto Slab', @font-family-sans-serif;
-        font-weight: 700;
-    }
-}
-
-//Typography
-h1, h2, h3, h4, h5, h6 {
-    .roboto-slab.book;
-}
-
-h1 i {
-    font-size:26px;
-}
-
-pre {
-    padding: 0;
-}
-
 /* ===========================================================================================
 Homepage
 ============================================================================================== */
@@ -46,7 +6,7 @@ Homepage
     padding-top: 60px !important;
     background-color: @light;
     .kill-box-shadow;
-    border-radius: 0px;
+    border-radius: 0;
     border: none;
     color: @dark;
     overflow: hidden;
@@ -55,16 +15,16 @@ Homepage
 
     .text-center {
         .roboto-slab.bold;
-        margin: 10px 0px;
+        margin: 10px 0;
     }
 
     h2 {
-        margin: 20px 0px;
+        margin: 20px 0;
     }
 }
 
 .hero-buttons.container-fluid {
-    padding: 20px 0px;
+    padding: 20px 0;
     background-color: @sidebar-hover;
 
     .btn-hero.btn {
@@ -72,16 +32,17 @@ Homepage
         padding: 20px 30px;
         .kill-background-image;
         .kill-box-shadow;
-        border-radius: 0px;
+        border-radius: 0;
         text-shadow: none;
         border: none;
         .opacity(0.80);
-        margin: 0px 10px;
+        margin: 0 10px;
         text-transform: uppercase;
         border: 5px solid @dark;
 
         @media (max-width: 768px) {
-            display: block; margin-bottom: 10px;
+            display: block;
+            margin-bottom: 10px;
         }
 
         &:hover {
@@ -104,24 +65,24 @@ Homepage
     // color: white;
     // background-color: @text;
     background-color: white;
-    padding: 40px 0px;
+    padding: 40px 0;
 
     .lead {
         .roboto-slab.regular;
     }
 
     ul, ol {
-        padding: 20px 0px;
-        margin: 0 0 10px 0px;
+        padding: 20px 0;
+        margin: 0 0 10px 0;
 
         li {
             list-style: none;
             padding-bottom: 5px;
 
-            &:before {
+            &::before {
                 content: '';
-                width: 0px;
-                height: 0px;
+                width: 0;
+                height: 0;
                 border: 3px solid transparent;
                 border-left: 3px solid @light;
                 float: left;
@@ -139,7 +100,7 @@ Homepage
 .homepage-footer.container-fluid {
     background-color: @dark;
     .kill-box-shadow;
-    border-radius: 0px;
+    border-radius: 0;
     color: light;
     border: none;
 
@@ -149,7 +110,7 @@ Homepage
 
     .footer-nav {
         &:extend(.list-unstyled all);
-        margin: 40px 0px;
+        margin: 40px 0;
 
         li {
             a {
@@ -186,20 +147,20 @@ html, body {
 
 .columns {
     .left-column {
-        background-color:@sidebar-background;
+        background-color: @sidebar-background;
     }
 
     .right-column {
         .content-page {
             padding: 10px;
-            background-color:#fff;
+            background-color: #fff;
         }
     }
 }
 
 .container-fluid .navbar-static-top {
-    margin-left:-15px;
-    margin-right:-15px;
+    margin-left: -15px;
+    margin-right: -15px;
 }
 
 //mobile friendly sub-nav
@@ -216,20 +177,20 @@ html, body {
 
 .content-area,
 .article-tree {
-    padding: 0px;
+    padding: 0;
 }
 
 @media screen and (min-width: 768px) {
 
     body {
         //Needed only for floating code blocks
-        background-color:@light;
+        background-color: @light;
     }
 
     .navbar-static-top {
-        position:fixed;
+        position: fixed;
         z-index: @zindex-navbar-fixed;
-        width:100%;
+        width: 100%;
     }
 
     .responsive-collapse {
@@ -240,105 +201,44 @@ html, body {
         display: block !important;
     }
 
-    //100% Height Columns
+    // 100% Height Columns
     .container-fluid {
 
         &.fluid-height {
-            height:100%;
+            height: 100%;
         }
     }
 
     .content-area,
     .article-tree {
         overflow: auto;
-
         height: 100%;
     }
 
     .columns {
-        height:100%;
-        padding-top:@navbar-height;
+        height: 100%;
+        padding-top: @navbar-height;
 
         .left-column {
-            border-right:1px solid @lines;
-            overflow-x:hidden;
+            border-right: 1px solid @lines;
+            overflow-x: hidden;
         }
 
         .right-column {
             .content-page {
-                padding:20px;
-                min-height:100%;
+                padding: 20px;
+                min-height: 100%;
             }
         }
     }
 }
 
-//CSS For Fluid Tables
-@media only screen and (max-width: 800px) {
-
-    /* Force table to not be like tables anymore */
-    table,
-    thead,
-    tbody,
-    th,
-    td,
-    tr {
-        display: block;
-        border: none;
-    }
-
-        /* Hide table headers (but not display: none;, for accessibility) */
-        thead tr {
-            position: absolute;
-            top: -9999px;
-            left: -9999px;
-        }
-
-    tr {
-        margin-bottom: 10px;
-        border-bottom: 2px solid #ccc;
-
-        td, th {
-            border: 1px solid #ccc;
-            border-bottom: none;
-        }
-    }
-
-    td {
-        /* Behave  like a "row" */
-        border: none;
-        border-bottom: 1px solid #eee;
-        position: relative;
-        padding-left: 50% !important;
-        white-space: normal;
-        text-align: left;
-    }
-
-        td:before {
-            /* Now like a table header */
-            position: absolute;
-            /* Top/left values mimic padding */
-            top: 6px;
-            left: 6px;
-            width: 45%;
-            padding-right: 10px;
-            white-space: nowrap;
-            text-align: left;
-            font-weight: bold;
-        }
-
-        /* Label the data */
-        td:before {
-            content: attr(data-title);
-        }
-}
-
 @media print {
     .content-area {
-        width:100% !important;
+        width: 100% !important;
     }
 
-    h1 a[href]:after {
-        font-size:50%;
+    h1 a[href]::after {
+        font-size: 50%;
     }
 }

themes/daux/less/_typography.less

@@ -0,0 +1,161 @@
+/* ===========================================================================================
+Base CSS
+============================================================================================== */
+
+//Fonts
+.roboto-slab {
+    &.light {
+        font-family: 'Roboto Slab', @font-family-sans-serif;
+        font-weight: 100;
+    }
+
+    &.book {
+        font-family: 'Roboto Slab', @font-family-sans-serif;
+        font-weight: 300;
+    }
+
+    &.regular {
+        font-family: 'Roboto Slab', @font-family-sans-serif;
+        font-weight: 400;
+    }
+
+    &.bold {
+        font-family: 'Roboto Slab', @font-family-sans-serif;
+        font-weight: 700;
+    }
+}
+
+body {
+    text-rendering: optimizeLegibility;
+    font-smoothing: antialiased;
+
+    font-size: 14px;
+    line-height: 1.5;
+}
+
+h1, h2, h3, h4, h5, h6 {
+    .roboto-slab.book;
+}
+
+a {
+    color: @light;
+}
+
+code {
+    color: @dark;
+}
+
+.content-page {
+    @import "../../common/less/_typography.less";
+
+    pre {
+        border: none;
+        border-radius: 0;
+        padding: 10px 30px;
+        margin-left: -20px;
+        margin-right: -20px;
+    }
+}
+
+//Content pages float view
+.float-view {
+    @media (min-width: 1150px) {
+        .content-page {
+            height: 100%;
+            overflow: auto;
+            padding: 0 !important;
+            background-color: transparent !important;
+            position: relative;
+
+            article {
+                width: 100%;
+                min-height: 100%;
+                overflow: auto;
+                position: relative;
+                z-index: 1;
+
+                &::before {
+                    content: "";
+                    width: 50%;
+                    min-height: 100%;
+                    overflow: auto;
+                    background-color: white;
+                    display: block;
+                    margin: 0;
+                    position: absolute;
+                    z-index: -1;
+                }
+            }
+
+            table {
+                float: left;
+                clear: left;
+                width: 47%;
+                margin-left: 1.5%;
+                margin-right: 1.5%;
+                background-color: white;
+                white-space: normal;
+
+                pre, code {
+                    white-space: normal;
+                }
+            }
+
+            .page-header {
+                padding: 0;
+            }
+
+            .page-header, blockquote, p, ul, ol, dl, h2, h3, h4, h5, h6, hr {
+                float: left;
+                clear: left;
+                width: 47%;
+                margin-left: 1.5%;
+                margin-right: 1.5%;
+
+                &::before {
+                    width: 100%;
+                    height: 10px;
+                    display: block;
+                    clear: both;
+                }
+
+                p, ul, ol, dl, h2, h3, h4, h5, h6, pre, hr {
+                    float: none;
+                    display: block;
+                }
+            }
+
+            hr {
+                border-color: #ddd;
+            }
+
+            // Paragraphs and code inside lists and
+            // blockquotes should have 100% width
+            li, blockquote {
+                p, pre {
+                    width: 100%;
+                }
+            }
+
+            ul, ol {
+                li {
+                    margin-left: 30px;
+                }
+            }
+
+            pre {
+                float: left;
+                clear: right;
+                width: 50%;
+                border: none;
+                border-left: 10px solid white;
+                margin: 0 0 10px 0;
+                padding: 0;
+
+                code {
+                    padding: 0 0.5em;
+                }
+            }
+        }
+    }
+}

themes/daux/less/highlight.less

@@ -1,135 +0,0 @@
-/* ===========================================================================================
-Code Highlighting
-============================================================================================== */
-
-@hljs-css-prefix: hljs;
-
-.@{hljs-css-prefix} {
-    display: block;
-    padding: 0.5em;
-}
-
-.@{hljs-css-prefix},
-.@{hljs-css-prefix}-subst,
-.@{hljs-css-prefix}-tag .@{hljs-css-prefix}-title,
-.@{hljs-css-prefix}-lisp .@{hljs-css-prefix}-title,
-.@{hljs-css-prefix}-clojure .@{hljs-css-prefix}-built_in,
-.@{hljs-css-prefix}-nginx .@{hljs-css-prefix}-title {
-    color: @dark;
-}
-
-.@{hljs-css-prefix}-string,
-.@{hljs-css-prefix}-title,
-.@{hljs-css-prefix}-constant,
-.@{hljs-css-prefix}-parent,
-.@{hljs-css-prefix}-tag .@{hljs-css-prefix}-value,
-.@{hljs-css-prefix}-rules .@{hljs-css-prefix}-value,
-.@{hljs-css-prefix}-rules .@{hljs-css-prefix}-value .@{hljs-css-prefix}-number,
-.@{hljs-css-prefix}-preprocessor,
-.@{hljs-css-prefix}-ruby .@{hljs-css-prefix}-symbol,
-.@{hljs-css-prefix}-ruby .@{hljs-css-prefix}-symbol .@{hljs-css-prefix}-string,
-.@{hljs-css-prefix}-aggregate,
-.@{hljs-css-prefix}-template_tag,
-.@{hljs-css-prefix}-django .@{hljs-css-prefix}-variable,
-.@{hljs-css-prefix}-smalltalk .@{hljs-css-prefix}-class,
-.@{hljs-css-prefix}-addition,
-.@{hljs-css-prefix}-flow,
-.@{hljs-css-prefix}-stream,
-.@{hljs-css-prefix}-bash .@{hljs-css-prefix}-variable,
-.@{hljs-css-prefix}-apache .@{hljs-css-prefix}-tag,
-.@{hljs-css-prefix}-apache .@{hljs-css-prefix}-cbracket,
-.@{hljs-css-prefix}-tex .@{hljs-css-prefix}-command,
-.@{hljs-css-prefix}-tex .@{hljs-css-prefix}-special,
-.@{hljs-css-prefix}-erlang_repl .@{hljs-css-prefix}-function_or_atom,
-.@{hljs-css-prefix}-markdown .@{hljs-css-prefix}-header {
-    color: @syntax-string;
-}
-
-.@{hljs-css-prefix}-comment,
-.@{hljs-css-prefix}-annotation,
-.@{hljs-css-prefix}-template_comment,
-.@{hljs-css-prefix}-diff .@{hljs-css-prefix}-header,
-.@{hljs-css-prefix}-chunk,
-.@{hljs-css-prefix}-markdown .@{hljs-css-prefix}-blockquote {
-    color: @syntax-comment;
-}
-
-.@{hljs-css-prefix}-number,
-.@{hljs-css-prefix}-date,
-.@{hljs-css-prefix}-regexp,
-.@{hljs-css-prefix}-literal,
-.@{hljs-css-prefix}-smalltalk .@{hljs-css-prefix}-symbol,
-.@{hljs-css-prefix}-smalltalk .@{hljs-css-prefix}-char,
-.@{hljs-css-prefix}-go .@{hljs-css-prefix}-constant,
-.@{hljs-css-prefix}-change,
-.@{hljs-css-prefix}-markdown .@{hljs-css-prefix}-bullet,
-.@{hljs-css-prefix}-markdown .@{hljs-css-prefix}-link_url {
-    color: @syntax-number;
-}
-
-.@{hljs-css-prefix}-label,
-.@{hljs-css-prefix}-javadoc,
-.@{hljs-css-prefix}-ruby .@{hljs-css-prefix}-string,
-.@{hljs-css-prefix}-decorator,
-.@{hljs-css-prefix}-filter .@{hljs-css-prefix}-argument,
-.@{hljs-css-prefix}-localvars,
-.@{hljs-css-prefix}-array,
-.@{hljs-css-prefix}-attr_selector,
-.@{hljs-css-prefix}-important,
-.@{hljs-css-prefix}-pseudo,
-.@{hljs-css-prefix}-pi,
-.@{hljs-css-prefix}-doctype,
-.@{hljs-css-prefix}-deletion,
-.@{hljs-css-prefix}-envvar,
-.@{hljs-css-prefix}-shebang,
-.@{hljs-css-prefix}-apache .@{hljs-css-prefix}-sqbracket,
-.@{hljs-css-prefix}-nginx .@{hljs-css-prefix}-built_in,
-.@{hljs-css-prefix}-tex .@{hljs-css-prefix}-formula,
-.@{hljs-css-prefix}-erlang_repl .@{hljs-css-prefix}-reserved,
-.@{hljs-css-prefix}-prompt,
-.@{hljs-css-prefix}-markdown .@{hljs-css-prefix}-link_label,
-.@{hljs-css-prefix}-vhdl .@{hljs-css-prefix}-attribute,
-.@{hljs-css-prefix}-clojure .@{hljs-css-prefix}-attribute,
-.@{hljs-css-prefix}-coffeescript .@{hljs-css-prefix}-property {
-    color: @syntax-label;
-}
-
-.@{hljs-css-prefix}-keyword,
-.@{hljs-css-prefix}-id,
-.@{hljs-css-prefix}-phpdoc,
-.@{hljs-css-prefix}-title,
-.@{hljs-css-prefix}-built_in,
-.@{hljs-css-prefix}-aggregate,
-.@{hljs-css-prefix}-css .@{hljs-css-prefix}-tag,
-.@{hljs-css-prefix}-javadoctag,
-.@{hljs-css-prefix}-phpdoc,
-.@{hljs-css-prefix}-yardoctag,
-.@{hljs-css-prefix}-smalltalk .@{hljs-css-prefix}-class,
-.@{hljs-css-prefix}-winutils,
-.@{hljs-css-prefix}-bash .@{hljs-css-prefix}-variable,
-.@{hljs-css-prefix}-apache .@{hljs-css-prefix}-tag,
-.@{hljs-css-prefix}-go .@{hljs-css-prefix}-typename,
-.@{hljs-css-prefix}-tex .@{hljs-css-prefix}-command,
-.@{hljs-css-prefix}-markdown .@{hljs-css-prefix}-strong,
-.@{hljs-css-prefix}-request,
-.@{hljs-css-prefix}-status {
-    font-weight: bold;
-}
-
-.@{hljs-css-prefix}-markdown .@{hljs-css-prefix}-emphasis {
-    font-style: italic;
-}
-
-.@{hljs-css-prefix}-nginx .@{hljs-css-prefix}-built_in {
-    font-weight: normal;
-}
-
-.@{hljs-css-prefix}-coffeescript .@{hljs-css-prefix}-javascript,
-.@{hljs-css-prefix}-javascript .@{hljs-css-prefix}-xml,
-.@{hljs-css-prefix}-tex .@{hljs-css-prefix}-formula,
-.@{hljs-css-prefix}-xml .@{hljs-css-prefix}-javascript,
-.@{hljs-css-prefix}-xml .@{hljs-css-prefix}-vbscript,
-.@{hljs-css-prefix}-xml .@{hljs-css-prefix}-css,
-.@{hljs-css-prefix}-xml .@{hljs-css-prefix}-cdata {
-    opacity: 0.5;
-}

themes/daux/less/theme-base.less

@@ -5,7 +5,8 @@
  */
 
 // Daux Style
-@import "mixins.less";
-@import "structure.less";
-@import "components.less";
-@import "highlight.less";
+@import "_mixins.less";
+@import "_typography.less";
+@import "_structure.less";
+@import "_components.less";
+@import "vendor/highlight.less";

themes/daux/less/theme-blue.less

@@ -1,20 +1,15 @@
-
 //Daux.io Blue
-  @sidebar-background: #f7f7f7;
-  @sidebar-hover: #c5c5cb;
-  @lines: #e7e7e9;
-  @dark: #3f4657;
-  @light: #82becd;
-  @text: #2d2d2d;
-  @syntax-string: #022e99;
-  @syntax-comment: #84989b;
-  @syntax-number: #2f9b92;
-  @syntax-label: #840d7a;
+@sidebar-background: #f7f7f7;
+@sidebar-hover: #c5c5cb;
+@lines: #e7e7e9;
+@dark: #3f4657;
+@light: #82becd;
+@text: #2d2d2d;
 
 // Bootstrap
-  @import "../../daux/less/bootstrap/variables.less";
-  @import "../../daux/less/bootstrap/mixins.less";
-  @icon-font-path: "../../daux/fonts/";
+@import "vendor/bootstrap/variables.less";
+@import "vendor/bootstrap/mixins.less";
+@icon-font-path: "../../daux/fonts/";
 
 // Daux.io Base
-  @import "theme-base.less";
+@import "theme-base.less";

themes/daux/less/theme-green.less

@@ -1,20 +1,15 @@
-
 //Daux.io Green
-  @sidebar-background: #f5f5f6;
-  @sidebar-hover: #a0d55d;
-  @lines: #e7e7e9;
-  @dark: #000000;
-  @light: #8acc37;
-  @text: #2d2d2d;
-  @syntax-string: #e0ff00;
-  @syntax-comment: #c4e598;
-  @syntax-number: #097c4e;
-  @syntax-label: #022e99;
+@sidebar-background: #f5f5f6;
+@sidebar-hover: #a0d55d;
+@lines: #e7e7e9;
+@dark: #000;
+@light: #8acc37;
+@text: #2d2d2d;
 
 // Bootstrap
-  @import "../../daux/less/bootstrap/variables.less";
-  @import "../../daux/less/bootstrap/mixins.less";
-  @icon-font-path: "../../daux/fonts/";
+@import "vendor/bootstrap/variables.less";
+@import "vendor/bootstrap/mixins.less";
+@icon-font-path: "../../daux/fonts/";
 
 // Daux.io Base
-  @import "theme-base.less";
+@import "theme-base.less";

themes/daux/less/theme-navy.less

@@ -1,20 +1,15 @@
-
 //Daux.io Navy
-  @sidebar-hover: #c5c5cb;
-  @lines: #e7e7e9;
-  @sidebar-background: #f5f5f6;
-  @dark: #13132a;
-  @light: #7795b4;
-  @text: #2d2d2d;
-  @syntax-string: #000000;
-  @syntax-comment: #505050;
-  @syntax-number: #09559b;
-  @syntax-label: #001775;
+@sidebar-hover: #c5c5cb;
+@lines: #e7e7e9;
+@sidebar-background: #f5f5f6;
+@dark: #13132a;
+@light: #7795b4;
+@text: #2d2d2d;
 
 // Bootstrap
-  @import "../../daux/less/bootstrap/variables.less";
-  @import "../../daux/less/bootstrap/mixins.less";
-  @icon-font-path: "../../daux/fonts/";
+@import "vendor/bootstrap/variables.less";
+@import "vendor/bootstrap/mixins.less";
+@icon-font-path: "../../daux/fonts/";
 
 // Daux.io Base
-  @import "theme-base.less";
+@import "theme-base.less";

themes/daux/less/theme-red.less

@@ -1,20 +1,15 @@
-
 // Daux.io Red
-  @sidebar-hover: #eeeeee;
-  @lines: #eeeeee;
-  @sidebar-background: #f7f7f7;
-  @dark: #c64641; //#df4f49;
-  @light: #ecb5a1;
-  @text: #2d2d2d;
-  @syntax-string: #557aa2;
-  @syntax-comment: #ecdfd0;
-  @syntax-number: #9b2f7d;
-  @syntax-label: #a31621;
+@sidebar-hover: #eee;
+@lines: #eee;
+@sidebar-background: #f7f7f7;
+@dark: #c64641; //#df4f49;
+@light: #ecb5a1;
+@text: #2d2d2d;
 
 // Bootstrap
-  @import "../../daux/less/bootstrap/variables.less";
-  @import "../../daux/less/bootstrap/mixins.less";
-  @icon-font-path: "../../daux/fonts/";
+@import "vendor/bootstrap/variables.less";
+@import "vendor/bootstrap/mixins.less";
+@icon-font-path: "../../daux/fonts/";
 
 // Daux.io Base
-  @import "theme-base.less";
+@import "theme-base.less";

themes/daux/less/theme.less

@@ -1,4 +1,4 @@
-
 // Bootstrap
-  @import "../../daux/less/bootstrap/bootstrap.less";
-  @icon-font-path: "../fonts/";
+@import "vendor/bootstrap/bootstrap.less";
+
+@icon-font-path: "../fonts/";

themes/daux/less/vendor/highlight.less

@@ -0,0 +1,64 @@
+/* ===========================================================================================
+Code Highlighting
+============================================================================================== */
+
+/*
+  codepen.io Embed Theme
+  Author: Justin Perry <http://github.com/ourmaninamsterdam>
+  Original theme - https://github.com/chriskempson/tomorrow-theme
+*/
+
+.hljs {
+    display: block;
+    overflow-x: auto;
+    padding: 0.5em;
+    background: #222;
+    color: #fff;
+}
+
+.hljs-comment,
+.hljs-quote {
+    color: #777;
+}
+
+.hljs-variable,
+.hljs-template-variable,
+.hljs-tag,
+.hljs-regexp,
+.hljs-meta,
+.hljs-number,
+.hljs-built_in,
+.hljs-builtin-name,
+.hljs-literal,
+.hljs-params,
+.hljs-symbol,
+.hljs-bullet,
+.hljs-link,
+.hljs-deletion {
+    color: #ab875d;
+}
+
+.hljs-section,
+.hljs-title,
+.hljs-name,
+.hljs-selector-id,
+.hljs-selector-class,
+.hljs-type,
+.hljs-attribute {
+    color: #9b869b;
+}
+
+.hljs-string,
+.hljs-keyword,
+.hljs-selector-tag,
+.hljs-addition {
+    color: #8f9c6c;
+}
+
+.hljs-emphasis {
+    font-style: italic;
+}
+
+.hljs-strong {
+    font-weight: bold;
+}

themes/daux_singlepage/less/book/markdown.less

@@ -1,303 +0,0 @@
-section.content {
-    padding: 25px;
-    padding-top: 15px;
-    background-color: white;
-
-
-    & > *:first-child {
-        margin-top: 0 !important; }
-    & > *:last-child {
-        margin-bottom: 0 !important; }
-
-    a {
-        color: #4183C4; }
-    a.absent {
-        color: #cc0000; }
-    a.anchor {
-        display: block;
-        padding-left: 30px;
-        margin-left: -30px;
-        cursor: pointer;
-        position: absolute;
-        top: 0;
-        left: 0;
-        bottom: 0; }
-
-    h1, h2, h3, h4, h5, h6 {
-        line-height: 1.7;
-        margin: 20px 0 10px;
-        padding: 0;
-        font-weight: bold;
-        -webkit-font-smoothing: antialiased;
-        cursor: text;
-        position: relative; }
-
-    h1 tt, h1 code {
-        font-size: inherit; }
-
-    h2 tt, h2 code {
-        font-size: inherit; }
-
-    h3 tt, h3 code {
-        font-size: inherit; }
-
-    h4 tt, h4 code {
-        font-size: inherit; }
-
-    h5 tt, h5 code {
-        font-size: inherit; }
-
-    h6 tt, h6 code {
-        font-size: inherit; }
-
-    h1 {
-        font-size: 28px;
-        color: black; }
-
-    h2 {
-        font-size: 24px;
-        border-bottom: 1px solid #eee;
-        color: black; }
-
-    h3 {
-        font-size: 18px; }
-
-    h4 {
-        font-size: 16px; }
-
-    h5 {
-        font-size: 14px; }
-
-    h6 {
-        color: #777777;
-        font-size: 14px; }
-
-    p, blockquote, ul, ol, dl, table, pre {
-        margin: 15px 0; }
-
-    hr {
-
-    }
-
-    body > h2:first-child {
-        margin-top: 0;
-        padding-top: 0; }
-    body > h1:first-child {
-        margin-top: 0;
-        padding-top: 0; }
-        body > h1:first-child + h2 {
-            margin-top: 0;
-            padding-top: 0; }
-    body > h3:first-child, body > h4:first-child, body > h5:first-child, body > h6:first-child {
-        margin-top: 0;
-        padding-top: 0; }
-
-    a:first-child h1, a:first-child h2, a:first-child h3, a:first-child h4, a:first-child h5, a:first-child h6 {
-        margin-top: 0;
-        padding-top: 0; }
-
-    h1 p, h2 p, h3 p, h4 p, h5 p, h6 p {
-        margin-top: 0; }
-
-    li p.first {
-        display: inline-block; }
-
-    ul, ol {
-        padding-left: 30px; }
-
-    ul :first-child, ol :first-child {
-        margin-top: 0; }
-
-    ul :last-child, ol :last-child {
-        margin-bottom: 0; }
-
-    ul p {
-        margin: 0px;
-    }
-    ul ul {
-        margin: 0px;
-    }
-
-    dl {
-        padding: 0; }
-        dl dt {
-            font-size: 14px;
-            font-weight: bold;
-            font-style: italic;
-            padding: 0;
-            margin: 15px 0 5px; }
-            dl dt:first-child {
-                padding: 0; }
-            dl dt > :first-child {
-                margin-top: 0; }
-            dl dt > :last-child {
-                margin-bottom: 0; }
-        dl dd {
-            margin: 0 0 15px;
-            padding: 0 15px; }
-            dl dd > :first-child {
-                margin-top: 0; }
-            dl dd > :last-child {
-                margin-bottom: 0; }
-
-    blockquote {
-        border-left: 4px solid #dddddd;
-        padding: 0 15px;
-        color: #777777;
-
-        p {
-            font-size: inherit;
-        }
-    }
-        blockquote > :first-child {
-            margin-top: 0;
-        }
-        blockquote > :last-child {
-            margin-bottom: 0; }
-
-    table {
-        width: 100%;
-        padding: 0;
-    }
-
-        table tr {
-            border-top: 1px solid #cccccc;
-            background-color: white;
-            margin: 0;
-            padding: 0; }
-            table tr:nth-child(2n) {
-                background-color: #f8f8f8; }
-            table tr th {
-                font-weight: bold;
-                border: 1px solid #cccccc;
-                margin: 0;
-                padding: 6px 13px; }
-            table tr td {
-                border: 1px solid #cccccc;
-                margin: 0;
-                padding: 6px 13px; }
-            table tr th :first-child, table tr td :first-child {
-                margin-top: 0; }
-            table tr th :last-child, table tr td :last-child {
-                margin-bottom: 0; }
-
-    img {
-        max-width: 100%;
-        display: block;
-        margin: 0px auto;
-    }
-
-    span.frame {
-        display: block;
-        overflow: hidden; }
-        span.frame > span {
-            border: 1px solid #dddddd;
-            display: block;
-            float: left;
-            overflow: hidden;
-            margin: 13px 0 0;
-            padding: 7px;
-            width: auto; }
-        span.frame span img {
-            display: block;
-            float: left; }
-        span.frame span span {
-            clear: both;
-            color: #333333;
-            display: block;
-            padding: 5px 0 0; }
-    span.align-center {
-        display: block;
-        overflow: hidden;
-        clear: both; }
-        span.align-center > span {
-            display: block;
-            overflow: hidden;
-            margin: 13px auto 0;
-            text-align: center; }
-        span.align-center span img {
-            margin: 0 auto;
-            text-align: center; }
-    span.align-right {
-        display: block;
-        overflow: hidden;
-        clear: both; }
-        span.align-right > span {
-            display: block;
-            overflow: hidden;
-            margin: 13px 0 0;
-            text-align: right; }
-        span.align-right span img {
-            margin: 0;
-            text-align: right; }
-    span.float-left {
-        display: block;
-        margin-right: 13px;
-        overflow: hidden;
-        float: left;
-
-        & span {
-            margin: 13px 0 0;
-        }
-    }
-
-    span.float-right {
-        display: block;
-        margin-left: 13px;
-        overflow: hidden;
-        float: right;
-
-        & > span {
-            display: block;
-            overflow: hidden;
-            margin: 13px auto 0;
-            text-align: right;
-        }
-    }
-
-    code, tt {
-        margin: 0 2px;
-        padding: 0 5px;
-        white-space: nowrap;
-        border: 1px solid #eaeaea;
-        background-color: #f8f8f8;
-        border-radius: 3px;
-    }
-
-    pre code {
-        margin: 0;
-        padding: 0;
-        white-space: pre;
-        border: none;
-        background: transparent;
-    }
-
-    .highlight pre {
-        color: hsl(204, 40%, 80%);
-        background-color: hsl(204, 30%, 10%);
-        border: 1px solid hsl(204, 30%, 10%);
-        font-size: 16px;
-        line-height: 1.5em;
-        overflow: auto;
-        padding: 20px;
-        margin: 0 -20px;
-        border-radius: 3px;
-    }
-
-    pre {
-        color: hsl(204, 40%, 80%);
-        background-color: hsl(204, 30%, 10%);
-        border: 1px solid hsl(204, 30%, 10%);
-        font-size: 16px;
-        line-height: 1.5em;
-        overflow: auto;
-        padding: 20px;
-        margin: 0 -20px;
-        border-radius: 3px;
-    }
-
-    pre code, pre tt {
-        background-color: transparent;
-        border: none;
-    }
-}

themes/daux_singlepage/less/fonts.less

@@ -2,143 +2,166 @@
     font-family: 'EB Garamond';
     font-style: normal;
     font-weight: 400;
-    src: local('EB Garamond 12 Regular'),url(//brick.a.ssl.fastly.net/fonts/ebgaramond/400.woff) format('woff');
+    src: local('EB Garamond 12 Regular'), url(//brick.a.ssl.fastly.net/fonts/ebgaramond/400.woff) format('woff');
 }
+
 @font-face {
     font-family: 'EB Garamond';
     font-style: italic;
-    font-weight: 400i;
-    src: local('EB Garamond 12 Italic'),url(//brick.a.ssl.fastly.net/fonts/ebgaramond/400i.woff) format('woff');
+    font-weight: 400;
+    src: local('EB Garamond 12 Italic'), url(//brick.a.ssl.fastly.net/fonts/ebgaramond/400i.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Merriweather';
     font-style: normal;
-    font-weight: 250;
-    src: local('Merriweather Light'),url(//brick.a.ssl.fastly.net/fonts/merriweather/250.woff) format('woff');
+    font-weight: 200;
+    src: local('Merriweather Light'), url(//brick.a.ssl.fastly.net/fonts/merriweather/250.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Merriweather';
     font-style: italic;
-    font-weight: 250i;
-    src: local('Merriweather Light Italic'),url(//brick.a.ssl.fastly.net/fonts/merriweather/250i.woff) format('woff');
+    font-weight: 200;
+    src: local('Merriweather Light Italic'), url(//brick.a.ssl.fastly.net/fonts/merriweather/250i.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Merriweather';
     font-style: normal;
     font-weight: 400;
-    src: local('Merriweather'),url(//brick.a.ssl.fastly.net/fonts/merriweather/400.woff) format('woff');
+    src: local('Merriweather'), url(//brick.a.ssl.fastly.net/fonts/merriweather/400.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Merriweather';
     font-style: italic;
-    font-weight: 400i;
-    src: local('Merriweather Italic'),url(//brick.a.ssl.fastly.net/fonts/merriweather/400i.woff) format('woff');
+    font-weight: 400;
+    src: local('Merriweather Italic'), url(//brick.a.ssl.fastly.net/fonts/merriweather/400i.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Merriweather';
     font-style: normal;
     font-weight: 600;
-    src: local(''),url(//brick.a.ssl.fastly.net/fonts/merriweather/600.woff) format('woff');
+    src: local(''), url(//brick.a.ssl.fastly.net/fonts/merriweather/600.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Merriweather';
     font-style: italic;
-    font-weight: 600i;
-    src: local(''),url(//brick.a.ssl.fastly.net/fonts/merriweather/600i.woff) format('woff');
+    font-weight: 600;
+    src: local(''), url(//brick.a.ssl.fastly.net/fonts/merriweather/600i.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Merriweather';
     font-style: normal;
     font-weight: 700;
-    src: local('Merriweather Bold'),url(//brick.a.ssl.fastly.net/fonts/merriweather/700.woff) format('woff');
+    src: local('Merriweather Bold'), url(//brick.a.ssl.fastly.net/fonts/merriweather/700.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Merriweather';
     font-style: italic;
-    font-weight: 700i;
-    src: local('Merriweather Bold Italic'),url(//brick.a.ssl.fastly.net/fonts/merriweather/700i.woff) format('woff');
+    font-weight: 700;
+    src: local('Merriweather Bold Italic'), url(//brick.a.ssl.fastly.net/fonts/merriweather/700i.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Merriweather';
     font-style: normal;
     font-weight: 900;
-    src: local('Merriweather Heavy'),url(//brick.a.ssl.fastly.net/fonts/merriweather/900.woff) format('woff');
+    src: local('Merriweather Heavy'), url(//brick.a.ssl.fastly.net/fonts/merriweather/900.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Merriweather';
     font-style: italic;
-    font-weight: 900i;
-    src: local('Merriweather Heavy Italic'),url(//brick.a.ssl.fastly.net/fonts/merriweather/900i.woff) format('woff');
+    font-weight: 900;
+    src: local('Merriweather Heavy Italic'), url(//brick.a.ssl.fastly.net/fonts/merriweather/900i.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Anonymous Pro';
     font-style: normal;
     font-weight: 400;
-    src: local('Anonymous Pro'),url(//brick.a.ssl.fastly.net/fonts/anonymouspro/400.woff) format('woff');
+    src: local('Anonymous Pro'), url(//brick.a.ssl.fastly.net/fonts/anonymouspro/400.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Anonymous Pro';
     font-style: italic;
-    font-weight: 400i;
-    src: local('Anonymous Pro Italic'),url(//brick.a.ssl.fastly.net/fonts/anonymouspro/400i.woff) format('woff');
+    font-weight: 400;
+    src: local('Anonymous Pro Italic'), url(//brick.a.ssl.fastly.net/fonts/anonymouspro/400i.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Anonymous Pro';
     font-style: normal;
     font-weight: 700;
-    src: local('Anonymous Pro Bold'),url(//brick.a.ssl.fastly.net/fonts/anonymouspro/700.woff) format('woff');
+    src: local('Anonymous Pro Bold'), url(//brick.a.ssl.fastly.net/fonts/anonymouspro/700.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Anonymous Pro';
     font-style: italic;
-    font-weight: 700i;
-    src: local('Anonymous Pro Bold Italic'),url(//brick.a.ssl.fastly.net/fonts/anonymouspro/700i.woff) format('woff');
+    font-weight: 700;
+    src: local('Anonymous Pro Bold Italic'), url(//brick.a.ssl.fastly.net/fonts/anonymouspro/700i.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Open Sans';
     font-style: normal;
     font-weight: 300;
-    src: local('Open Sans Light'),url(//brick.a.ssl.fastly.net/fonts/opensans/300.woff) format('woff');
+    src: local('Open Sans Light'), url(//brick.a.ssl.fastly.net/fonts/opensans/300.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Open Sans';
     font-style: italic;
-    font-weight: 300i;
-    src: local('Open Sans Light Italic'),url(//brick.a.ssl.fastly.net/fonts/opensans/300i.woff) format('woff');
+    font-weight: 300;
+    src: local('Open Sans Light Italic'), url(//brick.a.ssl.fastly.net/fonts/opensans/300i.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Open Sans';
     font-style: normal;
     font-weight: 400;
-    src: local('Open Sans Regular'),url(//brick.a.ssl.fastly.net/fonts/opensans/400.woff) format('woff');
+    src: local('Open Sans Regular'), url(//brick.a.ssl.fastly.net/fonts/opensans/400.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Open Sans';
     font-style: italic;
-    font-weight: 400i;
-    src: local('Open Sans Italic'),url(//brick.a.ssl.fastly.net/fonts/opensans/400i.woff) format('woff');
+    font-weight: 400;
+    src: local('Open Sans Italic'), url(//brick.a.ssl.fastly.net/fonts/opensans/400i.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Open Sans';
     font-style: normal;
     font-weight: 600;
-    src: local('Open Sans Semibold'),url(//brick.a.ssl.fastly.net/fonts/opensans/600.woff) format('woff');
+    src: local('Open Sans Semibold'), url(//brick.a.ssl.fastly.net/fonts/opensans/600.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Open Sans';
     font-style: italic;
-    font-weight: 600i;
-    src: local('Open Sans Semibold Italic'),url(//brick.a.ssl.fastly.net/fonts/opensans/600i.woff) format('woff');
+    font-weight: 600;
+    src: local('Open Sans Semibold Italic'), url(//brick.a.ssl.fastly.net/fonts/opensans/600i.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Open Sans';
     font-style: normal;
     font-weight: 700;
-    src: local('Open Sans Bold'),url(//brick.a.ssl.fastly.net/fonts/opensans/700.woff) format('woff');
+    src: local('Open Sans Bold'), url(//brick.a.ssl.fastly.net/fonts/opensans/700.woff) format('woff');
 }
+
 @font-face {
     font-family: 'Open Sans';
     font-style: italic;
-    font-weight: 700i;
-    src: local('Open Sans Bold Italic'),url(//brick.a.ssl.fastly.net/fonts/opensans/700i.woff) format('woff');
+    font-weight: 700;
+    src: local('Open Sans Bold Italic'), url(//brick.a.ssl.fastly.net/fonts/opensans/700i.woff) format('woff');
 }

themes/daux_singlepage/less/main.less

@@ -1,20 +1,16 @@
 // Core variables and mixins
-@import "vendors/bootstrap/variables.less";
-@import "vendors/bootstrap/normalize.less";
-@import "vendors/bootstrap/scaffolding.less";
-@import "vendors/bootstrap/type.less";
-
+@import "vendor/bootstrap/variables.less";
+@import "vendor/bootstrap/normalize.less";
+@import "vendor/bootstrap/scaffolding.less";
+@import "vendor/bootstrap/type.less";
 @import "variables.less";
 @import "fonts.less";
-
-@import "highlight.less";
-
-@import "book/markdown.less";
+@import "vendor/highlight.less";
+@import "typography.less";
 
 * {
     -webkit-overflow-scrolling: touch;
     -webkit-tap-highlight-color: transparent;
-    -webkit-text-size-adjust: none;
     -webkit-touch-callout: none;
     -webkit-font-smoothing: antialiased;
 }
@@ -35,10 +31,9 @@ img {
 
 .page-break { display: none; }
 
-
 @media screen {
     body {
-        margin:1em;
+        margin: 1em;
     }
 }