Merge branch 'spis-master' into 'master'

spis master

See merge request !3

css/area_content.less

@@ -5,11 +5,8 @@
  */
 
 
-.content .row > .col-xs-12{
+.content .row {
-    box-shadow: __box_shadow__;
+    > .col-xs-12 {
+        box-shadow: @box-shadow;
+    }
 }
-
-
-
-
-

css/area_footer.less

@@ -9,6 +9,17 @@
 /* no print */
 
 @media screen {
+    .page-footer {
+        background: @background_page-header;
+        border-top: 1px solid @color-border;
+        font-size: @font-size-default;
+        padding: @margin-small (@margin-big - .5);
+
+        bdi {
+            font-weight: bold;
+        }
+    }
+
     #dokuwiki__footer {
         .main-footer {
             position: relative;
@@ -17,10 +28,7 @@
 
         p {
             font-size: @font-size-default;
-        }
+            margin: 0;
-
-        bdi {
-            font-weight: bold;
         }
     }
 }
@@ -31,7 +39,6 @@
 
 @media @screen_min-md {
     #dokuwiki__footer {
-
         .col-xs-12 {
             float: right;
             width: 73%;
@@ -49,7 +56,6 @@
 
 @media @screen_max-md {
     #dokuwiki__footer {
-
         .main-footer {
             padding: @margin-default (@margin-big - .5);
         }

css/area_nav-breadcrumb.less

@@ -5,54 +5,126 @@
  */
 
 .breadcrumbs {
-    padding: 2rem 2rem 1rem;
+    padding: @margin-small 1.8rem;
     border-bottom: 1px solid @color-border;
 
     > p {
         font-size: .83rem;
         margin: 0;
+
         * {
             font-size: .83rem;
         }
+
         .bchead {
             .sr-only();
         }
+
         a {
-            &:hover,&:focus,&:active{
+            &:hover,
+            &:focus,
+            &:active {
                 color: @color-nav;
             }
         }
+
         span.home {
             a {
                 .fontello();
                 .hide-text-show-before();
                 .icon-home();
+
                 height: 1em;
                 width: auto;
                 text-decoration: none;
+                transition: @transition color;
+
                 &:before {
                     font-size: 1rem;
                     margin-top: .17rem;
                 }
-                &:hover,&:focus,&:active{
+
-                    color: @color-nav;
+                &:hover,
+                &:focus,
+                &:active {
+                    color: @color-link-hover;
+                }
+            }
         }
     }
 
-        }
-    }
     .page-attributes {
         float: right;
         display: inline-block;
         list-style: none;
-        margin:0; padding:0;
+        margin: 0;
-        max-width: 30%;
-        > li{
-            display: inline-block;
-            //float: right;
-            margin: 0 .1rem;
         padding: 0;
-            font-size: .8rem;
+        max-width: 30%;
+
+        > li {
+            .btn-usertools-wrapper(); // uniform li
+            .btn-usertools-num();
+
+            float: left;
+
+            &.do_none {
+                &:not([class*="plugin__qc"]) {
+                    background-color: @color-site-bg;
+                }
+
+                .num {
+                    background-color: @color-border;
+                    color: @color-nav;
+                }
+            }
+
+            &.plugin__qc {
+                display: inline-block;
+                overflow: visible;
+            }
+
+            .prefix {
+                .fontello();
+                .hide-text-show-before();
+
+                height: auto;
+                width: 100%;
+                color: @color-nav;
+                text-align: center;
+                transition: @transition color;
+
+                &::before {
+                    width: 100%;
+                    margin: .35em 0 0;
+                }
+            }
+        } // li
+
+        a {
+            display: block;
+            width: auto;
+            min-height: 2em;
+            margin: 0;
+            border: 1px solid @color-border;
+            border-radius: @border-radius;
+            color: @color-nav;
+            transition: @transition color, @transition border-color;
+
+            &[aria-expanded="false"] + #plugin__qc__wrapper {
+                display: none;
+            }
+
+            &:hover,
+            &:active,
+            &:focus {
+                border-color: @button_color;
+                color: @button_color;
+
+                .prefix {
+                    color: @button_color;
+                }
+            }
+        }
 
         #plugin__qc__wrapper {
             position: absolute;
@@ -60,56 +132,24 @@
             width: auto;
             border: 0 none;
             background: @color-site-bg;
+
+            &[aria-hidden="false"] {
+                margin-top: .5rem;
             }
-            a[aria-expanded="false"] + #plugin__qc__wrapper{
-                display: none;
-            }
-            #plugin__qc__wrapper[aria-hidden="false"]{
-                margin-top: .7rem;
         }
 
         #plugin__qc__icon {
             display: none;
         }
-            &.plugin__qc{
+
-                display: inline-block;
-                overflow: visible;
-            }
         #plugin__qc__link {
             font-size: .8rem;
             position: relative;
-                display: block;
-                height: 1rem;
-                width: 1rem;
-                border: 1px solid @color-border;
-                background-color: @color-site-bg;
-                border-radius: @border-radius;
-                color: @color-nav;
-                min-height: 1.2em;
-                min-width: 1.4em;
-                box-sizing: content-box;
-                padding: .3em .25em .15em;
 
             .prefix {
-                    font-size: .8rem;
-                    .fontello();
-                    .hide-text-show-before();
                 .icon-emo-happy();
-                    color: @color-nav;
+
-                }
+                font-size: inherit;
-                .num{
-                    position: absolute;
-                    padding: .2em .3em .1em;
-                    text-align: center;
-                    font-size: .6rem;
-                    line-height: 100%;
-                    font-weight: 400;
-                    right: -0.3em;
-                    top: -0.4em;
-                    background-color: @color-border;
-                    border-radius: 2px;
-                    color: @color-nav;
-                }
             }
         }
     }

