Design fixes, fixes #288 and fixes #119

resources/themes/_common/less/bootstrap/bootstrap.less

@@ -19,7 +19,7 @@
 @import "code.less";
 @import "grid.less";
 //@import "tables.less";
-@import "forms.less";
+//@import "forms.less";
 @import "buttons.less";
 
 // Components
@@ -42,7 +42,7 @@
 //@import "list-group.less";
 //@import "panels.less";
 //@import "responsive-embed.less";
-@import "wells.less";
+//@import "wells.less";
 //@import "close.less";
 
 // Components w/ JavaScript

resources/themes/_common/less/bootstrap/navbar.less

@@ -140,7 +140,8 @@
   position: fixed;
   right: 0;
   left: 0;
-  z-index: @zindex-navbar-fixed;
+
+
 
   // Undo the rounded corners
   @media (min-width: @grid-float-breakpoint) {
@@ -283,7 +284,8 @@
 // Extension of the `.form-inline` with some extra flavor for optimum display in
 // our navbars.
 
-.navbar-form {
+//DAUX.io / onigoetz; removed so we can safely remove forms.less
+/*.navbar-form {
   margin-left: -@navbar-padding-horizontal;
   margin-right: -@navbar-padding-horizontal;
   padding: 10px @navbar-padding-horizontal;
@@ -318,7 +320,7 @@
     padding-bottom: 0;
     .box-shadow(none);
   }
-}
+}*/
 
 
 // Dropdown menus

resources/themes/_common/less/components.less

@@ -6,6 +6,8 @@ a {
 }
 
 .btn {
+    display: inline-block;
+
     &.btn-sidebar {
         padding: 7px 10px;
         .kill-background-image;
@@ -44,7 +46,6 @@ code {
     box-shadow: 0 1px 5px rgba(0,0,0,.25);
     background-color: @dark;
     margin-bottom: 0px;
-    z-index: 200;
 
     .container, .container-fluid {
         .kill-background-image;
@@ -65,19 +66,6 @@ code {
             }
         }
     }
-
-    @media (min-width: 768px) and (max-width: 979px) {
-        &.navbar-fixed-top {
-            position: fixed;
-        }
-    }
-
-    @media (max-width: 767px) {
-        &.navbar-fixed-top {
-            margin-left: 0px;
-            margin-right: 0px;
-        }
-    }
 }
 
 //Sidebar Nav List
@@ -308,26 +296,21 @@ table {
     z-index: 200;
 }
 
-.well {
+.sidebar-links {
-    &.well-sidebar {
+    padding:20px;
-        .kill-box-shadow;
-        background-color: transparent;
-        border-radius: 0;
-        border: none;
 
-        a {
+    a {
-            font-size: 13px;
+        font-size: 13px;
-            .roboto-slab.regular;
+        .roboto-slab.regular;
-            color: @light;
+        color: @light;
-            line-height: 28px;
+        line-height: 28px;
-        }
+    }
 
-        .twitter {
+    .twitter {
-            hr {
+        hr {
-                border-bottom: none;
+            border-bottom: none;
-                margin-left: -20px;
+            margin-left: -20px;
-                margin-right: -20px;
+            margin-right: -20px;
-            }
         }
     }
 }

resources/themes/_common/less/structure.less

@@ -163,11 +163,11 @@ Homepage
 
     .twitter {
         margin-top: 20px;
-    }
 
-        .twitter:first-child {
+        &:first-child {
             margin-top: 40px;
         }
+    }
 }
 
 /* ===========================================================================================
@@ -175,68 +175,97 @@ Docs Body & Page Structure
 ============================================================================================== */
 
 html, body {
-    margin: 0;
-    padding: 0;
     height: 100%;
-    background-color: @light;
+    background-color: #fff;
     color: @text;
 }
 
-//100% Height Columns
-.container-fluid {
-
-    &.fluid-height {
-        height: 100%;
-    }
-}
-
 .columns {
-    height: 100%;
-    padding-top: @navbar-height;
-
     .left-column {
-        background-color: @sidebar-background;
+        background-color:@sidebar-background;
-        border-right: 1px solid @lines;
-        overflow-x: hidden;
     }
 
     .right-column {
         .content-page {
-            padding: 20px;
+            padding: 10px;
-            min-height: 100%;
+            background-color:#fff;
-            background-color: white;
         }
     }
 }
 
-.content-area, .article-tree {
+.container-fluid .navbar-static-top {
-    overflow: auto;
+    margin-left:-15px;
-    padding: 0px;
+    margin-right:-15px;
-
-    @media (min-width: 767px) {
-        height: 100%;
-    }
 }
 
 //mobile friendly sub-nav
 .responsive-collapse {
     padding: 10px 15px;
-    display: none;
+    display: block;
     background-color: @lines;
     border-bottom: 1px solid @lines;
-
-    @media (max-width: 767px) {
-        display: block;
-    }
 }
 
 .sub-nav-collapse {
-    @media (max-width: 768px) {
+    display: none;
+}
+
+.content-area,
+.article-tree {
+    padding: 0px;
+}
+
+@media screen and (min-width: 767px)  {
+
+    body {
+        //Needed only for floating code blocks
+        background-color:@light;
+    }
+
+    .navbar-static-top {
+        position:fixed;
+        z-index: @zindex-navbar-fixed;
+        width:100%;
+    }
+
+    .responsive-collapse {
         display: none;
     }
 
-    @media (min-width: 768px) {
+    .sub-nav-collapse {
-        display: block;
+        display: block !important;
+    }
+
+    //100% Height Columns
+    .container-fluid {
+
+        &.fluid-height {
+            height:100%;
+        }
+    }
+
+    .content-area,
+    .article-tree {
+        overflow: auto;
+
+        height: 100%;
+    }
+
+    .columns {
+        height:100%;
+        padding-top:@navbar-height;
+
+        .left-column {
+            border-right:1px solid @lines;
+            overflow-x:hidden;
+        }
+
+        .right-column {
+            .content-page {
+                padding:20px;
+                min-height:100%;
+            }
+        }
     }
 }
 
@@ -299,3 +328,13 @@ html, body {
             content: attr(data-title);
         }
 }
+
+@media print {
+    .content-area {
+        width:100% !important;
+    }
+
+    h1 a[href]:after {
+        font-size:50%;
+    }
+}

templates/home.php

@@ -1,5 +1,5 @@
 <?php $this->layout('theme::layout/00_layout') ?>
-<div class="navbar navbar-fixed-top hidden-print">
+<div class="navbar navbar-static-top hidden-print">
     <div class="container">
         <?php $this->insert('theme::partials/navbar_content', ['params' => $params]); ?>
     </div>
@@ -8,7 +8,7 @@
     <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>
 <?php } ?>
 
-<div class="homepage-hero well container-fluid">
+<div class="homepage-hero container-fluid">
     <div class="container">
         <div class="row">
             <div class="text-center col-sm-12">
@@ -28,19 +28,16 @@
 </div>
 
 <div class="hero-buttons container-fluid">
-    <div class="container">
+    <div class="container text-center">
-        <div class="row">
+        <?php
-            <div class="text-center col-sm-12">
+        if ($params['html']['repo']) {
-                <?php
+            echo '<a href="https://github.com/' . $params['html']['repo'] . '" class="btn btn-secondary btn-hero">View On GitHub</a>';
-                if ($params['html']['repo']) {
+        }
-                    echo '<a href="https://github.com/' . $params['html']['repo'] . '" class="btn btn-secondary btn-hero">View On GitHub</a>';
+        foreach ($page['entry_page'] as $key => $node) {
-                }
+            echo '<a href="' . $node . '" class="btn btn-primary btn-hero">' . $key . '</a>';
-                foreach ($page['entry_page'] as $key => $node) {
+        }
-                    echo '<a href="' . $node . '" class="btn btn-primary btn-hero">' . $key . '</a>';
+        ?>
-                }
+        <div class="clearfix"></div>
-                ?>
-            </div>
-        </div>
     </div>
 </div>
 
@@ -54,7 +51,7 @@
     </div>
 </div>
 
-<div class="homepage-footer well container-fluid">
+<div class="homepage-footer container-fluid">
     <div class="container">
         <div class="row">
             <div class="col-sm-5 col-sm-offset-1">

templates/layout/05_page.php

@@ -4,7 +4,7 @@
     <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>
 <?php } ?>
 <div class="container-fluid fluid-height wrapper">
-    <div class="navbar navbar-fixed-top hidden-print">
+    <div class="navbar navbar-static-top hidden-print">
         <div class="container-fluid">
             <?php $this->insert('theme::partials/navbar_content', ['params' => $params]); ?>
         </div>
@@ -30,7 +30,7 @@
                 ?>
 
                 <?php if (!empty($params['html']['links']) || !empty($params['html']['twitter']) || $params['html']['toggle_code']) { ?>
-                    <div class="well well-sidebar">
+                    <div class="sidebar-links">
 
                         <!-- Links -->
                         <?php