css/area_nav-usertools.less

@@ -4,94 +4,86 @@
  * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
  */
 
+
 .nav-usertools {
     &.has-bar {
         margin-top: @height-context-bar;
         padding-top: .5rem;
     }
+
     ul {
         float: right;
-        padding: 0; margin: .2rem -.2rem 0 0;
-        li{
-            display: inline-block;
-            float: right;
-            margin: 0 .1rem;
         padding: 0;
+        margin: .2rem -.2rem 0 0;
+
+        li {
+            .btn-usertools-wrapper(); // uniform li
+            .btn-usertools-num();
+
+            float: right;
             font-size: .8rem;
+
             * {
                 font-size: .8rem;
             }
-            a{
+
+            > strong,
+            > a {
+                display: block;
+                width: auto;
+                min-height: 2em;
+                border: 1px solid @color-border;
+                border-radius: @border-radius;
                 color: @color-nav;
-                box-sizing: content-box;
-                padding: .3em .25em .15em;
                 text-align: center;
-                text-decoration: none;
-                border: 1px solid @color-border;
-                border-radius: @border-radius;
-                margin: 2px;
-                cursor: pointer;
-
-                &:hover, &:active, &:focus{
-                    background-color: @color-nav-hover-bg;
-                    border-width: 3px;
-                    border-style: double;
                 margin: 0;
-
-                    //-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
-                    //box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
-                    color: @color-nav-hover;
             }
 
-                .fontello();
+            &.noopentasks {
-                .hide-text-show-before();
+                .num {
-                &:before{
+                    background-color: @color-border;
-                    font-size: 1.12em;
+                    color: @color-nav;
-                    cursor: pointer;
+                }
-                    content: "?";
             }
 
-                /* icon register new user */
+            &.user {
-                &.register{
-                    .icon-user();
-                }
-                /* icon log-out */
-                &.logout{
-                    .icon-logout();
-                }
-                /* icon log-in */
-                &.login{
-                    .icon-login();
-                }
-                /* icon admin */
-                &.admin{
-                    .icon-cog();
-                }
-
-                /* add more icons if needed */
-            }
-
-            &.user-task{
                 border: 1px solid @color-border;
                 border-radius: @border-radius;
+                padding: .3rem .25rem;
+
+                bdi {
                     color: @color-nav;
                     display: inline-block;
-                height: 1rem;
+                    padding-top: 1px;
-                width: 1rem;
+                }
-                min-height: 1.2em;
-                min-width: 1.4em;
-                box-sizing: content-box;
-                padding: .3em .25em .15em;
-                margin-top: 2px;
-                position: relative;
 
+                > bdi:first-of-type {
+                    .fontello();
+                    .icon-user();
+
+                    &::before {
+                        float: left;
+                        background: @color-nav;
+                        border: 4px solid @color-nav;
+                        border-radius: 50%;
+                        color: #fff;
+                        font-size: .5rem;
+                        margin-top: -1px;
+                        margin-right: 6px;
+                    }
+                }
+            } // user
+
+            &.user-task {
+                position: relative;
 
                 a {
                     position: relative;
                     overflow: visible;
                     white-space: normal;
                     text-indent: 0;
-                    &:before{
+
+                    &::before {
                         content: "";
                         position: absolute;
                     }
@@ -101,62 +93,70 @@
                     .fontello();
                     .hide-text-show-before();
                     .icon-clipboard();
+
                     color: @color-nav;
+                    margin-top: .3rem;
                 }
 
-
+                &.opentasks,
-
+                &.opentask {
-                .num{
-                    position: absolute;
-                    padding: .2em .3em .1em;
-                    text-align: center;
-                    font-size: .6rem;
-                    line-height: 100%;
-                    font-weight: 400;
-                    right: -0.3em;
-                    top: -0.4em;
-                    background-color: @color-border;
-                    border-radius: 2px;
-                    color: @color-nav;
-                }
-                &.opentasks, &.opentask{
                     .num {
                         background-color: @color-link;
                         color: #fff;
                     }
                 }
+            } // user-task
+        } // li
+
+        a {
+            .fontello();
+            .hide-text-show-before();
+
+            cursor: pointer;
+            background-color: #fff;
+            text-decoration: none;
+            transition: @transition color, @transition border-color;
+
+            &:hover,
+            &:active,
+            &:focus {
+                border-color: @color-nav-hover;
+                //-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
+                //box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
+                color: @color-nav-hover;
             }
 
-            &.user{
+            &::before {
-                border: 1px solid @color-border;
+                content: "?";
-                border-radius: @border-radius;
+                display: block;
-                color: @color-nav;
+                width: 100%;
-                display: inline-block;
+                box-sizing: border-box;
-                height: 1rem;
+                font-size: 1.12em;
-                min-height: 1.2em;
+                cursor: pointer;
-                min-width: 1.4em;
+                margin: .3rem 0;
-                box-sizing: content-box;
-                padding: .3em .25em .15em;
-                margin-top: 2px;
-                bdi{
-                    color: @color-nav;
-                    display: inline-block;
-                    padding-top: 1px;
             }
-                >bdi:first-of-type{
+
-                    .fontello();
+            /* icon register new user */
+            &.register {
                 .icon-user();
-                    &:before{
+            }
-                        border: 4px solid @color-nav;
+
-                        margin-top: -1px;
+            /* icon log-out */
-                        border-radius: 50%;
+            &.logout {
-                        background: @color-nav;
+                .icon-logout();
-                        color: #fff;
+            }
-                        font-size: .5rem;
+
-                        float: left;
+            /* icon log-in */
-                    }
+            &.login {
-                }
+                .icon-login();
-            }
+            }
+
+            /* icon admin */
+            &.admin {
+                .icon-cog();
+            }
+
+            /* add more icons if needed */
         }
     }
 }

css/area_sidebar-search.less

@@ -23,8 +23,6 @@
         input {
             min-height: @icon-size;
             box-sizing: border-box;
-            border-color: @color-link;
-            border-radius: 0;
         }
 
         button[type="submit"] {
@@ -32,22 +30,28 @@
             .hide-text-show-before();
             .icon-search();
 
+            position: relative;
             width: @icon-size;
             min-height: @icon-size;
+            overflow: visible;
             background-image: none;
-            background-color: @color-link;
+            background-color: transparent;
-            border: solid 1px @color-link;
+            border: solid 1px transparent;
-            border-radius: 0;
+            border-right-color: @color-border;
-            color: #fff;
+            color: @color-nav;
             margin-left: -(@icon-size);
             padding: 0;
-            transition: @transition color, @transition background-color;
+            transition: @transition color, @transition border-color;
 
             &:hover,
             &:focus,
             &:active {
-                background-color: #fff;
+                border: solid 1px @color-link;
                 color: @color-link;
+
+                &::after {
+                    background-color: @color-link;
+                }
             }
 
             &::before {
@@ -57,6 +61,17 @@
                 text-align: center;
                 margin: 0;
             }
+
+            &::after {
+                content: '';
+                position: absolute;
+                top: 15%;
+                bottom: 15%;
+                width: 1px;
+                left: -1px;
+                background-color: @color-border;
+                transition: @transition background-color;
+            }
         }
     }
 }

css/base.less

@@ -9,12 +9,13 @@
 /* converted vars */
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
 
-@height-context-bar: 50px;
+@background_page-header: __background_page-header__;
 
 @border-radius:          __default_border_radius__;
 
 @font_family_screen:     __font_family_screen__;
 
+@color-text:             __text__;
 @color-border:           __border__;
 @color-nav:              __nav_menu_color__;
 @color-nav-hover:        __nav_menu_hover_color__;
@@ -24,13 +25,23 @@
 @color-site-bg:          __background_site__;
 
 @color-link:             __existing__;
+@color-link-hover:       @color-nav;
+
+@button_color:           __button_color__;
+@button_background:      __button_background__;
+
+@box-shadow-offset:      __box_shadow_offset__;
+@box-shadow:             __box_shadow__;
+@box-shadow-colored:     __box_shadow_colored__;
 
 
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* global vars */
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
 
-@margin-small:       .5rem;
+@height-context-bar: 50px;
+
+@margin-small:       1rem;
 @margin-default:     1.5rem;
 @margin-big:         2.5rem;
 
@@ -120,10 +131,6 @@
 @grid-columns:      12;
 
 
-@box-shadow-offset: __box_shadow_offset__;
-@box-shadow:        __box_shadow__;
-@box-shadow-colored:__box_shadow_colored__;
-
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* all media */
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */

css/base_mixins.less

@@ -141,6 +141,47 @@
 }
 
 
+/* + + + + +  small icon-buttons (breadcrumb, page-header)  + + + + + */
+.btn-usertools-wrapper(@elem:2em) {
+    display: inline-block;
+    min-height: @elem;
+    min-width: @elem;
+    box-sizing: border-box;
+    color: @color-nav;
+    font-size: .8rem;
+    padding: 0;
+    margin: 0 .2rem 0 .1rem;
+}
+
+.btn-usertools-num () {
+    .num {
+        position: absolute;
+        right: -.4em;
+        top: -.4em;
+        background-color: @button_color;
+        border-radius: 2px;
+        color: #fff;
+        font-size: .6rem;
+        font-weight: 400;
+        text-align: center;
+        line-height: 100%;
+        padding: .2em .3em .1em;
+        transition: @transition color, @transition background-color;
+    }
+
+    a {
+        &:hover,
+        &:active,
+        &:focus {
+            .num {
+                background-color: @button_color;
+                color: @button_background;
+            }
+        }
+    }
+}
+
+
 .btn-default-size() {
     height: 1rem;
     width: 1rem;
@@ -178,6 +219,7 @@
     overflow: hidden;
     white-space: nowrap;
     text-indent: -9999px;
+
     &::before{
         text-indent: 0;
         float: right;

css/base_structure.less

@@ -5,7 +5,10 @@
  */
 
 
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* Col Grid */
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
+
 .make-grid(xs);
 
 @media screen {
@@ -30,6 +33,7 @@
     .container {
         //border: 1px solid green;
     }
+
     .make-grid(sm);
 }
 
@@ -37,6 +41,7 @@
     .container {
         //border: 1px solid blue;
     }
+
     .make-grid(md);
 }
 
@@ -44,6 +49,7 @@
     .container {
         //border: 1px solid blue;
     }
+
     .make-grid(lg);
 }
 
@@ -51,6 +57,7 @@
     html {
         font-size: 120%;
     }
+
     .container {
         //border: 1px solid red;
     }
@@ -60,28 +67,31 @@
     html {
         //font-size: 135%;
     }
+
     .container {
         //border: 1px solid red;
     }
 }
 
-
-
 @media @screen_min-md {
 
     // z-indeces
     .nav-direct p {
         z-index: 1000;
     }
+
     .top-header {
         z-index: 900;
     }
+
     .tools .row > .col-xs-12 {
         z-index: 1;
     }
+
     .header .row > .col-xs-12 {
         z-index: 2;
     }
+
     .content .row > .col-xs-12 {
         z-index: 3;
     }
@@ -124,6 +134,7 @@
             background-color: #fff;
         }
     }
+
     .showSidebar {
         .content {
             .row > .col-xs-12 {
@@ -153,6 +164,7 @@
                 position: absolute;
                 bottom: 0;
                 height: 1px;
+                width: 100%; // fo IE
                 overflow: visible;
             }
             .logo img {

css/plugins/do_tasks.less

@@ -4,37 +4,30 @@
 
 ul.page-attributes {
     .plugin__do_pagetasks {
-        &.do_none{
+        @icon-size: 2em;
-            border: 1px solid @color-border;
+
-            border-radius: @border-radius;
+        .btn-usertools-num ();
-            color: @color-nav;
+
-            display: inline-block;
-            height: 1rem;
-            min-height: 1.2em;
-            min-width: 1.4em;
-            box-sizing: content-box;
-            padding: .3em .25em .15em;
-            position: relative;
-        }
-        .num{
-            position: absolute;
-            padding: .2em .3em .1em;
-            text-align: center;
-            font-size: .6rem;
-            line-height: 100%;
-            font-weight: 400;
-            right: -0.3em;
-            top: -0.4em;
-            background-color: @color-border;
-            border-radius: 2px;
-            color: @color-nav;
-        }
         .prefix {
             .fontello();
             .hide-text-show-before();
             .icon-clipboard();
-            color: @color-nav;
+
             font-size: .8rem;
+            min-height: @icon-size;
+            min-width: @icon-size;
+            color: @color-nav;
+            transition: @transition color;
+        }
+
+        &.do_none {
+            position: relative;
+            height: 1rem;
+            width: 1rem;
+            box-sizing: border-box;
+            border: 1px solid @color-border;
+            border-radius: @border-radius;
+            padding: 0 .2em;
         }
     }
 }

css/plugins/magic-matcher.less

@@ -1,5 +1,3 @@
-
-
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* all media */
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
@@ -9,10 +7,11 @@
 /* magic matcher bar with form on top of page */
 
 #dokuwiki_magic-matcher {
-
     position: fixed;
-    top:0; left: 0;
+    top: 0;
+    left: 0;
     width: 100%;
+
     #magicmatcher__context {
         box-sizing: border-box;
         background-color: __nav_direct_background__;
@@ -25,11 +24,13 @@
         padding: .8em 1em .5em;
         margin-bottom: 0;
 
-        .chosen-container-single .chosen-single span{
+        .chosen-container-single {
+            .chosen-single span {
                 line-height: @line-height-bigger;
             }
         }
     }
+}
 
 .no-js {
     #dokuwiki_magic-matcher {
@@ -38,9 +39,29 @@
 }
 
 
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/* max-width: 1023px */
+
+@media @screen_max-lg {
+    #dokuwiki_magic-matcher {
+        #magicmatcher__context {
+            .chosen-container-single {
+                width: 20% !important;
+
+                + select + .chosen-container-single {
+                    width: 58% !important;
+                }
+            }
+        }
+    }
+}
+
+
+
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* print */
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
+
 @media print {
     #dokuwiki_magic-matcher {
         display: none;

lang/de/lang.php

@@ -29,9 +29,12 @@ $lang['tasks_page_none']            = 'keine offenen Aufgaben für diese Seite';
 $lang['discussion']                 = 'Diskussion';
 $lang['back_to_article']            = 'Zurück zum Artikel';
 $lang['userpage']                   = 'Benutzer-Seite';
-$lang['__existing__']               = 'The color for links to existing pages';
+$lang['__existing__']               = 'Schriftfarbe für Links zu vorhandenen Webseiten';
-$lang['__missing__']                = 'The color for links to non-existing pages';
+$lang['__missing__']                = 'Schriftfarbe für Links zu nicht vorhandenen Webseiten';
 $lang['__site_width__']             = 'The width of the full site (can be any length unit: %, px, em, ...)';
 $lang['__sidebar_width__']          = 'The width of the sidebar, if any (can be any length unit: %, px, em, ...)';
 
+$lang['__button_color__']           = 'Schriftfarbe für Buttons';
+$lang['__button_background__']      = 'Hintergrundfarbe für Buttons';
+
 //Setup VIM: ex: et ts=2 :

lang/en/lang.php

@@ -33,3 +33,6 @@ $lang['__existing__']               = 'The color for links to existing pages';
 $lang['__missing__']                = 'The color for links to non-existing pages';
 $lang['__site_width__']             = 'The width of the full site (can be any length unit: %, px, em, ...)';
 $lang['__sidebar_width__']          = 'The width of the sidebar, if any (can be any length unit: %, px, em, ...)';
+
+$lang['__button_color__']           = 'Color for buttons';
+$lang['__button_background__']      = 'Backgroundcolor for buttons';

main.php

@@ -321,13 +321,27 @@ $showSidebar = page_findnearest($conf['sidebar']) && ($ACT=='show');
 
                         </div><!-- .main-content -->
 
+
+                        <div class="page-footer">
+                            <?php
+                                tpl_includeFile('pagefooter.html');
+
+
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/* 'Last modified' etc */
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
+                                tpl_pageinfo()
+                            ?>
+                        </div>
+
                     </div><!-- .col -->
                 </div><!-- .row -->
             </div><!-- .container -->
 
 
-            <?php tpl_flush() ?>
+            <?php
-            <?php tpl_includeFile('pagefooter.html') ?>
+                tpl_flush()
+            ?>
         </div><!-- /content -->
 
 
@@ -350,9 +364,9 @@ $showSidebar = page_findnearest($conf['sidebar']) && ($ACT=='show');
 
 
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
-/* 'Last modified' etc */
+/* copyright */
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
-                                tpl_pageinfo()
+                                echo "var - fixme";
                             ?>
                         </p>
                     </div>

style.ini

@@ -121,9 +121,12 @@ __highlight__           = "#efefef"              ; @ini_highlight
 ; + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
 
 ; these are used for links
-__existing__                = "#286da8"                                                 ; @ini_existing
+__existing__                = "#286DA8"                                                 ; @ini_existing
 __missing__                 = "#CD5360"                                                 ; @ini_missing
 
+__button_color__            = "#286DA8"
+__button_background__       = "#FFF"
+
 ; widths
 __site_width__              = "64em"                                                    ; @ini_site_width
 __sidebar_width__           = "16em"                                                    ; @ini_sidebar_width
@@ -139,10 +142,11 @@ __box_shadow__              = "0 0 .5em rgb(153,153,153,.5)"
 __box_shadow_offset__       = ".1em .1em .1em rgb(153,153,153,.5)"
 __nav_menu_color__          = "#696969"
 __nav_menu_hover_color__    = "#286da8"
-__nav_menu_hover_bg__       = "#FFFFFF"
+__nav_menu_hover_bg__       = "#FFF"
 
-__background_content__      = "#FFFFFF"
+__background_content__      = "#FFF"
 __background_site__         = "#ECECEC"
 
 __default_border_radius__   = "5px"
 
+__background_page-header__  = "#F9F9F9"