Merge branch 'master' into pageattributes

Adjusted some more files to account for changes in the over 100 commits
in master since the creation of this branch.

SPR-869

.gitlab-ci.yml

@@ -1,5 +1,15 @@
 sprintdoc-farm:
   environment: sprintdoc-farm
+  tags:
+    - locally
+  only:
+    - live
+  script:
+    - fab deploy
+    
+
+cosmocode-farm:
+  environment: cosmocode-farm
   tags:
     - locally
   only:

Template.php

@@ -17,6 +17,7 @@ class Template {
     protected $plugins = array(
         'sqlite' => null,
         'tagging' => null,
+        'magicmatcher' => null,
     );
 
     /**
@@ -35,6 +36,36 @@ class Template {
      */
     protected function __construct() {
         $this->initializePlugins();
+
+        /** @var \Doku_Event_Handler */
+        global $EVENT_HANDLER;
+        $EVENT_HANDLER->register_hook('PLUGIN_TPLINC_LOCATIONS_SET', 'BEFORE', $this, 'registerIncludes');
+    }
+
+    /**
+     * Makes include position info available to the tplinc plugin
+     *
+     * @param \Doku_Event $event
+     */
+    public function registerIncludes(\Doku_Event $event) {
+        $event->data['footer'] = 'Footer below the page content';
+    }
+
+    /**
+     * Get the content to include from the tplinc plugin
+     *
+     * prefix and postfix are only added when there actually is any content
+     *
+     * @param string $location
+     * @param string $pre prepend this before the content
+     * @param string $post append this to the content
+     * @return string
+     */
+    public function getInclude($location, $pre = '', $post = '') {
+        if(!$this->plugins['tplinc']) return '';
+        $content = $this->plugins['tplinc']->renderIncludes($location);
+        if($content === '') return '';
+        return $pre . $content . $post;
     }
 
     /**
@@ -44,7 +75,9 @@ class Template {
         $this->plugins['sqlite'] = plugin_load('helper', 'sqlite');
         if($this->plugins['sqlite']) {
             $this->plugins['tagging'] = plugin_load('helper', 'tagging');
+            $this->plugins['magicmatcher'] = plugin_load('syntax', 'magicmatcher_issuelist');
         }
+        $this->plugins['tplinc'] = plugin_load('helper', 'tplinc');
     }
 
     /**
@@ -75,7 +108,14 @@ class Template {
             );
         }
 
-        // fixme add magicmatcher info
+        if ($this->plugins['magicmatcher']) {
+            $tabs[] = array(
+                'id' => 'spr__tab-issues',
+                'label' => tpl_getLang('tab_issues'),
+                'tab' => $this->plugins['magicmatcher']->getIssueListHTML(),
+                'count' =>  $this->plugins['magicmatcher']->getCountIssues(),
+            );
+        }
 
         return $tabs;
     }

css/area_content.less

@@ -21,8 +21,8 @@
                 height: @page-header_height;
                 box-sizing: border-box;
                 width: 100%;
-                background-color: @background_page-header;
-                border-bottom: 1px solid @color-border-light;
+                background-color: @ini_background_page_header;
+                border-bottom: 1px solid @ini_border_light;
             }
 
             #plugin__highlightparent {
@@ -33,28 +33,6 @@
 }
 
 
-
-.structaggregation {
-    td,
-    th {
-        line-height: @line-height-default;
-
-        a {
-
-            line-height: @line-height-default;
-        }
-    }
-
-    > a.export {
-        line-height: 135%;
-        padding-top: .5em;
-    }
-}
-
-.dokuwiki .structaggregation a.export {
-    padding-top: .3em;
-}
-
 .main-content > .level2,
 .main-content > .level1,
 .main-content > .level3,

css/area_footer.less

@@ -11,48 +11,69 @@
 @media screen {
     .page-footer {
         min-height: @page-header_height;
-        background-color: @background_page-header;
-        border-top: 1px solid @color-border-light;
+        background-color: @ini_background_page_header;
+        border-top: 1px solid @ini_border_light;
+        border-radius: 0 0 @fix_border-radius @fix_border-radius; // @ini_default_border_radius vs. @fix_border-radius
+        color: @ini_background_page_footer;
         font-size: @font-size-default;
         text-align: right;
         padding: @margin-small @margin-default;
+
+        *,
+        a:link,
+        a:visited {
+            color: inherit;
+        }
+
         bdi {
             font-weight: bold;
         }
     }
+
     #dokuwiki__footer {
         .main-footer {
             position: relative;
             z-index: 2;
             box-sizing: border-box;
-            background-color: @color-site-bg;
-
+            background-color: @ini_background;
         }
+
         p {
+            color: @ini_text_webframe;
             font-size: @font-size-default;
             margin: 0;
         }
+
+        a {
+            color: @ini_nav_menu_color;
+        }
     }
 }
+
+
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* min-width: 1024px */
+
 @media @screen_min-md {
     #dokuwiki__footer {
         .col-xs-12 {
             float: right;
             width: 100%;
         }
+
         .main-footer {
             padding: @margin-default 0;
         }
     }
+
     .showSidebar {
         #dokuwiki__footer {
             .col-xs-12 {
-                width: 73%;
+                width: @ini_site_width;
             }
         }
     }
+
     .wide-content {
         &.showSidebar {
             #dokuwiki__footer {
@@ -63,8 +84,11 @@
         }
     }
 }
+
+
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* max-width: 1023px */
+
 @media @screen_max-md {
     #dokuwiki__footer {
         .main-footer {
@@ -73,3 +97,38 @@
         }
     }
 }
+
+
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/* max-width: 768px */
+
+@media @screen_max-xs {
+    .page-footer {
+        padding-left: @margin-small;
+        padding-right: @margin-small;
+    }
+
+    #dokuwiki__footer {
+        .main-footer {
+            > * {
+                padding-left: 0;
+                padding-right: 0;
+            }
+        }
+    }
+}
+
+
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/* max-width: 480px */
+
+@media @screen_max-xxs {
+    #dokuwiki__footer {
+        .main-footer {
+            > * {
+                padding-left: @margin-small;
+                padding-right: @margin-small;
+            }
+        }
+    }
+}

css/area_forms.less

@@ -0,0 +1,336 @@
+/**
+ * This file provides the design styles for forms.
+ *
+ * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
+ */
+
+
+/* for all of the form styles, style.ini colours are not used on purpose (except for fieldset border) */
+
+form {
+    display: inline;
+    margin: 0;
+    padding: 0;
+
+
+    // multiline label
+    fieldset > label.block > span:first-child {
+        display: inline-block;
+
+        @media @screen_min-lg {
+            width: 48.8%;
+        }
+
+        @media @screen_max-lg {
+            width: 48.5%;
+        }
+    }
+
+
+    // older version (history)
+    .dokuwiki & > .no > ul > li {
+        min-height: 2rem;
+        vertical-align: baseline;
+
+        a,
+        span,
+        img {
+            vertical-align: baseline;
+        }
+
+        img {
+            margin-left: 4px;
+            margin-right: 4px;
+        }
+
+        input[type="checkbox"] {
+            margin-bottom: .2rem;
+        }
+
+        span.user bdi {
+            a {
+                vertical-align: baseline;
+            }
+        }
+    }
+}
+
+fieldset {
+    font-size: @font-size-default;
+    line-height: 140%;
+    border: 1px solid @ini_text_alt;
+    padding: .7rem 1rem;
+
+    > :last-child {
+        margin-bottom: 0;
+    }
+
+    + p {
+        padding-top: 1rem;
+    }
+}
+
+legend {
+    margin: 0;
+    padding: 0 .1em;
+}
+
+label {
+    vertical-align: baseline;
+    cursor: pointer;
+}
+
+input,
+textarea,
+button,
+select,
+optgroup,
+option,
+keygen,
+output,
+meter,
+progress {
+    font: inherit;
+    font-weight: normal;
+    color: #333;
+    background-color: #fff;
+    line-height: normal;
+    margin: 0;
+    vertical-align: middle;
+    box-sizing: border-box;
+}
+
+select {
+    max-width: 100%;
+}
+
+textarea.edit {
+    font-size: @font-size-default;
+}
+
+optgroup {
+    font-style: italic;
+    font-weight: bold;
+}
+
+option {
+    font-style: normal;
+    font-weight: normal;
+}
+
+input,
+textarea,
+select,
+keygen {
+    min-height: @formfield_min-height;
+    border: 1px solid @ini_border;
+    box-shadow: inset 0 0 1px #eee;
+    border-radius: @fix_border-radius;
+    padding-left: .3rem;
+    padding-right: .3rem;
+}
+
+input:active,
+input:focus,
+textarea:active,
+textarea:focus,
+select:active,
+select:focus,
+keygen:active,
+keygen:focus {
+    border-color: #999;
+}
+
+input[type="radio"],
+input[type="checkbox"],
+input[type="image"] {
+    padding: 0;
+    border-style: none;
+    box-shadow: none;
+}
+
+input[type="file"] {
+    padding-top: .1rem;
+    padding-bottom: .1rem;
+}
+
+
+/* + + + + +  buttons  + + + + + */
+button {
+    background-color: #eee;
+    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc4MjQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRkZGRkYiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNGNEY0RjQiIG9mZnNldD0iMC4zIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0VFRUVFRSIgb2Zmc2V0PSIwLjk5Ii8+PHN0b3Agc3RvcC1jb2xvcj0iI0NDQ0NDQyIgb2Zmc2V0PSIuOTkiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnODI0KSIgLz4KPC9zdmc+);
+    background-image: linear-gradient(to bottom, #ffffff 0%, #f4f4f4 30%, #eeeeee 99%, #cccccc 99%);
+    border: 1px solid #ccc;
+    border-radius: @fix_border-radius;
+    color: #333;
+    padding: .1em .5em;
+    cursor: pointer;
+    transition: @transition background-color, @transition color;
+
+    &:hover,
+    &:focus,
+    &:active {
+        background-color: #ddd;
+        background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc2NzAiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRkZGRkYiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNGNEY0RjQiIG9mZnNldD0iMC4zIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0RERERERCIgb2Zmc2V0PSIwLjk5Ii8+PHN0b3Agc3RvcC1jb2xvcj0iI0JCQkJCQiIgb2Zmc2V0PSIuOTkiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnNjcwKSIgLz4KPC9zdmc+);
+        background-image: linear-gradient(to bottom, #ffffff 0%, #f4f4f4 30%, #dddddd 99%, #bbbbbb 99%);
+        border-color: #999;
+    }
+}
+
+
+/* + + +  all types of submit-buttons  + + + */
+form input[type=submit], // heredity 'adnewpage'
+a.button,
+input[type=submit],
+input[type=reset],
+button[type=submit],
+.qq-upload-button {
+    cursor: pointer;
+    box-shadow: none;
+    background-image: none;
+    background-color: @ini_button_background;
+    border: 1px solid @ini_button_background;
+    border-radius: @fix_border-radius;
+    color: @ini_button_color;
+    vertical-align: top;
+    padding: .3em @grid;
+    transition: @transition background-color, @transition color;
+
+    &:hover,
+    &:active,
+    &:focus {
+        background-color: @ini_button_color;
+        color: @ini_button_background;
+    }
+}
+
+button[type='reset'] {
+    min-height: 2rem;
+    vertical-align: middle;
+    padding: .3em 1rem;
+}
+
+input[type=submit],
+button[type=submit] {
+    min-height: 2rem;
+    vertical-align: middle;
+
+    &[disabled] {
+        cursor: default;
+
+        &:hover,
+        &:active,
+        &:focus {
+            box-shadow: none;
+            background-image: none;
+            background-color: @ini_button_background;
+            color: @ini_button_color;
+            border-color: @ini_button_background;
+        }
+    }
+
+    + span {
+        display: block;
+        margin-top: @grid;
+    }
+}
+
+
+/* + + +  all types of buttons not being submit-buttons  + + + */
+input.button,
+input[type=button] {
+    cursor: pointer;
+    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc4MjQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRkZGRkYiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNGNEY0RjQiIG9mZnNldD0iMC4zIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0VFRUVFRSIgb2Zmc2V0PSIwLjk5Ii8+PHN0b3Agc3RvcC1jb2xvcj0iI0NDQ0NDQyIgb2Zmc2V0PSIuOTkiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnODI0KSIgLz4KPC9zdmc+);
+    background-image: linear-gradient(to bottom, #ffffff 0%, #f4f4f4 30%, #eeeeee 99%, #cccccc 99%);
+    background-color: #eee;
+    border: 1px solid #ccc;
+    border-radius: @fix_border-radius;
+    color: #333;
+    padding: .1em .5em;
+    transition: @transition background-color, @transition color;
+
+    &:hover,
+    &:active,
+    &:focus {
+        background-color: #ddd;
+        border-color: #999;
+        background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc2NzAiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRkZGRkYiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNGNEY0RjQiIG9mZnNldD0iMC4zIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0RERERERCIgb2Zmc2V0PSIwLjk5Ii8+PHN0b3Agc3RvcC1jb2xvcj0iI0JCQkJCQiIgb2Zmc2V0PSIuOTkiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnNjcwKSIgLz4KPC9zdmc+);
+        background-image: linear-gradient(to bottom, #ffffff 0%, #f4f4f4 30%, #dddddd 99%, #bbbbbb 99%);
+    }
+}
+
+
+/* + + +  all disabled buttons  + + + */
+input[disabled],
+button[disabled],
+select[disabled],
+textarea[disabled],
+option[disabled],
+input[readonly],
+button[readonly],
+select[readonly],
+textarea[readonly] {
+    cursor: auto;
+    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc4MjQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRkZGRkYiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNGNEY0RjQiIG9mZnNldD0iMC4zIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0VFRUVFRSIgb2Zmc2V0PSIwLjk5Ii8+PHN0b3Agc3RvcC1jb2xvcj0iI0NDQ0NDQyIgb2Zmc2V0PSIuOTkiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnODI0KSIgLz4KPC9zdmc+);
+    background-image: linear-gradient(to bottom, #ffffff 0%, #f4f4f4 30%, #eeeeee 99%, #cccccc 99%);
+    background-color: #eee;
+    opacity: .5;
+    border: 1px solid @ini_border;
+    border-radius: @fix_border-radius;
+    color: #333;
+    font-weight: normal;
+    padding: .3em @grid;
+    transition: @transition background-color, @transition color;
+
+    &:hover,
+    &:active,
+    &:focus {
+        background-color: #ddd;
+        background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc2NzAiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRkZGRkYiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNGNEY0RjQiIG9mZnNldD0iMC4zIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0RERERERCIgb2Zmc2V0PSIwLjk5Ii8+PHN0b3Agc3RvcC1jb2xvcj0iI0JCQkJCQiIgb2Zmc2V0PSIuOTkiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnNjcwKSIgLz4KPC9zdmc+);
+        background-image: linear-gradient(to bottom, #ffffff 0%, #f4f4f4 30%, #dddddd 99%, #bbbbbb 99%);
+        border-color: #999;
+        color: #333;
+    }
+}
+
+input::-moz-focus-inner,
+button::-moz-focus-inner {
+    border: 0;
+    padding: 0;
+}
+
+
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/* media queries - Styles for auth forms */
+
+@media @screen_max-xs {
+    .tpl_sprintdoc {
+        #dw__login,
+        #dw__register,
+        #dw__resendpwd {
+            fieldset {
+                width: 100%;
+
+                label.block {
+                    text-align: left;
+
+                    > span:first-child {
+                        width: 100%;
+                    }
+
+                    input.edit {
+                        width: 100%;
+                        margin-top: .5rem;
+                    }
+                }
+            }
+        }
+
+        #dw__login {
+            label[for="remember__me"] {
+                width: 100%;
+                margin-left: 0;
+            }
+        }
+    }
+}

css/area_header.less

@@ -3,45 +3,151 @@
  *
  * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
  */
+
+
 #dokuwiki__header {
+    @header-font-opacity: 1;
 
-    .menu-togglelink {
-        border: 1px solid @color-border;
-        border-radius: @border-radius;
-        text-align: center;
-        margin: @very-small-spacing -(@very-small-spacing) 0 0;
-
-        font-size: @font-size-small;
-        min-height: 2em;
-        min-width: 2em;
-        box-sizing: border-box;
-        line-height: 2em;
-
-        cursor: pointer;
-        background-color: #fff;
-        text-decoration: none;
-        transition: @transition color, @transition background-color, @transition border-color;
-
-
-        svg {
-            height: @font-size-default + (@font-scale-factor * 4);
-            width: @font-size-default + (@font-scale-factor * 4);
+/* + + +  wiki logo  + + + */
+    @media @screen_min-md {
+        div.claim {
+            display: table-cell;
+            height: 100%;
             vertical-align: middle;
-            path {
-                fill: @color-nav
-            }
         }
 
-        &:hover,
-        &:active,
-        &:focus {
-            background-color: @button_color;
-            border-color: @button_background;
-            svg path {
-                fill: @button_background;
+        .logo {
+            padding: 1rem 0 .3rem;
+
+            img {
+                height: 4.6rem;
+                width: auto;
+                border-style: solid;
+                border-color: transparent;
+                border-width: 2px 0;
+            }
+
+            a:hover,
+            a:focus,
+            a:active {
+                img {
+                    border-width: 0;
+                }
             }
         }
-
     }
 
+    @media @screen_max-md {
+        .logo {
+            display: table-cell;
+
+            .mobile-only {
+                margin: .8rem 1rem .6rem 0;
+            }
+        }
+    }
+
+
+/* + + +  wiki title + claim  + + + */
+    .main-title.desktop-only {
+        @media @screen_min-md {
+            display: table-cell;
+            vertical-align: middle;
+        }
+
+        @media @screen_max-md {
+            display: block;
+        }
+
+        p.title {
+            @media @screen_max-md {
+                display: none;
+            }
+        }
+
+        p.claim {
+            @media @screen_max-md {
+                display: block;
+                padding-bottom: 1rem;
+            }
+        }
+    }
+
+    .main-title:not([class*="desktop-only"]) {
+        @media @screen_max-md {
+            display: table-cell;
+            vertical-align: middle;
+        }
+    }
+
+
+/* + + +  wiki title  + + + */
+    p.title {
+        background-color: @ini_background;
+        opacity: @header-font-opacity;
+        color: @ini_text_webframe;
+        line-height: @line-height-default;
+        margin-bottom: .5rem;
+
+        @media @screen_min-md {
+            font-size: @font-size-big;
+        }
+
+        @media @screen_max-md {
+            font-size: (@font-size-default + .25);
+            padding-top: .5rem;
+            padding-left: 1rem;
+        }
+    }
+
+
+/* + + +  wiki claim  + + + */
+    p.claim {
+        opacity: @header-font-opacity;
+        color: @ini_text_webframe;
+        font-size: @font-size-default;
+        margin-bottom: 0;
+
+        @media @screen_max-md {
+            padding-top: .5rem;
+        }
+    }
+
+
+/* + + +  mobile nav togglelink  + + + */
+    .menu-togglelink {
+        margin: .45rem -(@very-small-spacing) 0 0;
+
+        a {
+            .fontello();
+            .icon-menu();
+
+            display: block;
+            min-height: @toggle-size;
+            min-width: @toggle-size;
+            box-sizing: border-box;
+            background-color: #fff;
+            border: 1px solid @ini_border;
+            border-radius: @ini_default_border_radius; // @ini_default_border_radius vs. @fix_border-radius
+            color: @ini_nav_menu_color;
+            font-size: 1rem;
+            text-align: center;
+            text-decoration: none;
+            line-height: 1;
+            transition: @transition color, @transition background-color, @transition border-color;
+
+            &::before {
+                font-size: 1.5rem;
+                margin: .1rem 0 0;
+            }
+
+            &:hover,
+            &:active,
+            &:focus {
+                background-color: @ini_nav_menu_hover_bg;
+                border-color: @ini_nav_menu_hover_color;
+                color: @ini_nav_menu_hover_color;
+            }
+        }
+    }
 }

css/area_main-content-secedit.less

@@ -1,33 +1,33 @@
 /**
  * This styles the section editing buttons and highlighting
  */
-#dokuwiki__content.main-content {
-    @button-margin: .5rem; // FIXME shouldn't we have something in our base.less for this?
 
+
+#dokuwiki__content.main-content {
     div.section_highlight {
-        clear: right; // FIXME why?
+        clear: right;
         background: repeating-linear-gradient(
             -45deg,
-            transparent,
-            transparent 10px,
-            @ini_background_alt 10px,
-            @ini_background_alt 20px,
+            @highlight-odd-ini_text,
+            @highlight-odd-ini_text 10px,
+            @highlight-even-ini_text 10px,
+            @highlight-even-ini_text 20px,
         );
-    }
-
-    .secedit button {
-        clear: both;
-        font-size: 100%;
-        margin-top: @button-margin;
-        margin-bottom: @button-margin;
+        border-color: @ini_background_page_header;
     }
 
     .editbutton_section {
-        float: right;
-        margin-top: 0;
         position: relative;
         z-index: 2;
         top: 0;
+        float: right;
+        margin-top: 0;
+
+        form div.no {
+            button {
+                padding-right: 0;
+            }
+        }
 
         button {
             background-color: transparent;
@@ -36,20 +36,30 @@
 
             &::after {
                 content: '';
+                float: right;
                 display: inline-block;
-                background: transparent url("svg.php?svg=pencil.svg&f=link") center center no-repeat;
+                background: transparent url("svg.php?svg=pencil.svg&f=existing") center center no-repeat;
                 height: 1em;
                 width: 1em;
                 background-size: contain;
-                margin-left: @button-margin;
+                border: solid 2px transparent;
+                border-radius: @ini_default_border_radius;
+                margin-left: @small-spacing;
+                margin-top: -1px;
             }
 
             &:hover,
             &:active,
             &:focus {
-                background-color: @button_color;
-                color: @button_background;
-                border-color: @button_background;
+                //background-color: @ini_existing;
+                color: @ini_existing;
+                //border-color: @ini_existing;
+
+                &::after {
+                    background-color: @ini_existing;
+                    background-image: url("svg.php?svg=pencil.svg&f=background_content");
+                    border-color: @ini_existing;
+                }
             }
         }
     }

css/area_main-content.less

@@ -4,39 +4,52 @@
  * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
  */
 
-#dokuwiki__content.main-content {
 
+#dokuwiki__content.main-content {
     .level2 {
         p a.media {
             img {
-                border: 1px dotted @color-site-bg;
+                border: 1px dotted @ini_background;
 
             }
-            &:hover, &:focus, &:active {
+            &:hover,
+            &:focus,
+            &:active {
                 img {
-                    border: 1px solid @color-link;
+                    border: 1px solid @ini_existing;
                 }
             }
+        }
+    }
 
+    > div,
+    .section_highlight > div {
+        > ul,
+        > ol {
+            &:not([class="tabs"]) > li {
+                margin-bottom: @small-spacing;
+            }
         }
     }
 
     .wikipagefooter {
         > hr {
             margin-top: 3em;
-            margin-bottom: 0.5em;
-            border-top: dashed @color-border-light 2px;
+            margin-bottom: .5em;
+            border-top: dashed @ini_border_light 2px;
             border-bottom: none;
         }
     }
 }
 
+
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* min-width: 1440px */
 
 @media @screen_min-xlg {
 }
 
+
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* max-width: 1199px */
 

css/area_main-sidebar-content.less

@@ -1,14 +1,18 @@
 /**
  * This file provides the design styles the non-navigational elements in the sidebar
  */
+
+
 #dokuwiki__aside {
 
     // do not indent the first level of lists
     // and use less indention in deeper levels
-    ul, ol {
+    ul,
+    ol {
         padding-left: 0;
 
-        ul, ol {
+        ul,
+        ol {
             padding-left: @margin-small;
 
             li {
@@ -17,3 +21,41 @@
         }
     }
 }
+
+
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/* max-width: 1023px */
+
+@media @screen_max-md {
+    #dokuwiki__aside {
+        display: none;
+    }
+
+    body.show-mobile-sidebar {
+        #dokuwiki__aside {
+            display: block !important;
+            position: absolute;
+            left: 1.25rem; //left margin of content container
+            z-index: 200; // above all
+            box-shadow: @box-shadow-right-bottom;
+            min-width: 45%;
+            max-width: 90%;
+            height: auto;
+
+            &:after {
+                content: "";
+                position: absolute;
+                top: 0;
+                left: 0;
+                bottom: 0;
+                right: 0;
+                width: 100%;
+                height: 100%;
+                background: @ini_background;
+                background: -webkit-linear-gradient(left, @ini_background, @ini_background_content);
+                background: linear-gradient(left, @ini_background, @ini_background_content);
+                z-index: 0;
+            }
+        }
+    }
+}

css/area_main-sidebar-nav.less

@@ -4,36 +4,101 @@
  * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
  * @author Andreas Gohr <gohr@cosmocode.de>
  */
+
+
 #dokuwiki__aside {
     @icon-size: @font-size-big;
     @menu-margin: @icon-size + @margin-small*2; // FIXME this is still wrong
 
+    nav > p,
+    .mmissuelist li,
+    .mmissuelist div {
+        color: @ini_nav_menu_color;
+
+        &.noissue {
+            color: @ini_text_webframe;
+
+            * {
+                color: inherit;
+            }
+        }
+    }
+
+    nav {
+        li {
+            color: @ini_nav_menu_color;
+
+            > div {
+                color: @ini_text_webframe;
+            }
+        }
+    }
+
+
+    /* jira itemlist */
+    .mmissuelist {
+        li {
+            &.noissue {
+                list-style-type: none;
+                margin-left: 0;
+            }
+
+            a {
+                display: inline-block;
+            }
+        }
+
+        img {
+            vertical-align: bottom;
+            margin-right: .3rem;
+        }
+
+        .mm__status {
+            padding-left: .3rem;
+            padding-right: .3rem;
+        }
+
+        form {
+            vertical-align: text-top;
+        }
+    }
+
     > * {
         margin-left: @menu-margin; // moves *all* sidebar content to the right
     }
 
+    a {
+        &:link,
+        &:visited {
+            opacity: .9;
+            color: @ini_nav_menu_color;
+        }
+
+        * {
+            color: inherit;
+        }
+    }
+
     // the toggle element
     a.nav {
-        font-size: @font-size-head6;
-        margin: 0 0 @font-size-head6;
+        .display-flex();
+        .align-items();
+
         cursor: pointer;
-        font-weight: normal;
-        margin-left: (@menu-margin * -1); // moves the toggles back to the left
-        color: @color-nav;
+        height: @icon-size + @margin-small;
+        opacity: 1;
         border: 1px solid transparent;
         border-radius: @fix_border-radius;
+        color: @ini_nav_menu_color;
+        font-size: @font-size-head6;
+        font-weight: normal;
+        margin: -1px 0 (@font-size-head6 / 2) (@menu-margin * -1); // moves the toggles back to the left
         transition: @transition color, @transition background-color, @transition border-color;
 
-        height: @icon-size + @margin-small;
-        display: flex;
-        display: -ms-flexbox;
-        flex-direction: row;
-        -ms-flex-direction: row;
-        align-items: center;
-
         span {
             display: inline-block;
             vertical-align: middle;
+            color: inherit;
         }
 
         span.lbl {
@@ -44,10 +109,10 @@
             width: @menu-margin;
             height: @icon-size;
             flex-grow: 0;
-            border-right: 1px solid @color-border;
+            border-right: 1px solid @ini_nav_menu_color;
             text-align: center;
             margin-right: @margin-small;
-            color: @color-nav;
+            color: inherit;
 
             // simple fake icon
             strong {
@@ -59,19 +124,21 @@
                 margin: @icon-size * 0.05;
                 vertical-align: baseline;
                 text-align: center;
-                color: @color-nav;
-                border: 2px solid @color-nav;
+                color: inherit;
+                border: 2px solid @ini_nav_menu_color;
                 border-top-right-radius: 50%;
                 border-bottom-left-radius: 50%;
-
+                transition: @transition border-color;
             }
 
             // real icon
             svg {
                 width: @icon-size;
                 height: @icon-size;
+
                 path {
-                    fill: @color-nav;
+                    fill: @ini_nav_menu_color;
+                    transition: @transition all;
                 }
             }
         }
@@ -79,18 +146,23 @@
         &:hover,
         &:focus,
         &:active {
-            background-color: @button_color;
-            border-color: @button_background;
-            color: @button_background;
+            background-color: @ini_nav_menu_hover_bg;
+            border-color: @ini_nav_menu_hover_color;
+            color: @ini_nav_menu_hover_color;
             text-decoration: none;
 
-            span.ico strong {
-                color: @button_background;
-                border-color: @button_background;
-            }
+            span.ico {
+                border-color: inherit;
 
-            span.ico svg path {
-                fill: @button_background;
+                strong {
+                    border-color: inherit;
+                }
+
+                svg {
+                    path {
+                        fill: @ini_nav_menu_hover_color;
+                    }
+                }
             }
         }
     }
@@ -98,53 +170,97 @@
     // the panel (hidden by default)
     div.nav-panel {
         display: none;
+        margin-top: .5rem;
+
+        ul {
+            margin-bottom: 1rem;
+
+            ul {
+                margin-bottom: 0;
+            }
+        }
     }
 }
 
-/**
- * Sidebar handling in mobile view
- */
-@media @screen_max-md {
-    // hide on medium and smaller screens
+
+/* + + + + + +  wide page content  border-bottom between a.nav (short width)  + + + + +
+.wide-content {
     #dokuwiki__aside {
-        display: none;
-    }
+        a.nav {
+            position: relative;
 
-    // show when toggled
-    body.show-mobile-sidebar {
-
-        #dokuwiki__aside {
-            display: block;
-
-            position: absolute;
-            left: 1.25rem;//left margin of content container
-            z-index: 200; // above all
-            box-shadow: @box-shadow-right-bottom;
-            min-width: 45%;
-            max-width: 90%;
-            height: auto;
-
-            &:after{
-                content: "";
+            &::after {
+                content: '';
                 position: absolute;
-                top: 0;
-                left:0;
-                bottom:0;
-                right:0;
+                bottom: -1px;
+                left: 0;
                 width: 100%;
-                height: 100%;
-                background: @ini_background;
-                background: -webkit-linear-gradient(left, @ini_background, @color-content-bg);
-                background: linear-gradient(left, @ini_background, @color-content-bg);
-
-                z-index: 0;
+                height: 1px;
+                border-bottom: solid 1px @ini_border;
             }
 
-            > nav{
+            &:hover,
+            &:focus,
+            &:active {
+                &::after {
+                    display: none;
+                }
+            }
+        }
+    }
+} */
+
+
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/* min-width: 1440px */
+
+@media @screen_min-xlg {
+    #dokuwiki__aside {
+        nav {
+            li:not([class]),
+            .li {
+                font-size: @font-size-head6;
+                padding: .15em 0;
+
+                * {
+                    font-size: inherit;
+                    font-weight: inherit;
+                }
+
+                a {
+                    font-size: (@font-size-head6 - .05);
+                }
+            }
+        }
+    }
+}
+
+
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/* max-width: 1023px */
+
+@media @screen_max-md {
+    // show when toggled
+    body.show-mobile-sidebar {
+        .search.main-sidebar {
+            display: block !important;
+            position: relative;
+
+            form {
+                margin-bottom: 1rem;
+
+                .no {
+                    display: block;
+                }
+            }
+        }
+
+        #dokuwiki__aside {
+            > nav {
                 position: relative;
-                //display: block;
                 z-index: 2;
-                &:first-child{
+
+                &:first-child {
                     margin-top: 1.2rem;
                 }
             }
@@ -154,53 +270,23 @@
                 border-right-width: 0;
                 border-left-width: 0;
             }
+
             .nav-panel,
-            a.nav{
+            a.nav {
                 padding-right: .8em;
             }
         }
-
-
     }
-
 }
 
-// FIXME check if the stuff below is still relevant
 
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + */
-/* min-width: 1440px */
-
-@media @screen_min-xlg {
-    #dokuwiki__aside.main-sidebar {
-        .nav-main {
-            .li {
-                font-size: @font-size-default;
-                padding: .1em 0;
-
-                * {
-                    font-size: inherit;
-                    font-weight: inherit;
-                }
-            }
-
-            > ul > li > .li {
-                font-size: @font-size-default;
-
-                * {
-                    font-size: inherit;
-                }
-            }
-        }
-    }
-
-}
-
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
-/* max-width: 1199px */
+/* max-width: 1439px */
 
 @media @screen_max-xlg {
-    #dokuwiki__aside.main-sidebar {
-        .nav-main {
+    #dokuwiki__aside {
+        nav {
+            li:not([class]),
             .li {
                 font-size: @font-size-default;
                 padding: .15em 0 .15em .25rem;
@@ -210,14 +296,6 @@
                     font-weight: inherit;
                 }
             }
-
-            > ul > li > .li {
-                font-size: @font-size-default;
-
-                > * {
-                    font-size: inherit;
-                }
-            }
         }
     }
 }

css/area_msg.less

@@ -1,11 +1,39 @@
-.msg-area{
+.msg-area {
     clear: both;
     padding-top: 1.6rem;
-    div{
-        //font-size: .88rem;
+
+    div {
         line-height: 135%;
     }
-    &:empty{
+
+    &:empty {
         display: none;
     }
 }
+
+/* short fix: SPR-891 - Icons für Notifications in Message Area werden gekachelt */
+div.success, div.error, div.info, div.notify {
+    background-repeat: no-repeat;
+    background-position: 8px 50%;
+    border: 1px solid #eeb;
+    font-size: 90%;
+    margin: 0 0 .5em;
+    padding: .4em;
+    padding-left: 32px;
+    overflow: hidden;
+    border-radius: 5px;
+
+    * {
+        color: inherit;
+    }
+
+    a {
+        text-decoration: underline;
+
+        &:hover,
+        &:focus,
+        &:active {
+            text-decoration: none;
+        }
+    }
+}

css/area_nav-breadcrumb.less

@@ -1,19 +1,35 @@
 /**
- * This file provides the design styles for the direct / menu jump links.
+ * This file provides the design styles for the breadcrumb
  *
  * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
  */
 
+
 .breadcrumbs {
     position: relative;
-    border-bottom: 1px solid @color-border-light;
-    padding: 1rem 1.8rem .2rem;
     min-height: @page-header_height;
     box-sizing: border-box;
+    background-color: @ini_background_content;
+    border-bottom: 1px solid @ini_border_light;
+    padding: 1rem 1.8rem .2rem;
+
+    @media @screen_max-md {
+        background-color: @ini_background_page_header;
+    }
+
+    @media @screen_max-xs {
+        padding-left: @margin-small;
+        padding-right: .75rem;
+    }
+
+    @media @screen_xs-lg {
+        background-color: @ini_background_content;
+    }
 
     > p {
         font-size: @font-size-small;
         margin: 0;
+
         @media @screen_max-xs{
             width: 1px;
             position: relative;
@@ -31,9 +47,11 @@
 
         span.home {
             margin-left: -.2rem; // reverse spacing in home icon --> content text and home icon aligned
-            .wide-content &{
+
+            .wide-content & {
                 margin-left: .4rem; //toggle link has position absolute, hover on home icon needs more space than left padding of breadcrumb
             }
+
             a {
                 .fontello();
                 .hide-text-show-before();
@@ -44,7 +62,7 @@
                 width: auto;
                 box-sizing: border-box;
                 border: solid 1px transparent;
-                border-radius: @border-radius;
+                border-radius: @ini_default_border_radius; // @ini_default_border_radius vs. @fix_border-radius
                 vertical-align: middle;
                 text-decoration: none;
                 margin-top: -.2em;
@@ -58,7 +76,7 @@
                 &:hover,
                 &:focus,
                 &:active {
-                    border-color: @color-link;
+                    border-color: @ini_existing;
                 }
             }
         }
@@ -68,9 +86,3 @@
         }
     }
 }
-
-
-/* + + + + +  ?  + + + + + */
-.mode_admin {
-
-}

css/area_nav-direct.less

@@ -4,8 +4,9 @@
  * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
  */
 
+
 .nav-direct {
-    background-color: __nav_direct_background__;
+    background-color: @nav_direct_background;
     margin-top: -1px;
 
     p {
@@ -21,12 +22,12 @@
         a:visited {
             .sr-out();
 
-            box-shadow: __box_shadow__;
+            box-shadow: @box-shadow;
             display: block;
             width: 100%;
-            background-color: __nav_direct_background__;
-            border-bottom: 1px solid __shadow_color__;
-            color: __nav_direct_color__;
+            background-color: @nav_direct_background;
+            border-bottom: 1px solid @ini_border_light;
+            color: @nav_direct_color;
             line-height: @line-height-default;
             text-decoration: none;
             padding: 1em;

css/area_nav-metabox.less

@@ -1,20 +1,48 @@
+/**
+ * This file provides the design styles for the metatabbox
+ *
+ * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
+ */
+
+
 #spr__meta-box {
+    .display-flex();
+    .flex-direction();
+    .justify-content(flex-end);
+
     position: relative;
     z-index: 10;
-    display: inline-block;
-    min-height: @page-header_height;
-    max-width: 40%;
     float: right;
-    margin-top: @page_padding-top * -1; // reverse padding-top of .page container
-    padding-top: 1rem;
-    border: 1px solid transparent;
+    max-width: 40%;
+    margin-top: -(@page_padding-top); // reverse padding-top of .page container
+    margin-right: -1px;
+
+    // >= 1024
+    @media @screen_min-md {
+        height: @page-header_height;
+        border: 1px solid transparent;
+    }
+
+    // < 1024
+    @media @screen_max-md {
+        position: relative;
+        top: .2rem;
+        right: auto;
+        float: none;
+        display: block;
+        max-width: 100%;
+        min-height: @page-header_height;
+        height: auto;
+        border: 0 none;
+    }
 
     .tab-container {
         display: table;
-        @media @screen_max-md{
+
+        @media @screen_max-md {
+            display: block;
             width: 100%;
         }
-
     }
 
     .box-content {
@@ -23,21 +51,25 @@
         overflow-y: visible;
     }
 
+
+/* + + + + +  tab controlls  + + + + + */
     ul.meta-tabs {
         list-style: none;
-        background-color: @background_page-header;
-        @media @screen_max-md{
-            background-color: #fff;
-        }
+        line-height: 160%;
         margin: 0;
         padding: 0;
 
+        @media @screen_min-md {
+            white-space: nowrap;
+            text-align: right;
+        }
+
         &::before,
         &::after {
-            display: table;
-            content: " ";
-            box-sizing: border-box;
+            content: '';
             clear: both;
+            display: table;
+            box-sizing: border-box;
         }
 
         > li:first-child {
@@ -47,27 +79,45 @@
         }
 
         > li {
-            margin: 0 0 -1px;
             position: relative;
             display: inline-block;
+            vertical-align: bottom;
+            margin: 0;
+
+            @media @screen_min-md {
+                margin-left: .3rem;
+            }
+
+            @media @screen_max-md {
+                margin-right: .4rem;
+                margin-bottom: .2rem;
+            }
 
             > a {
                 cursor: pointer;
                 position: relative;
                 display: block;
-                background-color: @color-site-bg;
-                border: 1px solid @color-border-light;
-                border-bottom-color: @color-site-bg;
-                border-radius: @fix_border-radius @fix_border-radius 0 0;
-                color: @color-nav;
                 font-size: @font-size-small;
                 line-height: 1.42857143;
-                padding: .3em 1rem .1em;
-                margin-left: 4px;
-                transition: @transition color, @transition background-color, @transition border-color;
-                @media @screen_max-xs{
-                    padding: .3em .3rem .1em;
+                transition: @transition background-color, @transition border-color, @transition color;
+
+                @media @screen_min-md {
+                    background-color: @ini_background;
+                    border: 1px solid @noopentasks-border;
+                    border-bottom-color: @ini_background;
+                    border-radius: @ini_default_border_radius @ini_default_border_radius 0 0; // @ini_default_border_radius vs. @fix_border-radius
+                    color: @ini_nav_menu_color;
+                    margin-left: 4px;
+                    padding: .3em 1rem .1em;
+                }
+
+                @media @screen_max-md {
+                    top: 0;
+                    border: 1px solid @ini_existing;
+                    color: @ini_existing;
+                    margin-top: .2rem;
                     margin-left: 0;
+                    padding: .2em .3rem;
                 }
 
                 * {
@@ -77,20 +127,25 @@
 
                 .prefix {
                     position: relative;
-                    transition: @transition color;
+                    color: inherit;
                     font-size: @font-size-small;
                 }
 
                 &:hover,
                 &:focus,
                 &:active {
-                    background-color: @color-content-bg;
-                    border-color: @color-link;
-                    color: @color-link;
                     text-decoration: none;
 
-                    .prefix {
-                        color: inherit;
+                    @media @screen_min-md {
+                        background-color: @ini_background_content;
+                        border-color: @ini_existing;
+                        color: @ini_existing;
+                    }
+
+                    @media @screen_max-md {
+                        background-color: @ini_existing;
+                        border-color: @ini_background_content;
+                        color: @ini_background_content;
                     }
                 }
             }
@@ -100,43 +155,56 @@
 
                 > a {
                     cursor: default;
-                    background-color: @color-content-bg;
-                    border-color: @color-link;
-                    border-bottom-color: @color-content-bg;
-                    color: @color-link;
+                    background-color: @ini_background_content;
+                    border-color: @ini_existing;
+                    border-bottom-color: @ini_background_content;
+                    color: @ini_existing;
+
+                    @media @screen_max-md {
+                        background-color: @ini_existing;
+                        border-bottom-color: @ini_existing;
+                        border-radius: 0;
+                        color: @ini_background_content;
+                    }
                 }
             }
         }
     }
 
+
+/* + + + + +  toggle content  + + + + + */
     .meta-content {
-        margin-right: 1px;
         margin-top: -1px;
+
+        @media @screen_max-md {
+            clear: both;
+            margin-top: 2px;
+        }
+
         .tab-pane {
             position: absolute;
             top: 0;
             right: 0;
             display: none;
             width: 100%;
-            min-width: 20em;
-            background-color: @color-content-bg;
-            border: 1px solid @color-link;
-            border-top-color: transparent;
-            border-radius: 0 0 @fix_border-radius @fix_border-radius;
+            background-color: @ini_background_content;
+            border: 1px solid @ini_existing;
 
-            &::before {
-                content: '';
-                position: absolute;
-                top: -1px;
-                left: 0;
-                z-index: 0;
-                width: 100%;
-                height: 1px;
-                background-color: @color-link;
+            @media @screen_min-xs {
+                min-width: 20em;
+            }
+
+            @media @screen_min-md {
+                border-radius: 0 0 @fix_border-radius @fix_border-radius; // @ini_default_border_radius vs. @fix_border-radius
             }
 
             &.active {
                 display: block;
+                overflow: hidden;
+            }
+
+            a {
+                color: @ini_existing;
             }
 
             > div {
@@ -162,6 +230,16 @@
                 }
             }
 
+            &#spr__tab-tags {
+                > div {
+                    ul {
+                        li {
+                            padding-left: 0;
+                        }
+                    }
+                }
+            }
+
             #dw__toc {
                 width: auto;
                 float: none;
@@ -189,23 +267,20 @@
                         position: relative;
                     }
 
-                    li {
-                    }
-
                     div.li {
                         position: relative;
                         padding: .15em 0;
 
                         &::before {
+                            content: '';
                             position: absolute;
-                            top: .3em;
-                            content: "";
+                            top: .6em;
+                            left: 0;
                             display: inline-block;
                             width: 4px;
                             height: 4px;
-                            background-color: #ccc;
                             overflow: hidden;
-                            left: 0;
+                            background-color: @ini_existing;
                         }
                     }
                 }
@@ -221,25 +296,4 @@
         clear: right;
         margin-top: 20px;
     }
-
-    @media @screen_max-md{
-        max-width: 100%;
-        float: none;
-        display: block;
-        top: -1.1rem;
-        position: relative;
-        right: auto;
-        .tab-container{
-            display: block;
-        }
-        ul.meta-tabs{
-            > li > a{
-                margin-left: 0;
-            }
-        }
-        .meta-content{
-            clear: both;
-        }
-    }
 }
-

css/area_nav-page-attributes.less

@@ -20,11 +20,20 @@
         float: left;
         display: block;
         width: auto;
-        min-height: 2em;
-        border: 1px solid @color-border;
-        border-radius: @border-radius;
-        color: @color-nav;
+        min-height: @toggle-size;
+        border: 1px solid @wikiicons-border;
+        border-radius: @ini_default_border_radius;
         text-align: center;
-        margin: 0;
+        margin: 0 .25rem;
+
+        .prefix {
+            .btn-prefix ();
+            .icon-clipboard();
+
+            display: block;
+            font-size: 1.2rem;
+            line-height: 1;
+        }
+
     }
 }

css/area_nav-pagetools.less

@@ -18,200 +18,142 @@
 .pagetools-item(subscribe, 9, subscribe);
 .pagetools-item(mediaManager, 11);
 .pagetools-item(back, 12);
-.pagetools-item(img_backto, 12);*/
+.pagetools-item(img_backto, 12);
+*/
 
+#dokuwiki__aside {
+    @media @screen_max-md {
+        display: none !important;
+    }
+}
+
+nav#dokuwiki__pagetools {
+    @toolbox-size: 30px;
 
-nav#dokuwiki__pagetools{
-    right: -(@margin-default);
     top: 3.05rem;
     z-index: 100;
+
+    @media @screen_min-md {
+        right: -2.5rem;
+    }
+
+    @media @screen_max-md {
+        right: 8px;
+    }
+
     ul {
         li {
+            @page-tools_svg-size: 25px;
+            @page-tools_svg-space: (@toolbox-size - @page-tools_svg-size) / 2;
 
-            *{
+            * {
                 font-size: @font-size-default;
             }
-            &.plugin_move_page{
-                a{
-                    opacity: .6;
-                    color: @color-nav;
-                    *{
-                        color: @color-nav;
-                    }
 
-                    background: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSIxMDAwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGZpbGw9InJnYigxMDUsMTA1LDEwNSkiIGQ9Ik05NDYuNCAyMTQuM3EyMi40IDAgMzggMTUuNnQxNS42IDM4djY3OC41cTAgMjIuMyAtMTUuNiAzOHQtMzggMTUuNkg0MTAuN3EtMjIuMyAwIC0zNy45IC0xNS42dC0xNS43IC0zOFY3ODUuN0g1My42cS0yMi40IDAgLTM4IC0xNS42VDAgNzMyLjF2LTM3NVEwIDMzNC44IDExLjIgMzA4dDI2LjcgLTQyLjRMMjY1LjYgMzcuOVEyODEuMyAyMi4zIDMwOCAxMS4yVDM1Ny4xIDBoMjMyLjJxMjIuMyAwIDM3LjkgMTUuNnQxNS43IDM4djE4M3EzNy45IC0yMi4zIDcxLjQgLTIyLjNoMjMyLjF6TTY0Mi45IDMzMy4xTDQ3NiA1MDBoMTY2LjlWMzMzLjF6TTI4NS43IDExOC45TDExOC45IDI4NS43aDE2Ni44VjExOC45em0xMDkuNCAzNjFMNTcxLjQgMzAzLjZWNzEuNEgzNTcuMXYyMzIuMnEwIDIyLjMgLTE1LjYgMzcuOXQtMzcuOSAxNS42SDcxLjR2MzU3LjJoMjg1LjdWNTcxLjRxMCAtMjIuMyAxMS4yIC00OS4xdDI2LjggLTQyLjR6bTUzMy41IDQ0OC43VjI4NS43SDcxNC4zdjIzMi4ycTAgMjIuMyAtMTUuNiAzNy45dC0zOCAxNS42SDQyOC42djM1Ny4yaDUwMHoiLz48L3N2Zz4=) 95% center no-repeat;
-                    background-size: @font-size-head2 auto;
-                    &:before{
-                        visibility: hidden;
-                    }
+            a {
+                .fontello-double();
 
-                    &:hover, &:focus, &:active{
-                        opacity: 1;
-                        color: @color-nav-hover;
-                        background-color: #fff;
-                        background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSIxMDAwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGZpbGw9InJnYig0MCwxMDksMTY4KSIgZD0iTTk0Ni40IDIxNC4zcTIyLjQgMCAzOCAxNS42dDE1LjYgMzh2Njc4LjVxMCAyMi4zIC0xNS42IDM4dC0zOCAxNS42SDQxMC43cS0yMi4zIDAgLTM3LjkgLTE1LjZ0LTE1LjcgLTM4Vjc4NS43SDUzLjZxLTIyLjQgMCAtMzggLTE1LjZUMCA3MzIuMXYtMzc1UTAgMzM0LjggMTEuMiAzMDh0MjYuNyAtNDIuNEwyNjUuNiAzNy45UTI4MS4zIDIyLjMgMzA4IDExLjJUMzU3LjEgMGgyMzIuMnEyMi4zIDAgMzcuOSAxNS42dDE1LjcgMzh2MTgzcTM3LjkgLTIyLjMgNzEuNCAtMjIuM2gyMzIuMXpNNjQyLjkgMzMzLjFMNDc2IDUwMGgxNjYuOVYzMzMuMXpNMjg1LjcgMTE4LjlMMTE4LjkgMjg1LjdoMTY2LjhWMTE4Ljl6bTEwOS40IDM2MUw1NzEuNCAzMDMuNlY3MS40SDM1Ny4xdjIzMi4ycTAgMjIuMyAtMTUuNiAzNy45dC0zNy45IDE1LjZINzEuNHYzNTcuMmgyODUuN1Y1NzEuNHEwIC0yMi4zIDExLjIgLTQ5LjF0MjYuOCAtNDIuNHptNTMzLjUgNDQ4LjdWMjg1LjdINzE0LjN2MjMyLjJxMCAyMi4zIC0xNS42IDM3Ljl0LTM4IDE1LjZINDI4LjZ2MzU3LjJoNTAweiIvPjwvc3ZnPg==);
-
-                        *{
-                            color: @color-nav-hover;
-                        }
-                        background-position: 95% center;
-                        &::before{
-                            visibility: visible;
-                        }
-                    }
-                }
-            }
-
-            a{
+                position: relative;
+                height: auto;
+                min-height: @toolbox-size; // for nav:hover
+                width: @toolbox-size; // for nav:hover
                 font-size: @font-size-default;
-                &.source, &.revs, &.backlink, &.plugin_bookcreator_addtobook, &.export_pdf, &.top, &.edit, &.show{
-                    opacity: .6;
-                    color: @color-nav;
-                    *{
-                        color: @color-nav;
+                padding: 2px @toolbox-size 2px 2px;
+
+                @media @screen_min-md {
+                    color: @ini_nav_menu_color;
+                }
+
+                @media @screen_max-md {
+                    color: @ini_existing;
+                }
+
+                * {
+                    color: inherit;
+                }
+
+                &::before {
+                    display: none;
+                }
+
+                &:hover,
+                &:focus,
+                &:active {
+                    background-color: transparent;
+                }
+
+                span {
+                    .sr-only();
+
+                    padding-right: .5rem;
+                    padding-left: .3rem;
+                }
+
+                svg {
+                    display: inline-block;
+                    width: @page-tools_svg-size;
+                    height: @page-tools_svg-size;
+                    vertical-align: middle;
+                    border: solid 1px transparent;
+                    margin: @page-tools_svg-space;
+
+                    @media @screen_min-md {
+                        fill: @ini_nav_menu_color;
                     }
-                    background-position: 95% center;
-                    background-size: @font-size-head2 auto;
-                    &:before{
-                        visibility: hidden;
-                    }
-                    &:hover, &:focus, &:active{
-                        opacity: 1;
-                        color: @color-nav-hover;
-                        background-color: #fff;
-                        *{
-                            color: @color-nav-hover;
-                        }
-                        background-position: 95% center;
-                        &::before{
-                            visibility: visible;
-                        }
+
+                    @media @screen_max-md {
+                        fill: @ini_existing;
                     }
                 }
 
-                &.source{
-                    background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSIxMDcxLjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0icmdiKDEwNSwxMDUsMTA1KSIgZD0iTTM0NC4zIDc4MC43bC0yNy45IDI3LjlxLTUuNiA1LjYgLTEyLjggNS42dC0xMi45IC01LjZMMzAuNyA1NDguNVEyNS4xIDU0MyAyNS4xIDUzNS43dDUuNiAtMTIuOGwyNjAgLTI2MC4xcTUuNiAtNS41IDEyLjkgLTUuNXQxMi44IDUuNWwyNy45IDI3LjlxNS42IDUuNiA1LjYgMTIuOXQtNS42IDEyLjhMMTI1IDUzNS43IDM0NC4zIDc1NXE1LjYgNS42IDUuNiAxMi45dC01LjYgMTIuOHpNNjc0LjEgMTg1LjNMNDY2IDkwNS43cS0yLjMgNy4yIC04LjcgMTAuOXQtMTMuMSAxLjRsLTM0LjYgLTkuNXEtNy4zIC0yLjIgLTEwLjkgLTguN3QtMS40IC0xMy42TDYwNS41IDE2NS43cTIuMiAtNy4yIDguNiAtMTAuOHQxMy4xIC0xLjRsMzQuNiA5LjRxNy4zIDIuMyAxMC45IDguN3QxLjQgMTMuN3ptMzY2LjYgMzYzLjJsLTI2MCAyNjAuMXEtNS42IDUuNiAtMTIuOCA1LjZUNzU1IDgwOC42bC0yNy45IC0yNy45cS01LjYgLTUuNiAtNS42IC0xMi44dDUuNiAtMTIuOUw5NDYuNCA1MzUuNyA3MjcuMSAzMTYuNHEtNS42IC01LjYgLTUuNiAtMTIuOHQ1LjYgLTEyLjlMNzU1IDI2Mi44cTUuNiAtNS41IDEyLjkgLTUuNXQxMi44IDUuNWwyNjAgMjYwLjFxNS42IDUuNiA1LjYgMTIuOHQtNS42IDEyLjh6Ii8+PC9zdmc+);
-                    &:hover, &:focus, &:active{
-                        background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSIxMDcxLjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0icmdiKDQwLDEwOSwxNjgpIiBkPSJNMzQ0LjMgNzgwLjdsLTI3LjkgMjcuOXEtNS42IDUuNiAtMTIuOCA1LjZ0LTEyLjkgLTUuNkwzMC43IDU0OC41UTI1LjEgNTQzIDI1LjEgNTM1Ljd0NS42IC0xMi44bDI2MCAtMjYwLjFxNS42IC01LjUgMTIuOSAtNS41dDEyLjggNS41bDI3LjkgMjcuOXE1LjYgNS42IDUuNiAxMi45dC01LjYgMTIuOEwxMjUgNTM1LjcgMzQ0LjMgNzU1cTUuNiA1LjYgNS42IDEyLjl0LTUuNiAxMi44ek02NzQuMSAxODUuM0w0NjYgOTA1LjdxLTIuMyA3LjIgLTguNyAxMC45dC0xMy4xIDEuNGwtMzQuNiAtOS41cS03LjMgLTIuMiAtMTAuOSAtOC43dC0xLjQgLTEzLjZMNjA1LjUgMTY1LjdxMi4yIC03LjIgOC42IC0xMC44dDEzLjEgLTEuNGwzNC42IDkuNHE3LjMgMi4zIDEwLjkgOC43dDEuNCAxMy43em0zNjYuNiAzNjMuMmwtMjYwIDI2MC4xcS01LjYgNS42IC0xMi44IDUuNlQ3NTUgODA4LjZsLTI3LjkgLTI3LjlxLTUuNiAtNS42IC01LjYgLTEyLjh0NS42IC0xMi45TDk0Ni40IDUzNS43IDcyNy4xIDMxNi40cS01LjYgLTUuNiAtNS42IC0xMi44dDUuNiAtMTIuOUw3NTUgMjYyLjhxNS42IC01LjUgMTIuOSAtNS41dDEyLjggNS41bDI2MCAyNjAuMXE1LjYgNS42IDUuNiAxMi44dC01LjYgMTIuOHoiLz48L3N2Zz4=);
-                    }
-                }
-                &.edit{
-                    background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSI4MzAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0icmdiKDEwNSwxMDUsMTA1KSIgZD0iTTc5NSAxMTkuMDY5YzUwIDQ2LjI1IDQzLjc1IDExNy41IC0zLjc1IDE2NWwtNDYuMjUgNDYuMjVzMzUgLTUzLjc1IC0zNy41IC0xMjMuNzVjLTYzLjc1IC02My43NSAtMTIzLjc1IC0zNi4yNSAtMTIzLjc1IC0zNi4yNWw0OC43NSAtNDguNzVjNDMuNzUgLTQ1IDEyMCAtNDUgMTYyLjUgLTIuNXptLTg4Ljc1IDI1MGwtNDkyLjUgNDkyLjUgLTIxMCA1MS4yNSAtMy43NSAtMy43NSA1NSAtMjEwIDQ5Mi41IC00OTBjOC43NSAtMi41IDMwIC04Ljc1IDYwIC0yLjVsLTUyMi41IDUyMi41IC0xNSA1NSA2MCA2MCA1Ni4yNSAtMTUgMjUgLTIzLjc1IDIuNSAtNTYuMjUgLTQwIC00MCA0NzguNzUgLTQ3OC43NWM3LjUgNi4yNSA3LjUgNi4yNSAxNSAxNSA3MS4yNSA3MCAzOC43NSAxMjMuNzUgMzguNzUgMTIzLjc1eiIvPjwvc3ZnPg==);
-                    &:hover, &:focus, &:active{
-                        background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSI4MzAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0icmdiKDQwLDEwOSwxNjgpIiBkPSJNNzk1IDExOS4wNjljNTAgNDYuMjUgNDMuNzUgMTE3LjUgLTMuNzUgMTY1bC00Ni4yNSA0Ni4yNXMzNSAtNTMuNzUgLTM3LjUgLTEyMy43NWMtNjMuNzUgLTYzLjc1IC0xMjMuNzUgLTM2LjI1IC0xMjMuNzUgLTM2LjI1bDQ4Ljc1IC00OC43NWM0My43NSAtNDUgMTIwIC00NSAxNjIuNSAtMi41em0tODguNzUgMjUwbC00OTIuNSA0OTIuNSAtMjEwIDUxLjI1IC0zLjc1IC0zLjc1IDU1IC0yMTAgNDkyLjUgLTQ5MGM4Ljc1IC0yLjUgMzAgLTguNzUgNjAgLTIuNWwtNTIyLjUgNTIyLjUgLTE1IDU1IDYwIDYwIDU2LjI1IC0xNSAyNSAtMjMuNzUgMi41IC01Ni4yNSAtNDAgLTQwIDQ3OC43NSAtNDc4Ljc1YzcuNSA2LjI1IDcuNSA2LjI1IDE1IDE1IDcxLjI1IDcwIDM4Ljc1IDEyMy43NSAzOC43NSAxMjMuNzV6Ii8+PC9zdmc+);
-                    }
-                }
-                &.revs{
-                    background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSI4NTcuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsPSJyZ2IoMTA1LDEwNSwxMDUpIiBkPSJNNTAwIDMwMy42djI1MHEwIDcuOCAtNSAxMi44dC0xMi45IDVIMzAzLjZxLTcuOCAwIC0xMi45IC01dC01IC0xMi44di0zNS43cTAgLTcuOSA1IC0xMi45dDEyLjkgLTVoMTI1VjMwMy42cTAgLTcuOCA1IC0xMi45dDEyLjggLTVoMzUuN3E3LjkgMCAxMi45IDV0NSAxMi45ek03MzIuMSA1MDBxMCAtODIuNiAtNDAuNyAtMTUyLjNUNTgwLjkgMjM3LjIgNDI4LjYgMTk2LjR0LTE1Mi40IDQwLjhUMTY1LjcgMzQ3LjcgMTI1IDUwMHQ0MC43IDE1Mi4zIDExMC41IDExMC41IDE1Mi40IDQwLjggMTUyLjMgLTQwLjhUNjkxLjQgNjUyLjMgNzMyLjEgNTAwem0xMjUgMHEwIDExNi42IC01Ny40IDIxNS4xdC0xNTYgMTU2IC0yMTUuMSA1Ny41VDIxMy40IDg3MS4xIDU3LjUgNzE1LjEgMCA1MDAgNTcuNSAyODQuOXQxNTUuOSAtMTU2VDQyOC42IDcxLjR0MjE1LjEgNTcuNSAxNTYgMTU2VDg1Ny4xIDUwMHoiLz48L3N2Zz4=);
-                    &:hover, &:focus, &:active{
-                        background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSI4NTcuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsPSJyZ2IoNDAsMTA5LDE2OCkiIGQ9Ik01MDAgMzAzLjZ2MjUwcTAgNy44IC01IDEyLjh0LTEyLjkgNUgzMDMuNnEtNy44IDAgLTEyLjkgLTV0LTUgLTEyLjh2LTM1LjdxMCAtNy45IDUgLTEyLjl0MTIuOSAtNWgxMjVWMzAzLjZxMCAtNy44IDUgLTEyLjl0MTIuOCAtNWgzNS43cTcuOSAwIDEyLjkgNXQ1IDEyLjl6TTczMi4xIDUwMHEwIC04Mi42IC00MC43IC0xNTIuM1Q1ODAuOSAyMzcuMiA0MjguNiAxOTYuNHQtMTUyLjQgNDAuOFQxNjUuNyAzNDcuNyAxMjUgNTAwdDQwLjcgMTUyLjMgMTEwLjUgMTEwLjUgMTUyLjQgNDAuOCAxNTIuMyAtNDAuOFQ2OTEuNCA2NTIuMyA3MzIuMSA1MDB6bTEyNSAwcTAgMTE2LjYgLTU3LjQgMjE1LjF0LTE1NiAxNTYgLTIxNS4xIDU3LjVUMjEzLjQgODcxLjEgNTcuNSA3MTUuMSAwIDUwMCA1Ny41IDI4NC45dDE1NS45IC0xNTZUNDI4LjYgNzEuNHQyMTUuMSA1Ny41IDE1NiAxNTZUODU3LjEgNTAweiIvPjwvc3ZnPg==);
-                    }
-                }
-                &.backlink{
-                    background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSI5MjguNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsPSJyZ2IoMTA1LDEwNSwxMDUpIiBkPSJNODEyLjUgNjc4LjZxMCAtMjIuMyAtMTUuNiAtMzhsLTExNi4xIC0xMTZxLTE1LjYgLTE1LjcgLTM3LjkgLTE1LjcgLTIzLjUgMCAtNDAuMiAxNy45IDEuNyAxLjcgMTAuNiAxMC4zdDEyIDEyIDguMyAxMC42IDcuMyAxNC4yIDIgMTUuNHEwIDIyLjMgLTE1LjcgMzcuOXQtMzcuOSAxNS43cS04LjQgMCAtMTUuNCAtMnQtMTQuMiAtNy4zIC0xMC42IC04LjMgLTEyIC0xMiAtMTAuMyAtMTAuNnEtMTguNCAxNy4zIC0xOC40IDQwLjcgMCAyMi4zIDE1LjYgMzhsMTE1IDExNS41cTE1IDE1IDM3LjkgMTUgMjIuMyAwIDM3LjkgLTE0LjVMNzk2LjkgNzE2cTE1LjYgLTE1LjcgMTUuNiAtMzcuNHpNNDIwLjIgMjg1LjJxMCAtMjIuNCAtMTUuNiAtMzhsLTExNSAtMTE1LjVRMjc0IDExNi4xIDI1MS43IDExNi4xcS0yMS44IDAgLTM4IDE1bC04MiA4MS41cS0xNS42IDE1LjYgLTE1LjYgMzcuNCAwIDIyLjMgMTUuNiAzNy45TDI0Ny44IDQwNHExNSAxNS4xIDM3LjkgMTUuMSAyMy41IDAgNDAuMiAtMTcuMyAtMS43IC0xLjcgLTEwLjYgLTEwLjN0LTEyIC0xMiAtOC40IC0xMC42IC03LjIgLTE0LjMgLTIgLTE1LjNxMCAtMjIuMyAxNS42IC0zOHQzOCAtMTUuNnE4LjQgMCAxNS4zIDJ0MTQuMyA3LjIgMTAuNiA4LjQgMTIgMTIgMTAuMyAxMC42cTE4LjQgLTE3LjMgMTguNCAtNDAuN3ptNDk5LjQgMzkzLjRxMCA2Ni45IC00Ny40IDExMy4zbC04MiA4MS40cS00Ni4zIDQ2LjMgLTExMy4zIDQ2LjMgLTY3LjUgMCAtMTEzLjggLTQ3LjRsLTExNSAtMTE1LjVRNDAxLjggNzEwLjQgNDAxLjggNjQzLjRxMCAtNjguNiA0OS4xIC0xMTYuNmwtNDkuMSAtNDkuMXEtNDggNDkuMSAtMTE2LjEgNDkuMSAtNjYuOSAwIC0xMTMuOCAtNDYuOUw1NS44IDM2My44UTguOSAzMTcgOC45IDI1MFQ1Ni40IDEzNi43bDgyIC04MS41UTE4NC43IDguOSAyNTEuNyA4LjlxNjcuNSAwIDExMy44IDQ3LjVsMTE1IDExNS41cTQ2LjMgNDYuMyA0Ni4zIDExMy4zIDAgNjguNiAtNDkuMSAxMTYuNmw0OS4xIDQ5LjFxNDggLTQ5LjEgMTE2LjEgLTQ5LjEgNjYuOSAwIDExMy44IDQ2LjlsMTE2LjEgMTE2cTQ2LjggNDYuOSA0Ni44IDExMy45eiIvPjwvc3ZnPg==);
-                    &:hover, &:focus, &:active{
-                        background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSI5MjguNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsPSJyZ2IoNDAsMTA5LDE2OCkiIGQ9Ik04MTIuNSA2NzguNnEwIC0yMi4zIC0xNS42IC0zOGwtMTE2LjEgLTExNnEtMTUuNiAtMTUuNyAtMzcuOSAtMTUuNyAtMjMuNSAwIC00MC4yIDE3LjkgMS43IDEuNyAxMC42IDEwLjN0MTIgMTIgOC4zIDEwLjYgNy4zIDE0LjIgMiAxNS40cTAgMjIuMyAtMTUuNyAzNy45dC0zNy45IDE1LjdxLTguNCAwIC0xNS40IC0ydC0xNC4yIC03LjMgLTEwLjYgLTguMyAtMTIgLTEyIC0xMC4zIC0xMC42cS0xOC40IDE3LjMgLTE4LjQgNDAuNyAwIDIyLjMgMTUuNiAzOGwxMTUgMTE1LjVxMTUgMTUgMzcuOSAxNSAyMi4zIDAgMzcuOSAtMTQuNUw3OTYuOSA3MTZxMTUuNiAtMTUuNyAxNS42IC0zNy40ek00MjAuMiAyODUuMnEwIC0yMi40IC0xNS42IC0zOGwtMTE1IC0xMTUuNVEyNzQgMTE2LjEgMjUxLjcgMTE2LjFxLTIxLjggMCAtMzggMTVsLTgyIDgxLjVxLTE1LjYgMTUuNiAtMTUuNiAzNy40IDAgMjIuMyAxNS42IDM3LjlMMjQ3LjggNDA0cTE1IDE1LjEgMzcuOSAxNS4xIDIzLjUgMCA0MC4yIC0xNy4zIC0xLjcgLTEuNyAtMTAuNiAtMTAuM3QtMTIgLTEyIC04LjQgLTEwLjYgLTcuMiAtMTQuMyAtMiAtMTUuM3EwIC0yMi4zIDE1LjYgLTM4dDM4IC0xNS42cTguNCAwIDE1LjMgMnQxNC4zIDcuMiAxMC42IDguNCAxMiAxMiAxMC4zIDEwLjZxMTguNCAtMTcuMyAxOC40IC00MC43em00OTkuNCAzOTMuNHEwIDY2LjkgLTQ3LjQgMTEzLjNsLTgyIDgxLjRxLTQ2LjMgNDYuMyAtMTEzLjMgNDYuMyAtNjcuNSAwIC0xMTMuOCAtNDcuNGwtMTE1IC0xMTUuNVE0MDEuOCA3MTAuNCA0MDEuOCA2NDMuNHEwIC02OC42IDQ5LjEgLTExNi42bC00OS4xIC00OS4xcS00OCA0OS4xIC0xMTYuMSA0OS4xIC02Ni45IDAgLTExMy44IC00Ni45TDU1LjggMzYzLjhROC45IDMxNyA4LjkgMjUwVDU2LjQgMTM2LjdsODIgLTgxLjVRMTg0LjcgOC45IDI1MS43IDguOXE2Ny41IDAgMTEzLjggNDcuNWwxMTUgMTE1LjVxNDYuMyA0Ni4zIDQ2LjMgMTEzLjMgMCA2OC42IC00OS4xIDExNi42bDQ5LjEgNDkuMXE0OCAtNDkuMSAxMTYuMSAtNDkuMSA2Ni45IDAgMTEzLjggNDYuOWwxMTYuMSAxMTZxNDYuOCA0Ni45IDQ2LjggMTEzLjl6Ii8+PC9zdmc+);
-                    }
-                }
-                &.top{
+                &.top {
                     margin-top: 1em;
-                    position: relative;
-                    background-size: @font-size-default;
-                    background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSI4MzQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0icmdiKDEwNSwxMDUsMTA1KSIgZD0iTTQxNi4yNSAxMDAxcS02NSAwIC0xMTAuNjI1IC00NS42MjV0LTQ1LjYyNSAtMTEwLjYyNWwwIC0yNDcuNXEtNDUgNDAgLTEwOC4xMjUgMzguMTI1dC0xMDUuNjI1IC00NC4zNzVxLTQ2LjI1IC00Ni4yNSAtNDYuMjUgLTExMC42MjV0NDYuMjUgLTExMC42MjVsMzcwIC0zNzEuMjUgMzcxLjI1IDM3MS4yNXE0Ni4yNSA0Ni4yNSA0Ni4yNSAxMTAuNjI1dC00Ni4yNSAxMTAuNjI1cS00Mi41IDQyLjUgLTEwNi4yNSA0NC4zNzV0LTEwOC43NSAtMzguMTI1bDAgMjQ3LjVxMCA2NSAtNDUuNjI1IDExMC42MjV0LTExMC42MjUgNDUuNjI1em0tNTEuMjUgLTY1NWwwIDQ5OC43NXEwIDIxLjI1IDE1IDM2Ljg3NXQzNi4yNSAxNS42MjUgMzYuODc1IC0xNS42MjUgMTUuNjI1IC0zNi44NzVsMCAtNDk4Ljc1bDE3MS4yNSAxNzEuMjVxMTUgMTUgMzYuODc1IDE1dDM2Ljg3NSAtMTUgMTUgLTM2Ljg3NSAtMTUgLTM2Ljg3NWwtMjk3LjUgLTI5Ny41IC0yOTcuNSAyOTcuNXEtMTUgMTUgLTE1IDM2Ljg3NXQxNSAzNi44NzUgMzYuODc1IDE1IDM2Ljg3NSAtMTV6Ii8+PC9zdmc+);
-                    &:hover, &:focus, &:active{
-                        background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSI4MzQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0icmdiKDQwLDEwOSwxNjgpIiBkPSJNNDE2LjI1IDEwMDFxLTY1IDAgLTExMC42MjUgLTQ1LjYyNXQtNDUuNjI1IC0xMTAuNjI1bDAgLTI0Ny41cS00NSA0MCAtMTA4LjEyNSAzOC4xMjV0LTEwNS42MjUgLTQ0LjM3NXEtNDYuMjUgLTQ2LjI1IC00Ni4yNSAtMTEwLjYyNXQ0Ni4yNSAtMTEwLjYyNWwzNzAgLTM3MS4yNSAzNzEuMjUgMzcxLjI1cTQ2LjI1IDQ2LjI1IDQ2LjI1IDExMC42MjV0LTQ2LjI1IDExMC42MjVxLTQyLjUgNDIuNSAtMTA2LjI1IDQ0LjM3NXQtMTA4Ljc1IC0zOC4xMjVsMCAyNDcuNXEwIDY1IC00NS42MjUgMTEwLjYyNXQtMTEwLjYyNSA0NS42MjV6bS01MS4yNSAtNjU1bDAgNDk4Ljc1cTAgMjEuMjUgMTUgMzYuODc1dDM2LjI1IDE1LjYyNSAzNi44NzUgLTE1LjYyNSAxNS42MjUgLTM2Ljg3NWwwIC00OTguNzVsMTcxLjI1IDE3MS4yNXExNSAxNSAzNi44NzUgMTV0MzYuODc1IC0xNSAxNSAtMzYuODc1IC0xNSAtMzYuODc1bC0yOTcuNSAtMjk3LjUgLTI5Ny41IDI5Ny41cS0xNSAxNSAtMTUgMzYuODc1dDE1IDM2Ljg3NSAzNi44NzUgMTUgMzYuODc1IC0xNXoiLz48L3N2Zz4=);
-                    }
-                }
-                &.plugin_bookcreator_addtobook{
-                    background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSI5MjgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0icmdiKDEwNSwxMDUsMTA1KSIgZD0iTTQ2NCAyMjEuNXE1IC01IDE0LjUgLTEydDQ3IC0yNi41IDgzLjUgLTM0LjUgMTI3IC0yNyAxNzUgLTEybDAgNjcwcS05NSAwIC0xNzYgMTEuNXQtMTI4LjUgMjcuNSAtODEuNSAzMyAtNDcgMjlsLTE0IDEwcS00IC00IC0xMyAtMTEuNXQtNDYuNSAtMjYuNSAtODMgLTM0IC0xMjcgLTI3IC0xNzYuNSAtMTJsMCAtNjcwcTk0IDAgMTc0IDExLjV0MTI4IDI3LjUgODIuNSAzMyA0OC41IDI5em0tMzM0IDBsMCA0NTBxMTcyIDE0IDI3OSA3MWwwIC00NDlxLTExMCAtNTggLTI3OSAtNzJ6bTY2OSA0NTBsMCAtNDUwcS0xNjggMTQgLTI3OCA3MmwwIDQ0OXExMDggLTU3IDI3OCAtNzF6Ii8+PC9zdmc+);
-                    &:hover, &:focus, &:active{
-                        background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSI5MjgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0icmdiKDQwLDEwOSwxNjgpIiBkPSJNNDY0IDIyMS41cTUgLTUgMTQuNSAtMTJ0NDcgLTI2LjUgODMuNSAtMzQuNSAxMjcgLTI3IDE3NSAtMTJsMCA2NzBxLTk1IDAgLTE3NiAxMS41dC0xMjguNSAyNy41IC04MS41IDMzIC00NyAyOWwtMTQgMTBxLTQgLTQgLTEzIC0xMS41dC00Ni41IC0yNi41IC04MyAtMzQgLTEyNyAtMjcgLTE3Ni41IC0xMmwwIC02NzBxOTQgMCAxNzQgMTEuNXQxMjggMjcuNSA4Mi41IDMzIDQ4LjUgMjl6bS0zMzQgMGwwIDQ1MHExNzIgMTQgMjc5IDcxbDAgLTQ0OXEtMTEwIC01OCAtMjc5IC03MnptNjY5IDQ1MGwwIC00NTBxLTE2OCAxNCAtMjc4IDcybDAgNDQ5cTEwOCAtNTcgMjc4IC03MXoiLz48L3N2Zz4=);
-                    }
-                }
-                &.export_pdf{
-                    background-size: @font-size-default auto;
-                    background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSI4NTcuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsPSJyZ2IoMTA1LDEwNSwxMDUpIiBkPSJNODE5LjIgMjEyLjFxMTUuNiAxNS42IDI2LjggNDIuNHQxMS4xIDQ5LjF2NjQyLjhxMCAyMi40IC0xNS42IDM4dC0zNy45IDE1LjZoLTc1MHEtMjIuMyAwIC0zOCAtMTUuNlQwIDk0Ni40VjUzLjZxMCAtMjIuNCAxNS42IC0zOFQ1My42IDBoNTAwcTIyLjMgMCA0OS4xIDExLjJ0NDIuNCAyNi43ek01NzEuNCA3NS45djIwOS44aDIwOS45UTc3NS43IDI2OS41IDc2OSAyNjIuOEw1OTQuMyA4OC4ycS02LjcgLTYuNyAtMjIuOSAtMTIuM3ptMjE0LjMgODUyLjdWMzU3LjFINTUzLjZxLTIyLjMgMCAtMzggLTE1LjZUNTAwIDMwMy42VjcxLjRINzEuNHY4NTcuMmg3MTQuM3pNNDk4LjkgNTk3LjdxMTguNCAxNC41IDQ2LjkgMzEuMlE1NzguNyA2MjUgNjExIDYyNXE4Mi4xIDAgOTguOCAyNy4zIDkgMTIuMyAxLjEgMjkuMSAwIC41IC0uNSAxLjFsLTEuMSAxLjF2LjZxLTMuNCAyMS4yIC0zOS43IDIxLjIgLTI2LjcgMCAtNjQuMSAtMTEuMnQtNzIuNiAtMjkuNlE0MDkuNiA2NzggMzE0LjIgNzEwLjkgMjI4LjggODU3LjEgMTc5LjEgODU3LjFxLTguMyAwIC0xNS42IC0zLjlsLTEzLjQgLTYuN3EtLjUgLS41IC0zLjMgLTIuOCAtNS42IC01LjUgLTMuNCAtMjAgNSAtMjIuNCAzMS4zIC01MS4xdDczLjYgLTUzLjlxNy44IC01IDEyLjkgMy40IDEuMSAxLjEgMS4xIDIuMiAyOSAtNDcuNCA1OS43IC0xMDkuOSAzNy45IC03NS45IDU4IC0xNDYuMiAtMTMuNCAtNDUuOCAtMTcgLTg5dDMuNiAtNzEuMnE2LjIgLTIyLjMgMjMuNSAtMjIuM2gxMi4ycTEyLjkgMCAxOS42IDguNCAxMCAxMS43IDUgMzcuOSAtMS4xIDMuNCAtMi4yIDQuNSAuNSAxLjcgLjUgNC41djE2LjdxLTEuMSA2OC42IC03LjggMTA3LjEgMzAuNyA5MS42IDgxLjUgMTMyLjl6TTE3Ny41IDgyN3EyOSAtMTMuNCA3Ni40IC04OC4yIC0yOC41IDIyLjQgLTQ4LjggNDYuOVQxNzcuNSA4Mjd6TTM5OS42IDMxMy42cS04LjQgMjMuNSAtMS4yIDczLjcgLjYgLTMuOSAzLjkgLTI0LjYgMCAtMS43IDQgLTI0IC41IC0yLjIgMi4yIC00LjQgLS42IC0uNiAtLjYgLTEuMiAtLjUgLTEuMSAtLjUgLTEuNiAtLjYgLTEyLjMgLTcuMyAtMjAuMSAwIC41IC0uNSAxLjF2MS4xem0tNjkuMiAzNjguOXE3NS4zIC0zMC4yIDE1OC40IC00NS4yIC0xLjEgLS42IC03LjIgLTUuM3QtOC45IC03LjZxLTQyLjUgLTM3LjMgLTcwLjkgLTk4LjIgLTE1LjEgNDggLTQ2LjMgMTEwIC0xNi44IDMxLjIgLTI1LjEgNDYuM3ptMzYwLjQgLTlxLTEzLjMgLTEzLjMgLTc4LjEgLTEzLjMgNDIuNCAxNS42IDY5LjIgMTUuNiA3LjggMCAxMC4xIC0uNiAwIC0uNSAtMS4yIC0xLjd6Ii8+PC9zdmc+);
-                    &:hover, &:focus, &:active{
-                        background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSI4NTcuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsPSJyZ2IoNDAsMTA5LDE2OCkiIGQ9Ik04MTkuMiAyMTIuMXExNS42IDE1LjYgMjYuOCA0Mi40dDExLjEgNDkuMXY2NDIuOHEwIDIyLjQgLTE1LjYgMzh0LTM3LjkgMTUuNmgtNzUwcS0yMi4zIDAgLTM4IC0xNS42VDAgOTQ2LjRWNTMuNnEwIC0yMi40IDE1LjYgLTM4VDUzLjYgMGg1MDBxMjIuMyAwIDQ5LjEgMTEuMnQ0Mi40IDI2Ljd6TTU3MS40IDc1Ljl2MjA5LjhoMjA5LjlRNzc1LjcgMjY5LjUgNzY5IDI2Mi44TDU5NC4zIDg4LjJxLTYuNyAtNi43IC0yMi45IC0xMi4zem0yMTQuMyA4NTIuN1YzNTcuMUg1NTMuNnEtMjIuMyAwIC0zOCAtMTUuNlQ1MDAgMzAzLjZWNzEuNEg3MS40djg1Ny4yaDcxNC4zek00OTguOSA1OTcuN3ExOC40IDE0LjUgNDYuOSAzMS4yUTU3OC43IDYyNSA2MTEgNjI1cTgyLjEgMCA5OC44IDI3LjMgOSAxMi4zIDEuMSAyOS4xIDAgLjUgLS41IDEuMWwtMS4xIDEuMXYuNnEtMy40IDIxLjIgLTM5LjcgMjEuMiAtMjYuNyAwIC02NC4xIC0xMS4ydC03Mi42IC0yOS42UTQwOS42IDY3OCAzMTQuMiA3MTAuOSAyMjguOCA4NTcuMSAxNzkuMSA4NTcuMXEtOC4zIDAgLTE1LjYgLTMuOWwtMTMuNCAtNi43cS0uNSAtLjUgLTMuMyAtMi44IC01LjYgLTUuNSAtMy40IC0yMCA1IC0yMi40IDMxLjMgLTUxLjF0NzMuNiAtNTMuOXE3LjggLTUgMTIuOSAzLjQgMS4xIDEuMSAxLjEgMi4yIDI5IC00Ny40IDU5LjcgLTEwOS45IDM3LjkgLTc1LjkgNTggLTE0Ni4yIC0xMy40IC00NS44IC0xNyAtODl0My42IC03MS4ycTYuMiAtMjIuMyAyMy41IC0yMi4zaDEyLjJxMTIuOSAwIDE5LjYgOC40IDEwIDExLjcgNSAzNy45IC0xLjEgMy40IC0yLjIgNC41IC41IDEuNyAuNSA0LjV2MTYuN3EtMS4xIDY4LjYgLTcuOCAxMDcuMSAzMC43IDkxLjYgODEuNSAxMzIuOXpNMTc3LjUgODI3cTI5IC0xMy40IDc2LjQgLTg4LjIgLTI4LjUgMjIuNCAtNDguOCA0Ni45VDE3Ny41IDgyN3pNMzk5LjYgMzEzLjZxLTguNCAyMy41IC0xLjIgNzMuNyAuNiAtMy45IDMuOSAtMjQuNiAwIC0xLjcgNCAtMjQgLjUgLTIuMiAyLjIgLTQuNCAtLjYgLS42IC0uNiAtMS4yIC0uNSAtMS4xIC0uNSAtMS42IC0uNiAtMTIuMyAtNy4zIC0yMC4xIDAgLjUgLS41IDEuMXYxLjF6bS02OS4yIDM2OC45cTc1LjMgLTMwLjIgMTU4LjQgLTQ1LjIgLTEuMSAtLjYgLTcuMiAtNS4zdC04LjkgLTcuNnEtNDIuNSAtMzcuMyAtNzAuOSAtOTguMiAtMTUuMSA0OCAtNDYuMyAxMTAgLTE2LjggMzEuMiAtMjUuMSA0Ni4zem0zNjAuNCAtOXEtMTMuMyAtMTMuMyAtNzguMSAtMTMuMyA0Mi40IDE1LjYgNjkuMiAxNS42IDcuOCAwIDEwLjEgLS42IDAgLS41IC0xLjIgLTEuN3oiLz48L3N2Zz4=);
-                    }
-                }
-                &.show{
-                    background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSI4NTcuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsPSJyZ2IoMTA1LDEwNSwxMDUpIiBkPSJNODE5LjIgMjEyLjFxMTUuNiAxNS42IDI2LjggNDIuNHQxMS4xIDQ5LjF2NjQyLjhxMCAyMi40IC0xNS42IDM4dC0zNy45IDE1LjZoLTc1MHEtMjIuMyAwIC0zOCAtMTUuNlQwIDk0Ni40VjUzLjZxMCAtMjIuNCAxNS42IC0zOFQ1My42IDBoNTAwcTIyLjMgMCA0OS4xIDExLjJ0NDIuNCAyNi43ek01NzEuNCA3NS45djIwOS44aDIwOS45UTc3NS43IDI2OS41IDc2OSAyNjIuOEw1OTQuMyA4OC4ycS02LjcgLTYuNyAtMjIuOSAtMTIuM3ptMjE0LjMgODUyLjdWMzU3LjFINTUzLjZxLTIyLjMgMCAtMzggLTE1LjZUNTAwIDMwMy42VjcxLjRINzEuNHY4NTcuMmg3MTQuM3pNMjE0LjMgNDQ2LjRxMCAtNy44IDUgLTEyLjh0MTIuOCAtNUg2MjVxNy44IDAgMTIuOCA1dDUuMSAxMi44djM1LjdxMCA3LjkgLTUuMSAxMi45dC0xMi44IDVIMjMyLjFxLTcuOCAwIC0xMi44IC01dC01IC0xMi45di0zNS43em00MTAuNyAxMjVxNy44IDAgMTIuOCA1LjF0NS4xIDEyLjhWNjI1cTAgNy44IC01LjEgMTIuOHQtMTIuOCA1LjFIMjMyLjFxLTcuOCAwIC0xMi44IC01LjF0LTUgLTEyLjh2LTM1LjdxMCAtNy44IDUgLTEyLjh0MTIuOCAtNS4xSDYyNXptMCAxNDIuOXE3LjggMCAxMi44IDV0NS4xIDEyLjh2MzUuOHEwIDcuOCAtNS4xIDEyLjh0LTEyLjggNUgyMzIuMXEtNy44IDAgLTEyLjggLTV0LTUgLTEyLjh2LTM1LjhxMCAtNy44IDUgLTEyLjh0MTIuOCAtNUg2MjV6Ii8+PC9zdmc+);
-                    &:hover, &:focus, &:active{
-                        background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSI4NTcuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsPSJyZ2IoNDAsMTA5LDE2OCkiIGQ9Ik04MTkuMiAyMTIuMXExNS42IDE1LjYgMjYuOCA0Mi40dDExLjEgNDkuMXY2NDIuOHEwIDIyLjQgLTE1LjYgMzh0LTM3LjkgMTUuNmgtNzUwcS0yMi4zIDAgLTM4IC0xNS42VDAgOTQ2LjRWNTMuNnEwIC0yMi40IDE1LjYgLTM4VDUzLjYgMGg1MDBxMjIuMyAwIDQ5LjEgMTEuMnQ0Mi40IDI2Ljd6TTU3MS40IDc1Ljl2MjA5LjhoMjA5LjlRNzc1LjcgMjY5LjUgNzY5IDI2Mi44TDU5NC4zIDg4LjJxLTYuNyAtNi43IC0yMi45IC0xMi4zem0yMTQuMyA4NTIuN1YzNTcuMUg1NTMuNnEtMjIuMyAwIC0zOCAtMTUuNlQ1MDAgMzAzLjZWNzEuNEg3MS40djg1Ny4yaDcxNC4zek0yMTQuMyA0NDYuNHEwIC03LjggNSAtMTIuOHQxMi44IC01SDYyNXE3LjggMCAxMi44IDV0NS4xIDEyLjh2MzUuN3EwIDcuOSAtNS4xIDEyLjl0LTEyLjggNUgyMzIuMXEtNy44IDAgLTEyLjggLTV0LTUgLTEyLjl2LTM1Ljd6bTQxMC43IDEyNXE3LjggMCAxMi44IDUuMXQ1LjEgMTIuOFY2MjVxMCA3LjggLTUuMSAxMi44dC0xMi44IDUuMUgyMzIuMXEtNy44IDAgLTEyLjggLTUuMXQtNSAtMTIuOHYtMzUuN3EwIC03LjggNSAtMTIuOHQxMi44IC01LjFINjI1em0wIDE0Mi45cTcuOCAwIDEyLjggNXQ1LjEgMTIuOHYzNS44cTAgNy44IC01LjEgMTIuOHQtMTIuOCA1SDIzMi4xcS03LjggMCAtMTIuOCAtNXQtNSAtMTIuOHYtMzUuOHEwIC03LjggNSAtMTIuOHQxMi44IC01SDYyNXoiLz48L3N2Zz4=);
-                    }
                 }
             }
-
         }
     }
 
-    &:hover{
-         ul{
-             background-color: #fff;
-             box-shadow: @box-shadow-offset;
-             li{
-                 &.plugin_move_page{
-                     a{
-                         color: @color-nav;
-                         background-position: 95% center;
-                         opacity: .8;
-                         &:hover, &:focus, &:active{
-                             opacity: 1;
-                             *{
-                                 opacity: 1;
-                             }
-                             color: @color-nav-hover;
-                             background-color: #fff;
-                         }
-                     }
-                 }
-                 a{
-                     &.source, &.revs, &.backlink, &.plugin_bookcreator_addtobook, &.export_pdf, &.top, &.show {
-                         color: @color-nav;
-                         background-position: 95% center;
-                         opacity: .8;
-                         &:hover, &:focus, &:active{
-                             opacity: 1;
-                             *{
-                                 opacity: 1;
-                             }
-                             color: @color-nav-hover;
-                             background-color: #fff;
-                         }
-                     }
-                     &.plugin_bookcreator_addtobook{
-                         background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSI5MjgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0icmdiKDEwNSwxMDUsMTA1KSIgZD0iTTQ2NCAyMjEuNXE1IC01IDE0LjUgLTEydDQ3IC0yNi41IDgzLjUgLTM0LjUgMTI3IC0yNyAxNzUgLTEybDAgNjcwcS05NSAwIC0xNzYgMTEuNXQtMTI4LjUgMjcuNSAtODEuNSAzMyAtNDcgMjlsLTE0IDEwcS00IC00IC0xMyAtMTEuNXQtNDYuNSAtMjYuNSAtODMgLTM0IC0xMjcgLTI3IC0xNzYuNSAtMTJsMCAtNjcwcTk0IDAgMTc0IDExLjV0MTI4IDI3LjUgODIuNSAzMyA0OC41IDI5em0tMzM0IDBsMCA0NTBxMTcyIDE0IDI3OSA3MWwwIC00NDlxLTExMCAtNTggLTI3OSAtNzJ6bTY2OSA0NTBsMCAtNDUwcS0xNjggMTQgLTI3OCA3MmwwIDQ0OXExMDggLTU3IDI3OCAtNzF6Ii8+PC9zdmc+);
-                         &:hover, &:focus, &:active{
-                             background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSI5MjgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0icmdiKDQwLDEwOSwxNjgpIiBkPSJNNDY0IDIyMS41cTUgLTUgMTQuNSAtMTJ0NDcgLTI2LjUgODMuNSAtMzQuNSAxMjcgLTI3IDE3NSAtMTJsMCA2NzBxLTk1IDAgLTE3NiAxMS41dC0xMjguNSAyNy41IC04MS41IDMzIC00NyAyOWwtMTQgMTBxLTQgLTQgLTEzIC0xMS41dC00Ni41IC0yNi41IC04MyAtMzQgLTEyNyAtMjcgLTE3Ni41IC0xMmwwIC02NzBxOTQgMCAxNzQgMTEuNXQxMjggMjcuNSA4Mi41IDMzIDQ4LjUgMjl6bS0zMzQgMGwwIDQ1MHExNzIgMTQgMjc5IDcxbDAgLTQ0OXEtMTEwIC01OCAtMjc5IC03MnptNjY5IDQ1MGwwIC00NTBxLTE2OCAxNCAtMjc4IDcybDAgNDQ5cTEwOCAtNTcgMjc4IC03MXoiLz48L3N2Zz4=);
-                         }
+    &:hover {
+        ul {
+            box-shadow: @box-shadow; // @box-shadow-offset;
+            background-color: @ini_background_content;
+            border-color: @wikiicons-border;
 
-                     }
-                     &.export_pdf{
-                         background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSI4NTcuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsPSJyZ2IoMTA1LDEwNSwxMDUpIiBkPSJNODE5LjIgMjEyLjFxMTUuNiAxNS42IDI2LjggNDIuNHQxMS4xIDQ5LjF2NjQyLjhxMCAyMi40IC0xNS42IDM4dC0zNy45IDE1LjZoLTc1MHEtMjIuMyAwIC0zOCAtMTUuNlQwIDk0Ni40VjUzLjZxMCAtMjIuNCAxNS42IC0zOFQ1My42IDBoNTAwcTIyLjMgMCA0OS4xIDExLjJ0NDIuNCAyNi43ek01NzEuNCA3NS45djIwOS44aDIwOS45UTc3NS43IDI2OS41IDc2OSAyNjIuOEw1OTQuMyA4OC4ycS02LjcgLTYuNyAtMjIuOSAtMTIuM3ptMjE0LjMgODUyLjdWMzU3LjFINTUzLjZxLTIyLjMgMCAtMzggLTE1LjZUNTAwIDMwMy42VjcxLjRINzEuNHY4NTcuMmg3MTQuM3pNNDk4LjkgNTk3LjdxMTguNCAxNC41IDQ2LjkgMzEuMlE1NzguNyA2MjUgNjExIDYyNXE4Mi4xIDAgOTguOCAyNy4zIDkgMTIuMyAxLjEgMjkuMSAwIC41IC0uNSAxLjFsLTEuMSAxLjF2LjZxLTMuNCAyMS4yIC0zOS43IDIxLjIgLTI2LjcgMCAtNjQuMSAtMTEuMnQtNzIuNiAtMjkuNlE0MDkuNiA2NzggMzE0LjIgNzEwLjkgMjI4LjggODU3LjEgMTc5LjEgODU3LjFxLTguMyAwIC0xNS42IC0zLjlsLTEzLjQgLTYuN3EtLjUgLS41IC0zLjMgLTIuOCAtNS42IC01LjUgLTMuNCAtMjAgNSAtMjIuNCAzMS4zIC01MS4xdDczLjYgLTUzLjlxNy44IC01IDEyLjkgMy40IDEuMSAxLjEgMS4xIDIuMiAyOSAtNDcuNCA1OS43IC0xMDkuOSAzNy45IC03NS45IDU4IC0xNDYuMiAtMTMuNCAtNDUuOCAtMTcgLTg5dDMuNiAtNzEuMnE2LjIgLTIyLjMgMjMuNSAtMjIuM2gxMi4ycTEyLjkgMCAxOS42IDguNCAxMCAxMS43IDUgMzcuOSAtMS4xIDMuNCAtMi4yIDQuNSAuNSAxLjcgLjUgNC41djE2LjdxLTEuMSA2OC42IC03LjggMTA3LjEgMzAuNyA5MS42IDgxLjUgMTMyLjl6TTE3Ny41IDgyN3EyOSAtMTMuNCA3Ni40IC04OC4yIC0yOC41IDIyLjQgLTQ4LjggNDYuOVQxNzcuNSA4Mjd6TTM5OS42IDMxMy42cS04LjQgMjMuNSAtMS4yIDczLjcgLjYgLTMuOSAzLjkgLTI0LjYgMCAtMS43IDQgLTI0IC41IC0yLjIgMi4yIC00LjQgLS42IC0uNiAtLjYgLTEuMiAtLjUgLTEuMSAtLjUgLTEuNiAtLjYgLTEyLjMgLTcuMyAtMjAuMSAwIC41IC0uNSAxLjF2MS4xem0tNjkuMiAzNjguOXE3NS4zIC0zMC4yIDE1OC40IC00NS4yIC0xLjEgLS42IC03LjIgLTUuM3QtOC45IC03LjZxLTQyLjUgLTM3LjMgLTcwLjkgLTk4LjIgLTE1LjEgNDggLTQ2LjMgMTEwIC0xNi44IDMxLjIgLTI1LjEgNDYuM3ptMzYwLjQgLTlxLTEzLjMgLTEzLjMgLTc4LjEgLTEzLjMgNDIuNCAxNS42IDY5LjIgMTUuNiA3LjggMCAxMC4xIC0uNiAwIC0uNSAtMS4yIC0xLjd6Ii8+PC9zdmc+);
-                         &:hover, &:focus, &:active{
-                             background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEwMDAiIHdpZHRoPSI4NTcuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsPSJyZ2IoNDAsMTA5LDE2OCkiIGQ9Ik04MTkuMiAyMTIuMXExNS42IDE1LjYgMjYuOCA0Mi40dDExLjEgNDkuMXY2NDIuOHEwIDIyLjQgLTE1LjYgMzh0LTM3LjkgMTUuNmgtNzUwcS0yMi4zIDAgLTM4IC0xNS42VDAgOTQ2LjRWNTMuNnEwIC0yMi40IDE1LjYgLTM4VDUzLjYgMGg1MDBxMjIuMyAwIDQ5LjEgMTEuMnQ0Mi40IDI2Ljd6TTU3MS40IDc1Ljl2MjA5LjhoMjA5LjlRNzc1LjcgMjY5LjUgNzY5IDI2Mi44TDU5NC4zIDg4LjJxLTYuNyAtNi43IC0yMi45IC0xMi4zem0yMTQuMyA4NTIuN1YzNTcuMUg1NTMuNnEtMjIuMyAwIC0zOCAtMTUuNlQ1MDAgMzAzLjZWNzEuNEg3MS40djg1Ny4yaDcxNC4zek00OTguOSA1OTcuN3ExOC40IDE0LjUgNDYuOSAzMS4yUTU3OC43IDYyNSA2MTEgNjI1cTgyLjEgMCA5OC44IDI3LjMgOSAxMi4zIDEuMSAyOS4xIDAgLjUgLS41IDEuMWwtMS4xIDEuMXYuNnEtMy40IDIxLjIgLTM5LjcgMjEuMiAtMjYuNyAwIC02NC4xIC0xMS4ydC03Mi42IC0yOS42UTQwOS42IDY3OCAzMTQuMiA3MTAuOSAyMjguOCA4NTcuMSAxNzkuMSA4NTcuMXEtOC4zIDAgLTE1LjYgLTMuOWwtMTMuNCAtNi43cS0uNSAtLjUgLTMuMyAtMi44IC01LjYgLTUuNSAtMy40IC0yMCA1IC0yMi40IDMxLjMgLTUxLjF0NzMuNiAtNTMuOXE3LjggLTUgMTIuOSAzLjQgMS4xIDEuMSAxLjEgMi4yIDI5IC00Ny40IDU5LjcgLTEwOS45IDM3LjkgLTc1LjkgNTggLTE0Ni4yIC0xMy40IC00NS44IC0xNyAtODl0My42IC03MS4ycTYuMiAtMjIuMyAyMy41IC0yMi4zaDEyLjJxMTIuOSAwIDE5LjYgOC40IDEwIDExLjcgNSAzNy45IC0xLjEgMy40IC0yLjIgNC41IC41IDEuNyAuNSA0LjV2MTYuN3EtMS4xIDY4LjYgLTcuOCAxMDcuMSAzMC43IDkxLjYgODEuNSAxMzIuOXpNMTc3LjUgODI3cTI5IC0xMy40IDc2LjQgLTg4LjIgLTI4LjUgMjIuNCAtNDguOCA0Ni45VDE3Ny41IDgyN3pNMzk5LjYgMzEzLjZxLTguNCAyMy41IC0xLjIgNzMuNyAuNiAtMy45IDMuOSAtMjQuNiAwIC0xLjcgNCAtMjQgLjUgLTIuMiAyLjIgLTQuNCAtLjYgLS42IC0uNiAtMS4yIC0uNSAtMS4xIC0uNSAtMS42IC0uNiAtMTIuMyAtNy4zIC0yMC4xIDAgLjUgLS41IDEuMXYxLjF6bS02OS4yIDM2OC45cTc1LjMgLTMwLjIgMTU4LjQgLTQ1LjIgLTEuMSAtLjYgLTcuMiAtNS4zdC04LjkgLTcuNnEtNDIuNSAtMzcuMyAtNzAuOSAtOTguMiAtMTUuMSA0OCAtNDYuMyAxMTAgLTE2LjggMzEuMiAtMjUuMSA0Ni4zem0zNjAuNCAtOXEtMTMuMyAtMTMuMyAtNzguMSAtMTMuMyA0Mi40IDE1LjYgNjkuMiAxNS42IDcuOCAwIDEwLjEgLS42IDAgLS41IC0xLjIgLTEuN3oiLz48L3N2Zz4=);
-                         }
+            li {
+                color: @ini_existing;
 
-                     }
+                a {
+                    box-shadow: none;
+                    background-image: none;
+                    border-color: transparent;
+                    color: inherit;
+                    padding: 2px 0 2px 2px;
 
-                 }
-             }
-         }
-     }
-}
+                    svg {
+                        border: solid 1px transparent;
+                        border-radius: @ini_default_border_radius;
+                        fill: @ini_existing;
+                        transition: @transition background-color, @transition border-color, @transition fill;
+                    }
 
-/* overwrite do:backlink */
-.mode_backlink #dokuwiki__pagetools ul li a.backlink{
-    background-position: 95% center;
-}
+                    &:hover,
+                    &:focus,
+                    &:active {
+                        svg {
+                            background-color: @ini_existing;
+                            border-color: @ini_existing;
+                            fill: @ini_background_content;
+                        }
+                    }
 
-
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
-/* max-width: 1023px */
-
-@media @screen_max-md {
-    nav#dokuwiki__pagetools {
-        right: 8px;
+                    span {
+                        position: static;
+                        width: auto;
+                        height: auto;
+                        margin: auto;
+                    }
+                }
+            }
+        }
     }
 }

css/area_nav-usertools.less

@@ -16,60 +16,172 @@
     ul {
         float: right;
         padding: 0;
-        margin: @very-small-spacing -(@very-small-spacing) 0 0;
+        margin: (@very-small-spacing * 2) -.25rem 0 0;
 
         li {
             .btn-usertools-wrapper(); // uniform li
             .btn-usertools-num();
 
             float: right;
+            min-height: 28px;
 
             > strong,
             > a {
                 display: block;
                 width: auto;
-                min-height: 2em;
-                border: 1px solid @color-border;
-                border-radius: @border-radius;
-                color: @color-nav;
+                min-height: @toggle-size;
+                overflow: hidden;
+                border: 1px solid @wikiicons-border;
+                border-radius: @ini_default_border_radius; // @ini_default_border_radius vs. @fix_border-radius
                 text-align: center;
                 margin: 0;
-            }
 
-            &.noopentasks {
-                strong {
-                    background-color: @color-site-bg;
+                @media @screen_only-lg {
+                    padding-top: .14rem;
                 }
 
-                .num {
-                    background-color: @color-border;
-                    color: @color-nav;
+                @media @screen_max-xxlg {
+                    min-height: 28px;
+                }
+
+                @media @screen_max-md {
+                    min-height: @toggle-size;
                 }
             }
 
             &.user {
-                border: 1px solid @color-border;
-                border-radius: @border-radius;
-                padding: .3em .25rem;
+                @space-min-xxlg: .35rem;
+                @space-max-xxlg: .4rem;
+                @space-max-xlg: .5rem;
+                @space-max-md: .35rem;
 
-                bdi {
-                    color: @color-nav;
-                    display: inline-block;
-                    padding-top: 1px;
+                position: relative;
+                display: table-cell;
+                background-color: @ini_background;
+                border: solid 1px @noopentasks-border;//@ini_border_light;
+                border-radius: @ini_default_border_radius; // @ini_default_border_radius vs. @fix_border-radius
+                color: @ini_text_webframe;
+                padding-right: .3rem;
+
+                @media @screen_min-xxlg {
+                    padding-top: @space-min-xxlg;
                 }
 
-                > bdi:first-of-type {
-                    .fontello();
-                    .icon-user();
+                @media @screen_max-xxlg {
+                    padding-top: @space-max-xxlg;
+                }
+
+                @media @screen_max-xlg {
+                    padding-top: @space-max-xlg;
+                }
+
+                @media @screen_max-md {
+                    min-height: @toggle-size;
+                    padding-top: @space-max-md;
+                }
+
+                > a {
+                    .display-flex();
+                    .align-items();
+
+                    position: relative;
+                    min-height: 26px;
+                    overflow: visible;
+                    background: @ini_nav_menu_hover_bg; // for removing bg-image
+                    border: 0 none;
+                    color: @ini_nav_menu_hover_color;
+                    text-indent: 0;
+                    font-size: inherit;
+                    margin-right: -.3rem;
+                    padding: 0 .2em 0 0;
+
+                    @media @screen_min-xxlg {
+                        margin-top: -(@space-min-xxlg);
+                    }
+
+                    @media @screen_max-xxlg {
+                        margin-top: -(@space-max-xxlg);
+                    }
+
+                    @media @screen_max-xlg {
+                        margin-top: -(@space-max-xlg);
+                    }
+
+                    @media @screen_max-md {
+                        min-height: (@toggle-size - .1);
+                        margin-top: -(@space-max-md);
+                    }
 
                     &::before {
-                        float: left;
-                        background: @color-nav;
-                        border: 4px solid @color-nav;
-                        border-radius: 50%;
-                        color: #fff;
-                        font-size: @font-size-small;
-                        margin: -2px 6px -2px 0;
+                        content: '';
+                        top: -1px;
+                        bottom: -1px;
+                        left: -1px;
+                        right: -1px;
+                        width: auto;
+                        opacity: 0;
+                        border: solid 1px @ini_nav_menu_hover_color;
+                        border-radius: @ini_default_border_radius; // @ini_default_border_radius vs. @fix_border-radius
+                        color: inherit;
+                        transform: none;
+                        //transition: @transition opacity;
+                    }
+
+                    &:hover,
+                    &:focus,
+                    &:active {
+                        background-color: @ini_nav_menu_hover_color;
+                        border-color: @ini_nav_menu_hover_color;
+                        color: @ini_nav_menu_hover_bg;
+
+                        &::before {
+                            opacity: 1;
+                        }
+
+                        bdi,
+                        bdi:first-of-type {
+                            color: @ini_nav_menu_hover_bg;
+
+                            //&::before {
+                            //    color: inherit;
+                            //}
+                        }
+                    }
+                }
+
+                bdi {
+                    display: inline-block;
+                    color: inherit;
+                    transition: @transition color;
+                }
+
+                bdi:first-of-type {
+                    .fontello();
+                    .icon-user-circle();
+
+                    position: relative;
+                    margin: 0 0 0 .25rem;
+                    padding: 0 .1rem 0 1.3rem;
+
+                    &::before {
+                        position: absolute;
+                        left: -2px;
+                        font-size: 1.4rem;
+                        margin: 0;
+                        transition: @transition color;
+
+                        @media @screen_min-xxlg {
+                            top: -.25rem;
+                        }
+
+                        @media @screen_max-xxlg {
+                            top: -.2rem;
+                        }
+
+                        @media @screen_max-xxs {
+                            top: -.25rem;
+
+                        }
                     }
                 }
             } // user
@@ -92,8 +204,27 @@
                 .prefix {
                     .btn-prefix();
                     .icon-clipboard();
+
+                    display: block;
+                    font-size: 1.2rem;
+                    text-align: center;
+                    margin-bottom: -1px;
                 }
             } // user-task
+
+            &.noopentasks {
+                strong {
+                    background-color: @ini_background;
+                    border-color: @noopentasks-border;
+                    color: @ini_text_webframe;
+                }
+
+                .num {
+                    background-color: @noopentasks-border; // fix
+                    color: @noopentasks-color; // fix
+                    margin-top: 1px;
+                }
+            }
         } // li
 
 
@@ -101,30 +232,27 @@
         a {
             .fontello();
             .hide-text-show-before();
+            .btn-hover();
 
             cursor: pointer;
-            background-color: #fff;
+            position: relative;
+            line-height: 1;
             text-decoration: none;
-            transition: @transition color, @transition background-color, @transition border-color;
 
-            &:hover,
-            &:active,
-            &:focus {
-                background-color: @button_color;
-                border-color: @button_background;
-                //-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: @button_background;
+            @media @screen_only-lg {
+                min-width: 2rem;
             }
 
             &::before {
+                .center-middle();
+
                 content: "?";
+                cursor: pointer;
                 display: block;
                 width: 100%;
                 box-sizing: border-box;
                 font-size: @font-size-default + (@font-scale-factor * 4);
-                cursor: pointer;
-                margin: .2em 0 0;
+                line-height: 1;
             }
 
             /* icon register new user */
@@ -147,7 +275,7 @@
                 .icon-cog();
 
                 &::before {
-                    margin-top: .18rem;
+                    vertical-align: top;
                 }
             }
         } // a

css/area_search.less

@@ -0,0 +1,12 @@
+/**
+ * This file provides the design styles for the search results
+ *
+ * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
+ */
+
+
+/* search hit in normal text */
+.dokuwiki .search_hit {
+    background-color: @ini_highlight;
+    color: @ini_highlight_text;
+}

css/area_sidebar-search.less

@@ -5,35 +5,38 @@
  */
 
 .search.main-sidebar {
-;
     @main-ico-dummy: @font-size-big + @margin-small*2; //FIXME copied from area_main-sidebar-nav
-
     @icon-size: @page-header_height;
     @icon-search_font-size: @font-size-big;
+
     p.toggleSearch a,
     button[type="submit"] {
         .fontello();
         .hide-text-show-before();
         .icon-search();
+
         position: relative;
         width: @icon-size;
         min-height: @icon-size;
         overflow: visible;
         background-image: none;
-        background-color: transparent;
-        color: @color-nav;
+        background-color: transparent; // fix
+        border: solid 1px transparent;
         padding: 0;
         transition: @transition color, @transition background-color, @transition border-color;
+
         &:hover,
         &:focus,
         &:active {
-            background-color: @button_color;
-            border: solid 1px @button_background;
-            color: @button_background;
+            min-height: @icon-size;
+            background-color: @ini_button_color;
+            border: solid 1px @ini_button_background;
+
             &::after {
-                background-color: @button_background;
+                background-color: @ini_button_background;
             }
         }
+
         &::before {
             width: 100%;
             color: inherit;
@@ -42,51 +45,91 @@
             margin: 0;
         }
     }
+
     p.toggleSearch {
         display: none;
         margin: -2px 0 0; // reverse transparent border and box-sizing of a child
         padding: 0;
+
+        @media @screen_max-xxlg {
+            margin-top: -1px;
+        }
+
         a {
             min-width: (@toggle-showsidebar_width + 0.1); /* must be a bit a wider than @toggle-showsidebar_width to hide right border */
             width: @main-ico-dummy;
-            border: solid 1px transparent;
-            border-bottom: solid 1px @color-border;
-            border-radius: @fix_border-radius 0 0 0;
+            border-radius: @fix_border-radius;
+            color: @ini_nav_menu_color;
             text-decoration: none;
             box-sizing: border-box;
-            &:hover,
-            &:focus,
-            &:active {
-                border-radius: @fix_border-radius 0 0 @fix_border-radius;
-            }
+
             &::before {
                 position: absolute;
                 top: 50%;
                 left: 0;
+                color: inherit;
                 text-align: center;
                 margin-top: -(@icon-search_font-size / 2);
             }
+
+            &:hover,
+            &:focus,
+            &:active {
+                background-color: @ini_nav_menu_hover_bg;
+                border-color: @ini_nav_menu_hover_color;
+                color: @ini_nav_menu_hover_color;
+            }
         }
     }
-    /* + + +  form  + + + */
+
+    button[type="submit"] {
+        position: absolute;
+        top: 1px;
+        bottom: 1px;
+        right: 0;
+        height: auto;
+        min-height: (@icon-size - .2);
+        color: @quicksearch-button-color;
+
+        &:hover,
+        &:focus,
+        &:active {
+            top: 0;
+            bottom: 0;
+            min-height: @icon-size;
+            background-color: @ini_button_color;
+            border: solid 1px @ini_button_background;
+            color: @ini_button_background;
+        }
+    }
+
+
+/* + + +  form  + + + */
     form {
+        position: relative;
         display: block;
         margin: 0 0 @margin-default;
+
         .no {
+            display: block;
+
             #qsearch__in {
                 width: 100%;
                 padding-left: 10px;
-                padding-right: (@icon-size + 10);
+                padding-right: @icon-size;
             }
         }
+
         input {
             min-height: @icon-size;
             box-sizing: border-box;
         }
+
         button[type="submit"] {
             border: solid 1px transparent;
-            border-right-color: @color-border;
+            border-right-color: @ini_border;
             margin-left: -(@icon-size);
+
             &::after {
                 content: '';
                 position: absolute;
@@ -94,10 +137,32 @@
                 bottom: 15%;
                 width: 1px;
                 left: -1px;
-                background-color: @color-border;
+                background-color: @ini_border;
                 transition: @transition background-color;
             }
         }
+
+        div.ajax_qsearch {
+            box-shadow: none;
+            background-color: #FFF;
+            padding: 0;
+
+            strong,
+            ul li {
+                color: @quicksearch-button-color;
+                padding: .25rem .5rem;
+
+                * {
+                    color: inherit;
+                }
+            }
+
+            ul li {
+                &:nth-child(odd) {
+                    background-color: @suggestion-zebra;
+                }
+            }
+        }
     }
 
     #qsearch__out {
@@ -106,23 +171,31 @@
         width: 100%;
     }
 }
+
+
+/* + + + + +  wide page content  + + + + + */
 .wide-content {
     .search.main-sidebar {
         p.toggleSearch {
+            position: relative;
+            z-index: 1;
             display: block;
             float: left;
             width: 100%;
         }
+
         form {
             input {
                 border: 0 none;
             }
+
             .no {
                 #qsearch__in {
                     width: 0;
                     padding: 0;
                     margin: 0;
                 }
+
                 button[type="submit"] {
                     display: none;
                 }

css/area_tabs.less

@@ -0,0 +1,39 @@
+/**
+ * This file provides styles for tab boxes
+ */
+
+
+/* + + + + +  tabs  + + + + + */
+
+#dokuwiki__content {
+    ul.tabs {
+        li:not([class~="active"]) {
+            strong,
+            a {
+                color: @ini_text_neu;
+                transition: @transition background-color, @transition color;
+            }
+
+            a:hover,
+            a:focus,
+            a:active {
+                color: @ini_text;
+            }
+        }
+    }
+
+    .tabs > ul {
+        li:not([class~="active"]) {
+            a {
+                color: @ini_text_neu;
+                transition: @transition background-color, @transition color;
+            }
+
+            a:hover,
+            a:focus,
+            a:active {
+                color: @ini_text;
+            }
+        }
+    }
+}

css/area_togglelink.less

@@ -8,81 +8,102 @@
 .togglelink {
     &.page_main-content {
         position: absolute;
-        top: 0px;
+        top: 0;
         bottom: -1px;
         width: 2rem;
         left: -(@margin-default);
         z-index: 1;
-        @media @screen_max-md{
+
+        @media @screen_max-md {
             display: none;
         }
 
         a {
+            .fontello-double();
+            .icon-right-bold();
+            .icon-left-bold();
+
             .display-flex();
             .flex-direction();
             .justify-content();
 
-            width: (@margin-default);
+            width: @margin-default;
             height: 100%;
-            background-color: @button_background;
-            border: solid 1px @button_background;
-            border-radius: @fix_border-radius 0 0 @fix_border-radius;
-            color: @button_color;
+            background-color: @ini_button_background;
+            border: solid 1px @ini_button_background;
+            border-radius: @ini_default_border_radius 0 0 @ini_default_border_radius; // @ini_default_border_radius vs. @fix_border-radius
+            color: @ini_button_color;
             text-decoration: none;
-            text-align: center;
             transition: @transition color, @transition background-color, @transition border-color;
 
+            &::before,
+            &::after {
+                width: 100%;
+                opacity: .6;
+                font-size: 1rem;
+                line-height: 1;
+                text-align: center;
+                margin: 0;
+                transition: @transition opacity;
+            }
+
+            &::before {
+                opacity: 1;
+                font-size: 1.25rem;
+            }
+
             &:hover,
             &:focus,
             &:active {
-                background-color: @button_color;
-                border-color: @button_background;
-                color: @button_background;
+                background-color: @ini_button_color;
+                border-color: @ini_button_background;
+                color: @ini_button_background;
                 text-decoration: none;
 
                 * {
                     color: inherit;
                     text-decoration: none;
                 }
+
+                &::after {
+                    opacity: 0;
+                }
             }
         }
 
-
 /* + + +  toggle out  + + + */
         .wide-content & {
             left: -1px;
 
             a {
-                background-color: @button_background;
-                border-color: @button_background;
-                border-radius: 0 @fix_border-radius @fix_border-radius 0;
+                background-color: @ini_button_background;
+                border-color: @ini_button_background;
+                border-radius: 0 @ini_default_border_radius @ini_default_border_radius 0; // @ini_default_border_radius vs. @fix_border-radius
+
+                &::before {
+                    opacity: .6;
+                    font-size: 1rem;
+                }
+
+                &::after {
+                    opacity: 1;
+                    font-size: 1.25rem;
+                }
 
                 &:hover,
                 &:focus,
                 &:active {
-                    background-color: @button_color;
+                    background-color: @ini_button_color;
+
+                    &::before {
+                        opacity: 0;
+                    }
+
+                    &::after {
+                        opacity: 1;
+                    }
                 }
             }
         }
     }
 }
-
-
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
-/* min-width: 1440px */
-
-@media @screen_min-xlg {
-    .togglelink {
-
-    }
-}
-
-
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
-/* max-width: 1199px */
-
-@media @screen_max-xlg {
-    .togglelink {
-
-    }
-}

css/base.less

@@ -5,92 +5,102 @@
  */
 
 
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
-/* converted vars */
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
-
-@background_page-header: __background_page-header__;
-
-@border-radius:          __default_border_radius__;
-
-@font_family_screen:     __font_family_screen__;
-
-@color-text:             __text__;
-@color-border:           __border__;
-@color-border-light:     __border_light__;
-@color-nav:              __nav_menu_color__;
-@color-nav-hover:        __nav_menu_hover_color__;
-@color-nav-hover-bg:     __nav_menu_hover_bg__;
-
-@color-content-bg:       __background_content__;
-@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__;
-@box-shadow-right-bottom:__box_shadow_right_bottom__;
-@box-shadow-bottom:      __box_shadow_bottom__;
-
-@th_background:          __background_alt__;
-
-
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* global vars */
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
 
-@height-context-bar: 50px;
+@font_family_screen:       arial, sans-serif;
+@font_family_print:        "Times New Roman", serif;
 
-@margin-small:       1rem;
-@margin-default:     2rem;
-@margin-big:         3.07rem;
+@nav_direct_background:    @ini_background_content;
+@nav_direct_color:         @ini_existing;
 
-@small-spacing:      .3rem;
-@very-small-spacing: .2rem;
+@ini_sidebar_width:        (100 - @ini_site_width) - 4;
 
-@grid:               @margin-small;
+@height-context-bar:       50px;
+
+@margin-small:             1rem;
+@margin-default:           2rem;
+@margin-big:               3.07rem;
+
+@small-spacing:            .3rem;
+@very-small-spacing:       .2rem;
+
+@grid:                     @margin-small;
+@toggle-size:              1.75rem;
+
+@transition:               ease-out .30s;
+
+@box-shadow-offset:        .1em .1em .1em rgba(153,153,153,.5); // pagetools, tabinclude
+@box-shadow:               0 0 .5em rgba(153,153,153,.5);
+@box-shadow-colored:       0 0 .5em fade(@ini_existing, 50%);
+@box-shadow-right-bottom:  0.1em 0.3rem 0.5em rgba(153,153,153,.5);
+@box-shadow-bottom:        0 .1em .5em rgba(153,153,153,.5); // qc-wrapper - breadcrumb
 
-@transition: ease-out .30s;
 
 /* + + +  for programmers customizing  + + + */
+
 @fix_border-radius:        3px;
+
 @toggle-showsidebar_width: 3.07rem;       // shown sidebar after toggle
+
 @page_padding-top:         @margin-small; // padding-top for 'dokuwiki__content'
 @page-header_height:       2.8rem;        // minimum: 2.8rem (height for breadcrumb, page-header, page-footer)
 @meta-box_height:          (@page-header_height - @page_padding-top);
 @breadcrumb_height:        @page-header_height;
+
 @formfield_min-height:     2rem;          // min-height for input, textarea, select, keygen
 
+//@metanav-ini_background:   rgba(0, 0, 0, .1);
+
+
+/* icons */
+@noopentasks-background:   #ECECEC; /* metabox tabs + num in icons + tabinclude + code, pre, samp, kbd */
+@noopentasks-border:       #BBB; /* metabox tabs + num in icons + code, pre, samp, kbd */
+@noopentasks-color:        #666; /* metabox tabs + num in icons + code, pre, samp, kbd */
+@wikiicons-border:         #CCC; /* usertools, breadcrumbs icons, pagetools box-hover */
+
+
+/* navigation left */
+@quicksearch-button-color: @noopentasks-color; /* autosuggest, submit in quicksearch */
+@suggestion-zebra:         #EEE;
+
+
+/* edit mode */
+@highlight-odd-ini_text:  fade(@ini_background_content, 95%);
+@highlight-even-ini_text: fade(@ini_text, 5%);
+@color-editBox:           #252525; // editmode for tables
+
+
+//@nolinkedicon-ini_background: fade(@ini_background, 10%);
+//@opacity-ini_nav_menu_color:  fade(@ini_nav_menu_color, 40%);
+
 
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* fonts */
 
-@font-size-very-small: .73rem;
-@font-size-small: .88rem;
-@font-size-default: 1rem;
-@font-size-big: 1.5rem;
-@font-size-bigger: 1.75rem;
+@font-size-very-small:     .73rem;
+@font-size-small:          .88rem;
+@font-size-default:        1rem;
+@font-size-big:            1.5rem;
+@font-size-bigger:         1.75rem;
 
-@line-height-default: 125%;
-@line-height-big: 135%;
-@line-height-bigger: 140%;
+@line-height-default:      125%;
+@line-height-big:          135%;
+@line-height-bigger:       140%;
 
-@font-weight-bold: 800;
-@font-weight-normal: 400;
+@font-weight-bold:         800;
+@font-weight-normal:       400;
 
-@font-scale-factor: .0769;
+@font-scale-factor:        .0769;
 
 @font-size-head6: @font-size-default;
 @font-size-head5: @font-size-default + @font-scale-factor;
-@font-size-head4: @font-size-default + (@font-scale-factor * 2);
-@font-size-head3: @font-size-default + (@font-scale-factor * 3);
-@font-size-head2: @font-size-default + (@font-scale-factor * 4);
-@font-size-head1: @font-size-default + (@font-scale-factor * 5);
+@font-size-head4: @font-size-default + (@font-scale-factor * 3);
+@font-size-head3: @font-size-default + (@font-scale-factor * 5);
+@font-size-head2: @font-size-default + (@font-scale-factor * 7);
+@font-size-head1: @font-size-default + (@font-scale-factor * 9);
+
 
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* breakpoints */
@@ -114,7 +124,7 @@
 @break-max-xlg: (@break-min-xlg - 1);
 
 @break-min-xxlg: 1600;
-@break-max-xxlg: (@break-min-xlg - 1);
+@break-max-xxlg: (@break-min-xxlg - 1);
 
 
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + */
@@ -131,7 +141,6 @@
 
 @screen_min-md: ~"only screen and (min-width: " ~"@{break-min-md}px)";
 @screen_max-md: ~"only screen and (max-width: " ~"@{break-max-md}px)";
-@screen_only-md: ~"only screen and (min-width: 800px) and (max-width: " ~"@{break-max-md}px)";
 
 @screen_min-lg: ~"only screen and (min-width: " ~"@{break-min-lg}px)";
 @screen_max-lg: ~"only screen and (max-width: " ~"@{break-max-lg}px)";
@@ -142,6 +151,10 @@
 @screen_min-xxlg: ~"only screen and (min-width: " ~"@{break-min-xxlg}px)";
 @screen_max-xxlg: ~"only screen and (max-width: " ~"@{break-max-xxlg}px)";
 
+@screen_only-md: ~"only screen and (min-width: 800px) and (max-width: " ~"@{break-max-md}px)";
+@screen_only-lg: ~"only screen and (min-width: " ~"@{break-min-md}px) and (max-width: " ~"@{break-max-xlg}px)";
+@screen_xs-lg: ~"only screen and (min-width: " ~"@{break-min-xs}px) and (max-width: " ~"@{break-max-md}px)";
+
 
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* col width */
@@ -201,7 +214,7 @@ q {
 
 acronym {
     cursor: help;
-    border-bottom: dotted 1px #333;
+    border-bottom: dotted 1px @ini_text;
 }
 
 *:focus {
@@ -244,7 +257,7 @@ nav > ul {
     &::before,
     &::after {
         display: table;
-        content: "  ";
+        content: ' ';
         clear: both;
     }
 }
@@ -273,6 +286,7 @@ nav > ul {
 
 .mobile-only {
     display: none;
+
     @media @screen_max-md {
         display: inline-block;
     }
@@ -286,6 +300,13 @@ nav > ul {
     }
 }
 
+.desktop-only {
+    display: none;
+    @media @screen_min-md {
+        display: inline-block;
+    }
+}
+
 
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* screen only */

css/base_design.less

@@ -7,11 +7,7 @@
 
 
 html, body {
-    background-color: @color-site-bg;
-}
-
-a {
-    color: @color-link;
+    background-color: @ini_background;
 }
 
 
@@ -30,73 +26,93 @@ a {
     font-weight: bold;
 }
 
-.dokuwiki .pageId {
-    float: right;
-    margin-right: -1em;
-    margin-bottom: -1px;
-    margin-top: -1.5em;
-    overflow: hidden;
-    padding: 0.5em 1em 0;
+.dokuwiki {
+    .page ol li,
+    .page ul li,
+    .aside ul li {
+        color: @ini_text;
+    }
 
-    span {
+    .pageId {
+        float: right;
+        margin-right: -1em;
+        margin-bottom: -1px;
+        margin-top: -1.5em;
+        overflow: hidden;
+        padding: 0.5em 1em 0;
+
+        span {
+            font-size: @font-size-small;
+            border: solid @ini_background_alt;
+            border-width: 1px 1px 0;
+            background-color: @ini_background;
+            color: @ini_text_alt;
+            padding: .1em .35em;
+            border-top-left-radius: 2px;
+            border-top-right-radius: 2px;
+            box-shadow: 0 0 .5em @ini_text_alt;
+            display: block;
+        }
+    }
+
+    div.page {
+        clear: both;
+        overflow: hidden;
+        word-wrap: break-word;
+        background: @ini_background_content;
+        color: inherit;
+        padding: @page_padding-top @margin-default @margin-default;
+
+        @media @screen_max-md {
+            padding-right: (@margin-default * 1.6);
+        }
+
+        @media @screen_max-xs {
+            padding-left: @margin-small;
+        }
+    }
+
+    .content #dokuwiki__pagetools {
+        @media @screen_max-md {
+            top: 4rem;
+        }
+    }
+
+    .docInfo {
         font-size: @font-size-small;
-        border: solid @ini_background_alt;
-        border-width: 1px 1px 0;
-        background-color: @ini_background;
-        color: @ini_text_alt;
-        padding: .1em .35em;
-        border-top-left-radius: 2px;
-        border-top-right-radius: 2px;
-        box-shadow: 0 0 .5em @ini_text_alt;
-        display: block;
+        text-align: right;
     }
-}
 
-.dokuwiki div.page {
-    clear: both;
-    overflow: hidden;
-    word-wrap: break-word;
-    background: @color-content-bg;
-    color: inherit;
-    // margin-bottom: .5rem; // no margin: if there is another bg-color, then there is an #fff border
-    padding: @page_padding-top @margin-default @margin-default;
+    /* license note under edit window */
+    div.license {
+        font-size: @font-size-small;
+        line-height: @line-height-default;
+        padding-top: 1rem;
 
-    @media @screen_max-md{
-        padding-right: (@margin-default *1.6);
+        @media @screen_max-lg {
+            font-size: @font-size-default;
+        }
+
+        @media @screen_max-md {
+            font-size: @font-size-small;
+        }
+
+        * {
+            font-size: inherit;
+        }
     }
-}
-.content #dokuwiki__pagetools{
-    @media @screen_max-md{
-        top: 4rem;
+
+    [dir=rtl] & .docInfo {
+        text-align: left;
     }
-}
 
-.dokuwiki .docInfo {
-    font-size: @font-size-small;
-    text-align: right;
-}
-
-/* license note under edit window */
-.dokuwiki div.license {
-    font-size: @font-size-small;
-    line-height: @line-height-default;
-    padding-top: 1rem;
-
-    * {
-        font-size: inherit;
+    [dir=rtl] & .pageId {
+        float: left;
+        margin-left: -1em;
+        margin-right: 0;
     }
 }
 
-[dir=rtl] .dokuwiki .docInfo {
-    text-align: left;
-}
-
-[dir=rtl] .dokuwiki .pageId {
-    float: left;
-    margin-left: -1em;
-    margin-right: 0;
-}
-
 caption,
 figcaption,
 summary,
@@ -136,27 +152,77 @@ h1 {
 h2 {
     font-size: @font-size-head2;
     margin: 0 0 @font-size-head2;
+    padding-top: (@font-size-head2 / 2);
+
+    .secedit + &,
+    .section_highlight &:first-child {
+        padding-top: 0;
+    }
+
+    .section_highlight + & {
+        padding-top: (@font-size-head2 / 2);
+    }
 }
 
 h3 {
     font-size: @font-size-head3;
     margin: 0 0 @font-size-head3;
+    padding-top: (@font-size-head3 / 2);
+
+    .secedit + &,
+    .section_highlight &:first-child {
+        padding-top: 0;
+    }
+
+    .section_highlight + & {
+        padding-top: (@font-size-head3 / 2);
+    }
 }
 
 h4 {
     font-size: @font-size-head4;
     margin: 0 0 @font-size-head4;
+    padding-top: (@font-size-head4 / 2);
+
+    .secedit + &,
+    .section_highlight &:first-child {
+        padding-top: 0;
+    }
+
+    .section_highlight + & {
+        padding-top: (@font-size-head4 / 2);
+    }
 }
 
 h5 {
     font-size: @font-size-head5;
     margin: 0 0 @font-size-head5;
+    padding-top: (@font-size-head5 / 2);
+
+    .secedit + &,
+    .section_highlight &:first-child {
+        padding-top: 0;
+    }
+
+    .section_highlight + & {
+        padding-top: (@font-size-head5 / 2);
+    }
 }
 
 h6 {
     font-size: @font-size-head6;
     font-weight: @font-weight-bold;
     margin: 0 0 @font-size-head6;
+    padding-top: (@font-size-head6 / 2);
+
+    .secedit + &,
+    .section_highlight &:first-child {
+        padding-top: 0;
+    }
+
+    .section_highlight + & {
+        padding-top: (@font-size-head6 / 2);
+    }
 }
 
 p {
@@ -297,11 +363,31 @@ ol ol ol ol ol {
     list-style-type: lower-roman;
 }
 
+
+/*____________ tables ____________*/
+
+.dokuwiki {
+    table.inline tr:hover {
+        th {
+            background-color: fade(@ini_background_alt, 50%);
+        }
+
+        td {
+            background-color: fade(@ini_background_alt, 80%);
+            color: @ini_text_alt;
+
+            *:not(button,a) {
+                color: @ini_text_alt;
+            }
+        }
+    }
+}
+
 table {
     border-collapse: collapse;
     empty-cells: show;
     border-spacing: 0;
-    border: 1px solid @color-border;
+    border: 1px solid @ini_border;
     font-size: @font-size-default;
     line-height: 140%;
 }
@@ -320,12 +406,13 @@ td {
     padding: .3em .5em;
     margin: 0;
     vertical-align: top;
-    border: 1px solid @color-border;
+    border: 1px solid @ini_border;
 }
 
 th {
     font-weight: bold;
     background-color: @ini_background_alt;
+    color: @ini_text_alt;
     text-align: left;
 }
 
@@ -335,18 +422,18 @@ th {
 
 a {
     outline: none;
-}
 
-a:link,
-a:visited {
-    text-decoration: none;
-    color: @color-link;
-}
+    &:link,
+    &:visited {
+        text-decoration: none;
+        color: @ini_link; // links to non wikipages (external links)
+    }
 
-a:hover,
-a:focus,
-a:active {
-    text-decoration: underline;
+    &:hover,
+    &:focus,
+    &:active {
+        text-decoration: underline;
+    }
 }
 
 img {
@@ -373,7 +460,7 @@ button img {
 }
 
 hr {
-    border-top: solid @color-border;
+    border-top: solid @ini_border;
     border-bottom: solid @ini_background;
     border-width: 1px 0;
     height: 0;
@@ -395,7 +482,7 @@ em abbr {
 
 mark {
     background-color: @ini_highlight;
-    color: inherit;
+    color: @ini_highlight_text;
 }
 
 pre,
@@ -407,25 +494,28 @@ kbd {
     font-size: @font-size-default;
     direction: ltr;
     text-align: left;
-    background-color: @color-site-bg;
-    color: @color-text;
-    box-shadow: inset 0 0 .3em @color-border;
+    background-color: @noopentasks-background;
+    color: @noopentasks-color;
+    box-shadow: inset 0 0 .3em @noopentasks-border;
     border-radius: @fix_border-radius;
+    padding-left: @small-spacing;
+    padding-right: @small-spacing;
 }
 
 pre {
     overflow: auto;
     word-wrap: normal;
-    border: 1px solid @color-border;
+    background-color: @noopentasks-background;
+    border: 1px solid @noopentasks-border;
     border-radius: @fix_border-radius;
-    box-shadow: inset 0 0 .5em @color-border;
+    box-shadow: inset 0 0 .5em @noopentasks-border;
     font-size: @font-size-default;
     line-height: 140%;
     padding: .7em 1em;
 }
 
 blockquote {
-    border: solid @color-border;
+    border: solid @ini_border;
     border-width: 0 0 0 .25em;
     font-size: @font-size-default;
     line-height: 140%;
@@ -458,248 +548,3 @@ sup {
 small {
     font-size: .9em;
 }
-
-
-/*____________ forms ____________*/
-
-/* for all of the form styles, style.ini colours are not used on purpose (except for fieldset border) */
-
-form {
-    display: inline;
-    margin: 0;
-    padding: 0;
-}
-
-fieldset {
-    font-size: @font-size-default;
-    line-height: 140%;
-    border: 1px solid @ini_text_alt;
-    padding: .7rem 1rem;
-}
-
-fieldset > :last-child {
-    margin-bottom: 0;
-}
-
-legend {
-    margin: 0;
-    padding: 0 .1em;
-}
-
-label {
-    vertical-align: middle;
-    cursor: pointer;
-}
-
-input,
-textarea,
-button,
-select,
-optgroup,
-option,
-keygen,
-output,
-meter,
-progress {
-    font: inherit;
-    font-weight: normal;
-    color: #333;
-    background-color: #fff;
-    line-height: normal;
-    margin: 0;
-    vertical-align: middle;
-    box-sizing: border-box;
-}
-
-select {
-    max-width: 100%;
-}
-
-textarea.edit {
-    font-size: @font-size-default;
-}
-
-optgroup {
-    font-style: italic;
-    font-weight: bold;
-}
-
-option {
-    font-style: normal;
-    font-weight: normal;
-}
-
-input,
-textarea,
-select,
-keygen {
-    min-height: @formfield_min-height;
-    border: 1px solid @color-border;
-    box-shadow: inset 0 0 1px #eee;
-    border-radius: @fix_border-radius;
-    padding-left: .3rem;
-    padding-right: .3rem;
-}
-
-input:active,
-input:focus,
-textarea:active,
-textarea:focus,
-select:active,
-select:focus,
-keygen:active,
-keygen:focus {
-    border-color: #999;
-}
-
-input[type=radio],
-input[type=checkbox],
-input[type=image] {
-    padding: 0;
-    border-style: none;
-    box-shadow: none;
-}
-
-
-/* + + + + +  buttons  + + + + + */
-button {
-    background-color: #eee;
-    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc4MjQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRkZGRkYiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNGNEY0RjQiIG9mZnNldD0iMC4zIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0VFRUVFRSIgb2Zmc2V0PSIwLjk5Ii8+PHN0b3Agc3RvcC1jb2xvcj0iI0NDQ0NDQyIgb2Zmc2V0PSIuOTkiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnODI0KSIgLz4KPC9zdmc+);
-    background-image: linear-gradient(to bottom, #ffffff 0%, #f4f4f4 30%, #eeeeee 99%, #cccccc 99%);
-    border: 1px solid #ccc;
-    border-radius: @fix_border-radius;
-    color: #333;
-    padding: .1em .5em;
-    cursor: pointer;
-    transition: @transition background-color, @transition color;
-
-    &:hover,
-    &:focus,
-    &:active {
-        background-color: #ddd;
-        background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc2NzAiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRkZGRkYiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNGNEY0RjQiIG9mZnNldD0iMC4zIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0RERERERCIgb2Zmc2V0PSIwLjk5Ii8+PHN0b3Agc3RvcC1jb2xvcj0iI0JCQkJCQiIgb2Zmc2V0PSIuOTkiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnNjcwKSIgLz4KPC9zdmc+);
-        background-image: linear-gradient(to bottom, #ffffff 0%, #f4f4f4 30%, #dddddd 99%, #bbbbbb 99%);
-        border-color: #999;
-    }
-}
-
-
-/* + + +  all types of submit-buttons  + + + */
-form input[type=submit], // heredity 'adnewpage'
-a.button,
-input[type=submit],
-input[type=reset],
-button[type=submit],
-.qq-upload-button {
-    cursor: pointer;
-    box-shadow: none;
-    background-image: none;
-    background-color: @button_background;
-    border: 1px solid @button_background;
-    border-radius: @fix_border-radius;
-    color: @button_color;
-    padding: .3em @grid;
-    transition: @transition background-color, @transition color;
-
-    &:hover,
-    &:active,
-    &:focus {
-        background-color: @button_color;
-        color: @button_background;
-    }
-}
-
-input[type=submit],
-button[type=submit] {
-    &[disabled] {
-        cursor: default;
-        &:hover,
-        &:active,
-        &:focus {
-            box-shadow: none;
-            background-image: none;
-            background-color: @button_background;
-            color: @button_color;
-            border-color: @button_background;
-        }
-    }
-
-    + span {
-        display: block;
-        margin-top: @grid;
-    }
-}
-
-
-/* + + +  all types of buttons not being submit-buttons  + + + */
-input.button,
-input[type=button] {
-    cursor: pointer;
-    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc4MjQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRkZGRkYiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNGNEY0RjQiIG9mZnNldD0iMC4zIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0VFRUVFRSIgb2Zmc2V0PSIwLjk5Ii8+PHN0b3Agc3RvcC1jb2xvcj0iI0NDQ0NDQyIgb2Zmc2V0PSIuOTkiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnODI0KSIgLz4KPC9zdmc+);
-    background-image: linear-gradient(to bottom, #ffffff 0%, #f4f4f4 30%, #eeeeee 99%, #cccccc 99%);
-    background-color: #eee;
-    border: 1px solid #ccc;
-    border-radius: @fix_border-radius;
-    color: #333;
-    padding: .1em .5em;
-    transition: @transition background-color, @transition color;
-
-    &:hover,
-    &:active,
-    &:focus {
-        background-color: #ddd;
-        border-color: #999;
-        background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc2NzAiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRkZGRkYiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNGNEY0RjQiIG9mZnNldD0iMC4zIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0RERERERCIgb2Zmc2V0PSIwLjk5Ii8+PHN0b3Agc3RvcC1jb2xvcj0iI0JCQkJCQiIgb2Zmc2V0PSIuOTkiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnNjcwKSIgLz4KPC9zdmc+);
-        background-image: linear-gradient(to bottom, #ffffff 0%, #f4f4f4 30%, #dddddd 99%, #bbbbbb 99%);
-    }
-}
-
-
-/* + + +  all disabled buttons  + + + */
-input[disabled],
-button[disabled],
-select[disabled],
-textarea[disabled],
-option[disabled],
-input[readonly],
-button[readonly],
-select[readonly],
-textarea[readonly] {
-    cursor: auto;
-    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc4MjQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRkZGRkYiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNGNEY0RjQiIG9mZnNldD0iMC4zIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0VFRUVFRSIgb2Zmc2V0PSIwLjk5Ii8+PHN0b3Agc3RvcC1jb2xvcj0iI0NDQ0NDQyIgb2Zmc2V0PSIuOTkiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnODI0KSIgLz4KPC9zdmc+);
-    background-image: linear-gradient(to bottom, #ffffff 0%, #f4f4f4 30%, #eeeeee 99%, #cccccc 99%);
-    background-color: #eee;
-    opacity: .5;
-    border: 1px solid @color-border;
-    border-radius: @fix_border-radius;
-    color: #333;
-    font-weight: normal;
-    padding: .3em @grid;
-    transition: @transition background-color, @transition color;
-    &:hover,
-    &:active,
-    &:focus {
-        background-color: #ddd;
-        background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc2NzAiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRkZGRkYiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNGNEY0RjQiIG9mZnNldD0iMC4zIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0RERERERCIgb2Zmc2V0PSIwLjk5Ii8+PHN0b3Agc3RvcC1jb2xvcj0iI0JCQkJCQiIgb2Zmc2V0PSIuOTkiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnNjcwKSIgLz4KPC9zdmc+);
-        background-image: linear-gradient(to bottom, #ffffff 0%, #f4f4f4 30%, #dddddd 99%, #bbbbbb 99%);
-        border-color: #999;
-        color: #333;
-    }
-}
-input::-moz-focus-inner,
-button::-moz-focus-inner {
-    border: 0;
-    padding: 0;
-}
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
-/* media queries */
-@media @screen_max-lg {
-    .dokuwiki div.license {
-        font-size: @font-size-default;
-    }
-}
-@media @screen_max-md {
-    .dokuwiki div.license {
-        font-size: @font-size-small;
-    }
-}

css/base_fontello-icons.less

@@ -0,0 +1,149 @@
+/**
+ * This file provides styles for web fonts and icon fonts
+ *
+ * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
+ */
+
+
+/* icon font */
+.setIconFontFace('fontello','fontello');
+
+.icon, [class^="icon-"], [class*=" icon-"]{
+    .fontello();
+}
+
+
+/* + + + + +  fontello codes  + + + + + */
+/**
+ * If in the Fontello-Packet an icon is added, the code should be supplemented here:
+*/
+
+.icon-emo-happy          { &::before { content: '\e804'; } } /* '' */
+.icon-emo-wink           { &::before { content: '\e805'; } } /* '' */
+.icon-emo-unhappy        { &::before { content: '\e806'; } } /* '' */
+.icon-emo-sleep          { &::before { content: '\e807'; } } /* '' */
+.icon-emo-thumbsup       { &::before { content: '\e808'; } } /* '' */
+.icon-emo-grin           { &::before { content: '\e80c'; } } /* '' */
+.icon-emo-angry          { &::before { content: '\e80d'; } } /* '' */
+.icon-emo-cry            { &::before { content: '\e80f'; } } /* '' */
+.icon-emo-squint         { &::before { content: '\e811'; } } /* '' */
+.icon-emo-laugh          { &::before { content: '\e812'; } } /* '' */
+.icon-emo-wink2          { &::before { content: '\e813'; } } /* '' */
+
+.icon-up                 { &::before { content: '\e853'; } } /* '' */
+.icon-up-small           { &::before { content: '\e82f'; } } /* '' */
+.icon-up-thick           { &::before { content: '\e831'; } } /* '' */
+.icon-up-open-big        { &::before { content: '\e848'; } } /* '' */
+
+.icon-down               { &::before { content: '\e859'; } } /* '' */
+.icon-down-small         { &::before { content: '\e834'; } } /* '' */
+.icon-down-thick         { &::before { content: '\e835'; } } /* '' */
+.icon-down-bold          { &::before { content: '\e883'; } } /* '' */
+
+.icon-right-small        { &::before { content: '\e82d'; } } /* '' */
+.icon-right-thick        { &::before { content: '\e82e'; } } /* '' */
+
+.icon-left-small         { &::before { content: '\e836'; } } /* '' */
+.icon-left-thick         { &::before { content: '\e82c'; } } /* '' */
+.icon-left-bold          { &::before { content: '\e837'; } } /* '' */
+
+.icon-smile              { &::before { content: '\e85e'; } } /* '' */
+.icon-frown              { &::before { content: '\e84b'; } } /* '' */
+.icon-meh                { &::before { content: '\e85f'; } } /* '' */
+
+.icon-help               { &::before { content: '\e83c'; } } /* '' */
+.icon-menu               { &::before { content: '\e854'; } } /* '' */
+.icon-home               { &::before { content: '\e842'; } } /* '' */
+.icon-search             { &::before { content: '\e855'; } } /* '' */
+.icon-user               { &::before { content: '\e833'; } } /* '' */
+.icon-user-circle        { &::before { content: '\e86c'; } } /* '' */
+.icon-login              { &::before { content: '\e845'; } } /* '' */
+.icon-logout             { &::before { content: '\e847'; } } /* '' */
+
+.icon-dividers           { &::before { content: '\e801'; } } /* '' */
+.icon-cog                { &::before { content: '\e84e'; } } /* '' */
+.icon-cog-alt            { &::before { content: '\e818'; } } /* '' */
+.icon-attachment         { &::before { content: '\e832'; } } /* '' */
+.icon-revert-replay      { &::before { content: '\e839'; } } /* '' */
+.icon-bell               { &::before { content: '\e83a'; } } /* '' */
+.icon-bookmark-empty     { &::before { content: '\e83b'; } } /* '' */
+.icon-check              { &::before { content: '\e841'; } } /* '' */
+.icon-checkbox-marked    { &::before { content: '\e844'; } } /* '' */
+.icon-down-open-big      { &::before { content: '\e846'; } } /* '' */
+.icon-star               { &::before { content: '\e860'; } } /* '' */
+.icon-star-outline       { &::before { content: '\e84c'; } } /* '' */
+.icon-sitemap            { &::before { content: '\e84d'; } } /* '' */
+.icon-puzzle             { &::before { content: '\e84f'; } } /* '' */
+.icon-plus               { &::before { content: '\e850'; } } /* '' */
+.icon-minus              { &::before { content: '\e852'; } } /* '' */
+.icon-pencil-1           { &::before { content: '\e851'; } } /* '' */
+.icon-clipboard          { &::before { content: '\e857'; } } /* '' */
+.icon-clipboard-empty    { &::before { content: '\e856'; } } /* '' */
+.icon-clock              { &::before { content: '\e858'; } } /* '' */
+.icon-cloud              { &::before { content: '\e85a'; } } /* '' */
+.icon-mail               { &::before { content: '\e85d'; } } /* '' */
+
+.icon-folder-image       { &::before { content: '\e809'; } } /* '' */
+.icon-file-new           { &::before { content: '\e83d'; } } /* '' */
+.icon-file               { &::before { content: '\e83e'; } } /* '' */
+.icon-file-export        { &::before { content: '\e80a'; } } /* '' */
+.icon-files              { &::before { content: '\e849'; } } /* '' */
+
+.icon-comment-question   { &::before { content: '\e880'; } } /* '' */
+.icon-jira               { &::before { content: '\e881'; } } /* '' */
+
+
+/* + + + + +  additional "after" for nav-pagetools  + + + + + */
+
+.icon-pencil {
+    &::before,
+    &::after { content: '\e840'; }
+}
+.icon-pencil-add {
+    &::before,
+    &::after { content: '\e800'; }
+}
+.icon-revisions-history {
+    &::before,
+    &::after { content: '\e803'; }
+}
+.icon-link {
+    &::before,
+    &::after { content: '\e843'; }
+}
+.icon-file-pdf {
+    &::before,
+    &::after { content: '\e838'; }
+}
+.icon-file-xml {
+    &::before,
+    &::after { content: '\e802'; }
+}
+.icon-up-bold {
+    &::before,
+    &::after { content: '\e830'; }
+}
+.icon-disk {
+    &::before,
+    &::after{ content: '\e85c'; }
+}
+.icon-file-text {
+    &::before,
+    &::after{ content: '\e84a'; }
+}
+.icon-book-open {
+    &::before,
+    &::after { content: '\e83f'; }
+}
+.icon-code-braces {
+    &::before,
+    &::after { content: '\e85b'; }
+}
+.icon-code {
+    &::before,
+    &::after { content: '\e861'; }
+}
+.icon-right-bold {
+    &::before,
+    &::after { content: '\e882'; }
+}

css/base_fonts.less

@@ -1,277 +0,0 @@
-/**
- * This file provides styles for web fonts and icon fonts
- *
- * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
- */
-
-/* icon font */
-.setIconFontFace('fontello','fontello');
-
-.icon, [class^="icon-"], [class*=" icon-"]{
-  .fontello();
-}
-
-/* custom icon font */
-.icon-user{
-    &::before {
-        content: '\e800';
-    }
-}
-.icon-logout{
-    &::before {
-        content: '\e801';
-    }
-}
-
-.icon-login{
-    &::before {
-        content: '\e802';
-    }
-}
-
-.icon-clipboard{
-    &::before {
-        content: '\e803';
-    }
-}
-
-.icon-emo-happy {
-    &::before {
-        content: '\e804';
-    }
-}
-
-.icon-emo-wink {
-    &::before {
-        content: '\e805';
-    }
-}
-
-.icon-emo-unhappy {
-    &::before {
-        content: '\e806';
-    }
-}
-
-.icon-emo-sleep{
-    &::before {
-        content: '\e807';
-    }
-}
-
-.icon-emo-thumbsup {
-    &::before {
-        content: '\e808';
-    }
-}
-
-.icon-clock{
-    &::before {
-        content: '\e809';
-    }
-}
-
-.icon-link{
-    &::before {
-        content: '\e80a';
-    }
-}
-.icon-link-after{
-    &::after {
-        content: '\e80a';
-    }
-}
-
-.icon-bell{
-    &::before {
-        content: '\e80b';
-    }
-}
-
-.icon-emo-grin{
-    :before {
-        content: '\e80c';
-    }
-}
-
-.icon-emo-angry{
-    &::before {
-        content: '\e80d';
-    }
-}
-
-.icon-mail{
-    &::before {
-        content: '\e80e';
-    }
-}
-
-.icon-emo-cry {
-    &::before {
-        content: '\e80f';
-    }
-}
-
-.icon-cloud{
-    &::before {
-        content: '\e810';
-    }
-}
-
-.icon-emo-squint{
-    &::before {
-        content: '\e811';
-    }
-}
-
-.icon-emo-laugh{
-    &::before {
-        content: '\e812';
-    }
-}
-
-.icon-emo-wink2{
-    &::before {
-        content: '\e813';
-    }
-}
-
-.icon-cloud-1{
-    &::before {
-        content: '\e814';
-    }
-}
-
-.icon-home-outline{
-    &::before {
-        content: '\e815';
-    }
-}
-
-.icon-home() {
-    &::before {
-        content: '\e816';
-    }
-}
-
-.icon-search() {
-    &::before {
-        content: '\e81f';
-    }
-}
-
-.icon-puzzle-1{
-    &::before {
-        content: '\e817';
-    }
-}
-
-.icon-cog-alt{
-    &::before {
-        content: '\e818';
-    }
-}
-
-.icon-cog{
-    &::before {
-        content: '\e819';
-    }
-}
-
-.icon-help{
-    &::before {
-        content: '\e81a';
-    }
-}
-
-.icon-bookmark-empty{
-    &::before {
-        content: '\f097';
-    }
-}
-
-.icon-menu{
-    &::before {
-        content: '\f0c9';
-    }
-}
-
-.icon-sitemap{
-    &::before {
-        content: '\f0e8';
-    }
-}
-
-.icon-doc-text{
-    &::before {
-        content: '\f0f6';
-    }
-}
-
-.icon-doc-text-after{
-    &::after {
-        content: '\f0f6';
-    }
-}
-
-.icon-smile{
-    &::before {
-        content: '\f118';
-    }
-}
-
-.icon-frown{
-    &::before {
-        content: '\f119';
-    }
-}
-
-.icon-meh {
-    &::before {
-        content: '\f11a';
-    }
-}
-
-.icon-puzzle {
-    &::before {
-        content: '\f12e';
-    }
-}
-.icon-puzzle-after {
-    &::after {
-        content: '\f12e';
-    }
-}
-
-.icon-file-pdf{
-    &::before {
-        content: '\f1c1';
-    }
-}
-
-.icon-doc-new{
-    &::before {
-        content: '\e81d';
-    }
-}
-
-.icon-book-open{
-    &::before {
-        content: '\e81c';
-    }
-}
-
-.icon-plus{
-    &::before {
-        content: '\e81e';
-    }
-}
-
-.icon-doc{
-    &::before {
-        content: '\e81b';
-    }
-}
-
-
-

css/base_mixins.less

@@ -142,15 +142,33 @@
 
 
 /* + + + + +  small icon-buttons (breadcrumb, page-header)  + + + + + */
-.btn-usertools-wrapper(@elem:2em) {
+.btn-hover {
+    background-color: @ini_nav_menu_hover_bg;
+    color: @ini_nav_menu_hover_color;
+    transition: @transition color, @transition background-color, @transition border-color;
+
+    &:hover,
+    &:active,
+    &:focus {
+        background-color: @ini_nav_menu_hover_color;
+        border-color: @ini_nav_menu_hover_color;
+        color: @ini_nav_menu_hover_bg;
+
+        .prefix {
+            color: inherit;
+        }
+    }
+}
+
+.btn-usertools-wrapper(@elem:@toggle-size) {
     display: inline-block;
     min-height: @elem;
     min-width: @elem;
     box-sizing: border-box;
-    color: @color-nav;
+    color: @ini_text_webframe;
     font-size: @font-size-small;
     padding: 0;
-    margin: 0 @very-small-spacing;
+    margin: 0 .25rem;
 
     * {
         font-size: @font-size-small;
@@ -161,28 +179,17 @@
     .num {
         position: absolute;
         right: -.4rem;
-        top: -.4em;
-        background-color: @button_background;
+        top: -.5em;
+        background-color: @ini_nav_menu_hover_color;
         border-radius: 2px;
-        color: @button_color;
+        color: @ini_nav_menu_hover_bg;
         font-size: @font-size-very-small;
         font-weight: 400;
         text-align: center;
         line-height: 1;
-        padding: @very-small-spacing @very-small-spacing .1em;
+        padding: .1em @very-small-spacing;
         transition: @transition color, @transition background-color;
     }
-
-    a {
-        &:hover,
-        &:active,
-        &:focus {
-            .num {
-                background-color: @button_background;
-                color: @button_color;
-            }
-        }
-    }
 }
 
 .btn-prefix () {
@@ -191,55 +198,53 @@
 
     color: inherit;
     font-size: @font-size-default;
-    margin-top: .35rem;
+
+    @media @screen_min-xxlg {
+        margin-top: .25rem;
+    }
+
+    @media @screen_max-xxlg {
+        margin-top: .3rem;
+    }
+
+    @media @screen_max-md {
+        margin-top: .25rem;
+    }
 }
 
-
-.btn-default-size() {
-    height: 1rem;
-    width: 1rem;
-    min-height: 1.2em;
-    min-width: 1.4em;
-}
-
-.btn-default-height() {
-    height: 1rem;
-    min-height: 1.2em;
-    min-width: 1.4em;
-}
-
-.hide-text-show-before(){
+.hide-text-show-before() {
     display: inline-block;
     overflow: hidden;
     white-space: nowrap;
     text-indent: -9999px;
-    .btn-default-size();
 
-    &::before{
-        text-indent: 0;
+    &::before {
         float: left;
+        width: 100%;
+        text-indent: 0;
+        margin: 0;
     }
 
-    &::after{
-        text-indent: 0;
+    &::after {
         float: left;
+        text-indent: 0;
     }
 }
 
-
 .hide-text-show-after() {
     display: inline-block;
     overflow: hidden;
     white-space: nowrap;
     text-indent: -9999px;
 
-    &::before{
-        text-indent: 0;
+    &::before {
         float: right;
+        text-indent: 0;
     }
-    &::after{
-        text-indent: 0;
+
+    &::after {
         float: right;
+        text-indent: 0;
     }
 }
 
@@ -259,13 +264,37 @@
     -webkit-flex-direction: @elem;
 }
 
-// default "center"
 .justify-content(@elem:center) {
     justify-content: @elem;
     -ms-justify-content: @elem;
     -webkit-justify-content: @elem;
 }
 
+.align-items(@elem:center) {
+    align-items: @elem;
+    -ms-align-items: @elem;
+    -webkit-align-items: @elem;
+}
+
+.flex(@elem:1 0 auto) {
+    flex: @elem;
+    -ms-flex: @elem;
+    -webkit-flex: @elem;
+}
+
+
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/* positioning */
+
+.center-middle() {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translateX(-50%) translateY(-50%);
+    -ms-transform: translateX(-50%) translateY(-50%);
+    -webkit-transform: translateX(-50%) translateY(-50%);
+}
+
 
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* Screenreader / Hide */

css/base_structure.less

@@ -39,7 +39,8 @@
 @media @screen_min-md {
     .make-grid(md);
     html {
-        font-size: 81.25%; //13px
+        font-size: 87.5%; //14px
+        //font-size: 81.25%; //13px
     }
 }
 
@@ -82,6 +83,7 @@
 
     .content .row > .col-xs-12 {
         z-index: 3;
+        border-radius: 0 @ini_default_border_radius @fix_border-radius @fix_border-radius; // @ini_default_border_radius vs. @fix_border-radius
     }
 
     .top-header {
@@ -97,7 +99,7 @@
             position: relative;
 
             > .col-xs-12 {
-                width: 23%;
+                width: @ini_sidebar_width;
                 box-sizing: border-box;
             }
         }
@@ -109,6 +111,12 @@
             height: 150px;
             min-height: 6rem;
             display: table;
+
+            + .col-xs-12 {
+                float: right;
+                width: @ini_site_width;
+                box-sizing: border-box;
+            }
         }
     }
 
@@ -126,62 +134,30 @@
         }
     }
 
-    .claim {
-        display: table-cell;
-        height: 100%;
-        vertical-align: middle;
-        .logo {
-            /*position: absolute;
-            bottom: 1em;
-            overflow: visible;*/
-            padding: 1rem 0 .3rem;
-
-
-            img {
-                height: 4.6rem;
-                width: auto;
-                border-style: solid;
-                border-color: transparent;
-                border-width: 2px 0;
-            }
-
-            a:hover,
-            a:focus,
-            a:active {
-                img {
-                    border-width: 0;
-                }
-            }
-        }
-
-
-    }
-
     .showSidebar {
         .content {
             .row > .col-xs-12 {
-                width: 73%;
+                width: @ini_site_width;
                 float: right;
             }
         }
     }
 
-    .wide-content{
-        .logo{ }
+    .wide-content {
         .content {
             .row > .col-xs-12 {
                 width: auto;
                 float: none;
             }
         }
-        &.showSidebar{
+
+        &.showSidebar {
             .content {
                 .row > .col-xs-12 {
                     margin-left: @toggle-showsidebar_width;
                 }
             }
         }
-
     }
 
     .main-sidebar {
@@ -220,14 +196,6 @@
         }
     }
 
-    #dokuwiki__header {
-        .logo {
-            /*width: 200px;
-            max-width: 33%;
-            margin: .8rem 0;*/
-        }
-    }
-
     .tools {
         .main-sidebar {
             display: none;
@@ -235,40 +203,27 @@
     }
 }
 
-@media @screen_max-md{
-    .claim{
-        min-height: 3rem;
-        .logo{
-            .mobile-only{
-                margin: .8rem 1rem .6rem 0;
-            }
-        }
-    }
-}
-
-@media @screen_max-xxs{
+@media @screen_max-xxs {
     @mobileMargin: 4px;
-    .container{
+
+    .container {
         margin: 0 @mobileMargin;
     }
-    body.show-mobile-sidebar #dokuwiki__aside{
+
+    body.show-mobile-sidebar #dokuwiki__aside {
         left: @mobileMargin;
     }
-    #dokuwiki__usertools{
+
+    #dokuwiki__usertools {
         right: @mobileMargin;
     }
-    #dokuwiki__footer{
-        .main-footer{
-            > *{
+
+    #dokuwiki__footer {
+        .main-footer {
+            > * {
                 padding-left: 2rem;
                 padding-right: 2rem;
             }
-
         }
     }
-    .page-footer{
-
-    }
-
 }
-

css/plugins/bureaucracy.less

@@ -1,6 +1,9 @@
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
-/* all media */
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/**
+ * This file provides styles for bureaucracy plugin
+ */
+
+
+/* + + + + +  global  + + + + + */
 
 .dokuwiki form.bureaucracy__plugin {
     fieldset {
@@ -42,7 +45,6 @@
         select {
             float: left;
             width: 50%;
-            //min-height: 2em;
             text-align: left;
             padding: .1em .2em;
         }
@@ -95,13 +97,6 @@
 }
 
 
-
-
-#icke__page .content ul.autocompletion {}
-
-ul.autocompletion li {}
-
-
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* min-width: 1440px */
 

css/plugins/configmanager.less

@@ -0,0 +1,27 @@
+/**
+ * This file provides styles for config manager
+ */
+
+
+/* + + + + +  config__manager  + + + + + */
+
+#dokuwiki__content {
+    #config__manager {
+        .selectiondefault {
+            background-color: transparent;
+        }
+
+        tr {
+            .input {
+                background-color: transparent;
+                color: inherit;
+            }
+        }
+
+        tr.default {
+            .input {
+                background-color: transparent;
+            }
+        }
+    }
+}

css/plugins/do_tasks.less

@@ -1,9 +1,28 @@
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
-/* all media */
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/**
+ * This file provides styles for do-task plugin
+ */
+
+
+/* + + + + +  global  + + + + + */
 
 ul.page-attributes {
     .plugin__do_pagetasks {
-        &.do_none { }
+        &.do_none {
+            position: relative;
+            border-radius: @ini_default_border_radius; // @ini_default_border_radius vs. @fix_border-radius
+
+            strong {
+                overflow: hidden;
+                background-color: @ini_background;
+                border-color: @noopentasks-border;
+                color: @ini_text_webframe;
+            }
+
+            .num {
+                margin-top: 1px;
+                background-color: @noopentasks-border; // fix
+                color: @noopentasks-color; // fix
+            }
+        }
     }
 }

css/plugins/edit.less

@@ -2,15 +2,39 @@
  * This file provides styles for the edit view (?do=edit), preview
  * and section edit buttons.
  */
-/* + + + + +  edit view  + + + + + */
-.dokuwiki {
 
-    .editBox {
+
+/* + + + + +  edit view  + + + + + */
+
+#dokuwiki__content {
+    div.section_highlight {
+        clear: right;
+    }
+
+    .secedit button {
+        clear: both;
+        font-size: 100%;
+        margin-top: .5rem;
+        margin-bottom: .5rem;
+    }
+
+    div.editBox {
+        background-color: #FFF;
+        border: solid 2px #FFF;
+        border-radius: @ini_default_border_radius;
+
         .editButtons {
             display: inline-block;
             padding-bottom: 1rem;
         }
+
+        * {
+            &:not(button) {
+                color: @color-editBox;
+            }
+        }
     }
+
 }
 
 
@@ -21,6 +45,7 @@
             margin-bottom: 1.5rem;
             clear: both;
         }
+
         #spr__meta-box {
             display: none;
         }

css/plugins/edittable.less

@@ -1,12 +1,46 @@
 /**
- * Style Adjustments for the edittable plugin
+ * This file provides styles for qc edittable plugin
  */
+
+
+/* + + + + +  global  + + + + + */
+
 #dokuwiki__content.main-content {
-    div.editbutton_table form div.no {
-        button,
-        input.button {
-            margin-top: 0;
-            font-size: @font-size-very-small;
+    div.editbutton_table {
+        position: relative; // for IE
+        z-index: 1; // for IE
+        float: left;
+        margin-top: -1.46rem !important; // overwrite inline stales
+
+        form div.no {
+            button,
+            input.button {
+                min-height: 1rem;
+                background-color: @ini_background_content;
+                border-top: solid 1px @ini_button_background;
+                border-color: @ini_border;
+                color: @ini_existing;
+                font-size: @font-size-small;
+                margin-top: 0;
+                padding-right: .3em;
+                transition: @transition background-color, @transition border-color, @transition color;
+
+                &:hover,
+                &:focus,
+                &:active {
+                    background-color: @ini_existing;
+                    border-color: @ini_existing;
+                    color: @ini_background_content;
+                }
+            }
+        }
+
+        + * {
+            clear: left;
+        }
+
+        + div.editbutton_table {
+            clear: none;
         }
     }
 }

css/plugins/extension__manager.less

@@ -0,0 +1,20 @@
+/**
+ * This file provides styles for extension manager
+ */
+
+
+/* + + + + +  global  + + + + + */
+
+.dokuwiki #extension__manager {
+    .actions {
+        font-size: 0;
+
+        > button {
+            font-size: .92rem;
+            margin-left: .3rem;
+            padding-left: .3rem;
+            padding-right: .3rem;
+        }
+    }
+}
+

css/plugins/folded.less

@@ -0,0 +1,35 @@
+/**
+ * This file provides styles for the toggle "folded"
+ */
+
+
+/* + + + + +  global  + + + + + */
+
+#dokuwiki__content {
+    a.folder {
+        background: transparent url("svg.php?svg=down.svg&f=existing") right center no-repeat;
+        color: @ini_existing;
+        padding-right: 20px;
+
+        &.open {
+            background-image: url("svg.php?svg=up.svg&f=existing");
+        }
+    }
+
+    div.folded {
+        box-shadow: @box-shadow-colored;
+        border: 1px solid fade(@ini_existing, 50%);
+        border-radius: 0;
+        margin-top: -.7rem;
+        margin-bottom: .7rem;
+        padding: .5em;
+
+        p {
+            margin: .5rem 0;
+        }
+    }
+
+    span.folded {
+        border: 1px dotted @ini_border;
+    }
+}

css/plugins/hightlight_parent.less

@@ -1,5 +1,12 @@
-@media @screen_max-md{
-    #plugin__highlightparent{
+/**
+ * This file provides styles for highlight plugin
+ */
+
+
+/* + + + + +  global  + + + + + */
+
+@media @screen_max-md {
+    #plugin__highlightparent {
         clear: both;
         margin-top: 1rem;
     }

css/plugins/include.less

@@ -4,23 +4,30 @@
  *
  * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
  */
+
 #dokuwiki__content .plugin_include_content {
-    > h1 {
+    > h1,
+    > .section_highlight h1 {
         padding-top: @font-size-head1;
     }
-    > h2 {
+    > h2,
+    > .section_highlight h2 {
         padding-top: @font-size-head2;
     }
-    > h3 {
+    > h3,
+    > .section_highlight h3 {
         padding-top: @font-size-head3;
     }
-    > h4 {
+    > h4,
+    > .section_highlight h4 {
         padding-top: @font-size-head4;
     }
-    > h5 {
+    > h5,
+    > .section_highlight h5 {
         padding-top: @font-size-head5;
     }
-    > h6 {
+    > h6,
+    > .section_highlight h6 {
         padding-top: @font-size-head6;
     }
 }

css/plugins/magic-matcher.less

@@ -1,6 +1,6 @@
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
-/* all media */
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/**
+ * This file provides styles for magic matcher plugin
+ */
 
 
 /* + + + + + + + + + + + + + + + + + + + + + + + */
@@ -21,9 +21,9 @@
         right: 0;
         top: 0;
         border: 0;
-        border-bottom: 1px solid @color-border;
-        border-left: 1px solid @color-border;
-        color: @color-nav;
+        border-bottom: 1px solid @ini_border;
+        border-left: 1px solid @ini_border;
+        color: @ini_nav_menu_color;
         background: #fff;
         border-radius: 0;
         border-bottom-left-radius: 5px;
@@ -31,8 +31,8 @@
         &:hover,
         &:focus,
         &:active {
-            border-color: @button_background;
-            color: @button_background;
+            border-color: @ini_button_background;
+            color: @ini_button_background;
         }
     }
 
@@ -42,9 +42,9 @@
         width: 100%;
         min-height: @height-context-bar;
         box-sizing: border-box;
-        box-shadow: __box_shadow__;
-        background-color: __nav_direct_background__;
-        border-radius: 0 0 __default_border_radius__ __default_border_radius__;
+        box-shadow: @box-shadow;
+        background-color: @ini_background_content;
+        border-radius: 0 0 @ini_default_border_radius @ini_default_border_radius;
         font-size: @font-size-default;
         padding: .8em 1em .5em;
         margin-bottom: 0;
@@ -76,6 +76,16 @@
     }
 }
 
+
+/* + + + + +  in meta box  + + + + + */
+#spr__tab-issues {
+     ul.mmissuelist {
+         padding-left: 0;
+         margin-top: 1rem;
+     }
+}
+
+
 /* + + + + +  in content  + + + + + */
 a.jiralink {
     font-size: @font-size-default;

css/plugins/mediamanager.less

@@ -1,20 +1,30 @@
 /**
- * This file provides styles for the edit view (?do=edit), preview
- * and section edit buttons.
+ * This file provides styles for mediamanager
  */
-/* + + + + +  mediamanager  + + + + + */
+
+
+/* + + + + +  global  + + + + + */
+
 #mediamanager__page {
     .namespaces h2 {
         bottom: 0;
         line-height: 100%;
         margin-bottom: -1px;
     }
+
     #media__tree ul li img {
         padding-top: .3em;
     }
+
+    ul.tabs li a {
+        border-bottom-color: transparent;
+    }
 }
+
+
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* media queries */
+
 @media @screen_max-md {
     #mediamanager__page {
         min-width: 100%;

css/plugins/move.less

@@ -1,6 +1,14 @@
-#dokuwiki__site > .plugin_move_dialog{
+/**
+ * This file provides styles for move plugin
+ */
+
+
+/* + + + + +  global  + + + + + */
+
+#dokuwiki__site > .plugin_move_dialog {
     font-size: @font-size-default;
-    *{
+
+    * {
         font-size: @font-size-default;
     }
 }

css/plugins/popupviewer.less

@@ -1,5 +1,10 @@
+/**
+ * This file provides styles for popupviewer plugin
+ */
 
 
+/* + + + + +  global  + + + + + */
+
 #popupviewer {
     > .controls > .content {
 

css/plugins/qc.less

@@ -6,8 +6,6 @@
 .page-attributes .plugin_qc {
     .qc_icon {
         margin: 0;
-        width: 2em;
-        height: 2em;
 
         svg {
             margin-top: 0.1em;

css/plugins/starred.less

@@ -0,0 +1,10 @@
+/**
+ * This file provides styles for starred plugin
+ */
+
+
+/* + + + + +  global  + + + + + */
+
+#dokuwiki__site {
+
+}

css/plugins/struct.less

@@ -1,6 +1,9 @@
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
-/* all media */
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/**
+ * This file provides styles for struct plugin
+ */
+
+
+/* + + + + +  global  + + + + + */
 
 #dokuwiki__content {
     .structaggregation {
@@ -10,9 +13,26 @@
         padding-bottom: @link-height;
         margin-bottom: @grid;
 
-        table th input:focus {
-            width: 100%;
-            box-sizing: border-box;
+        td,
+        th {
+            line-height: @line-height-default;
+
+            a {
+                color: @ini_existing;
+                line-height: @line-height-default;
+            }
+        }
+
+        // search button in table (f.i. "All products")
+        table th input {
+            &:not(:focus) {
+                cursor: pointer;
+            }
+
+            &:focus {
+                width: 100%;
+                box-sizing: border-box;
+            }
         }
 
         .table {
@@ -26,22 +46,106 @@
             margin-bottom: 0;
 
             &.export {
+                bottom: 1px;
+                background: transparent url("svg.php?svg=file-export.svg&f=existing") left center no-repeat;
+                background-size: auto 20px;
+                border: solid 1px @ini_border;
+                color: @ini_existing;
+                font-size: @font-size-small;
                 line-height: 1;
-                padding-top: .3em;
+                margin-top: -1px;
+                padding-top: .4em;
+                transition: @transition background-color, @transition border-color, @transition color;
+
+                &:hover,
+                &:focus,
+                &:active {
+                    background-color: @ini_existing;
+                    background-image: url("svg.php?svg=file-export.svg&f=background_content");
+                    border-color: @ini_existing;
+                    color: @ini_background_content;
+                    text-decoration: none;
+                }
             }
         }
     }
+
     #plugin__struct_output{
         margin-right: 0;
     }
 
     .struct_entry_form {
         margin-bottom: 2rem;
+
         > fieldset {
             margin-top: 1.5rem;
         }
     }
+
     textarea + .struct_entry_form {
         margin-top: -.5rem;
     }
+
+    div.editBox {
+        .struct_entry_form {
+            label span.label {
+                color: @color-editBox;
+            }
+        }
+    }
+}
+
+.dokuwiki .struct_inlineditor {
+    z-index: 3;
+}
+
+
+/* + + + + +  form - Struct Schema Editor  + + + + + */
+form {
+    &.doku_form.struct_newschema {
+        fieldset {
+            > label {
+                > span:first-child {
+                    display: inline-block;
+
+                    @media @screen_min-lg {
+                        width: 48.8%;
+                    }
+
+                    @media @screen_max-lg {
+                        width: 48.5%;
+                    }
+                }
+
+                > input[type="text"] {
+                    width: 50%;
+                }
+            }
+
+            button {
+                cursor: pointer;
+                box-shadow: none;
+                background-image: none;
+                background-color: @ini_button_background;
+                border: 1px solid @ini_button_background;
+                border-radius: @fix_border-radius;
+                color: @ini_button_color;
+                vertical-align: top;
+                margin-top: .3em;
+                padding: .3em @grid;
+                transition: @transition background-color, @transition color;
+
+                &:hover,
+                &:active,
+                &:focus {
+                    background-color: @ini_button_color;
+                    color: @ini_button_background;
+                }
+
+                + p {
+                    padding-top: 1rem;
+                }
+            }
+        }
+    }
 }

css/plugins/tabinclude.less

@@ -1,39 +1,57 @@
 /**
- * This file provides styles for the edit view (?do=edit), preview
- * and section edit buttons.
+ * This file provides styles for the tabinclude
  */
 
 
 /* + + + + +  plugin tabinclude  + + + + + */
 
-
 div#dwpl-ti-container {
-
-/* + + +  tabnav  + + + */
     li.dwpl-ti-tab {
         box-shadow: none;
-        border-color: @color-site-bg;
+        background-color: @ini_background_page_header;
+        border-color: @ini_border;
         border-radius: @fix_border-radius @fix_border-radius 0 0;
+        color: @ini_background_page_footer;
         padding: 0;
 
+        &:hover {
+            background-color: @ini_background_page_header;
+            text-decoration: none;
+
+            div {
+                text-decoration: underline;
+
+                &.selected {
+                    color: @ini_text;
+                }
+            }
+        }
+
         div {
-            background-color: @background_page-header;
             border-radius: inherit;
+            color: inherit;
             padding: .1em .35em;
+
             &.selected {
-                background-color: @color-site-bg;
+                position: relative;
+                z-index: 1;
+                background-color: @ini_background_content;
+                color: @ini_text;
             }
         }
     }
 
 
-/* + + +  box  + + + */
+/* + + +  content box  + + + */
     div.dwpl-ti-content-box {
+        position: relative;
+        z-index: 0;
         overflow: auto;
-        box-shadow: none;
-        background-color: @color-site-bg;
-        border: solid 1px @color-site-bg;
+        box-shadow: @box-shadow;
+        background-color: @ini_background_content;
+        border: solid 1px @ini_border;
         border-radius: 0;
+        margin-top: -1px;
     }
 }
 
@@ -42,7 +60,5 @@ div#dwpl-ti-container {
 /* media queries */
 
 @media @screen_max-md {
-    div#dwpl-ti-container {
-
-    }
+    div#dwpl-ti-container { }
 }

css/plugins/tagging.less

@@ -0,0 +1,117 @@
+/**
+ * This file provides styles for the form in tagcloud
+ */
+
+
+/* + + + + +  plugin tagging  + + + + + */
+
+#spr__meta-box {
+    ul.tagging_cloud {
+        width: 100%;
+        padding-right: 0;
+
+        li {
+            &.t0 a {
+                font-size: .9rem;
+            }
+            &.t1 a {
+                font-size: 1rem;
+            }
+            &.t2 a {
+                font-size: 1.1rem;
+            }
+            &.t3 a {
+                font-size: 1.2rem;
+            }
+            &.t4 a {
+                font-size: 1.3rem;
+            }
+            &.t5 a {
+                font-size: 1.4rem;
+            }
+            &.t6 a {
+                font-size: 1.5rem;
+            }
+            &.t7 a {
+                font-size: 1.6rem;
+            }
+            &.t8 a {
+                font-size: 1.7rem;
+            }
+            &.t9 a {
+                font-size: 1.8rem;
+            }
+            &.t10 a {
+                font-size: 1.9rem;
+            }
+        }
+    }
+
+    form#tagging__edit {
+        width: 100%;
+
+        label {
+            display: block;
+        }
+
+        input.edit {
+            width: 100%;
+            margin-bottom: .5rem;
+        }
+    }
+}
+
+
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/* media queries */
+
+@media @screen_max-md {
+    #spr__meta-box {
+        form {
+            &#tagging__edit {
+                label {
+                    display: inline-block;
+                    min-width: 50%;
+                    vertical-align: top;
+                    margin-bottom: .5rem;
+                }
+
+                input.edit {
+                    margin-bottom: 0;
+                }
+            }
+        }
+    }
+}
+
+@media @screen_max-xs {
+    #spr__meta-box {
+        form {
+            div > button[type="submit"] {
+                width: 49%;
+                padding: 0;
+            }
+
+            &#tagging__edit {
+                &::after {
+                    content: '';
+                    clear: both;
+                    display: block;
+                }
+
+                label {
+                    display: block;
+                    width: 100%;
+                }
+
+                button[type="submit"] {
+                    float: right;
+
+                    &:first-of-type {
+                        float: left;
+                    }
+                }
+            }
+        }
+    }
+}

css/template_admin.less

@@ -1,42 +1,129 @@
+/**
+ * This file provides the design styles for the admin tools
+ *
+ * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
+ */
+
+
 .do-admin {
     #admin__version {
         font-size: @font-size-default;
     }
+
     .main-content ul {
-         > li{
+        > li {
             font-size: @font-size-default;
 
-             div.li{
-                 font-size: @font-size-default;
+            div.li {
+                font-size: @font-size-default;
 
-                 a{
-                     font-size: @font-size-default;
-                     line-height: 125%;
-                     cursor: pointer;
-                 }
-             }
-        }
-    }
-
-    ul.admin_tasks {
-        padding: 0;
-
-        li {
-            background-size: auto 1rem;
-            margin: 0 0 .6em 0;
-
-            a {
-                font-weight: 400;
+                a {
+                    font-size: @font-size-default;
+                    line-height: 125%;
+                    cursor: pointer;
+                }
             }
         }
     }
 
-    @media @screen_max-md {
-        ul.admin_tasks {
-            float: none;
-            width: auto;
-        }
+    div.ui-admin {
+        ul.admin_tasks,
+        ul.admin_plugins {
+            padding: 0;
 
+            li {
+                background-size: auto 1rem;
+                margin: 0 0 .6em 0;
+
+                a {
+                    color: @ini_existing;
+                    font-weight: 400;
+
+                    * {
+                        color: inherit;
+                    }
+
+                    span.icon {
+                        width: 1.6em;
+                        min-height: 1.6em;
+                        margin-top: -.3rem;
+                        margin-bottom: .3rem;
+
+                        svg {
+                            width: 26px;
+                            height: 26px;
+                            border: solid 1px @ini_background_content;
+                            border-radius: @ini_default_border_radius;
+                            fill: @ini_existing;
+                            transition: @transition background-color, @transition border-color, @transition fill;
+
+                            path {
+                                fill: @ini_existing;
+                                transition: @transition fill;
+                            }
+                        }
+                    }
+
+                    &:hover,
+                    &:focus,
+                    &:active {
+                        span.icon {
+                            svg {
+                                background-color: @ini_existing;
+                                border-color: @ini_existing;
+                                fill: @ini_background_content;
+
+                                path {
+                                    fill: @ini_background_content;
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
     }
 }
 
+
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/* 1024px */
+
+@media @screen_max-md {
+    .do-admin {
+        div.ui-admin {
+            ul.admin_tasks {
+                width: 50%;
+                padding-top: 1rem;
+
+                li {
+                    white-space: normal;
+
+                    a {
+                        .display-flex(); // for better position with line breaks (white-space)
+
+                        span.icon {
+                            margin-top: -.3rem;
+                            margin-bottom: .3rem;
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
+
+
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/* 768px */
+
+@media @screen_max-xs {
+    .do-admin {
+        div.ui-admin {
+            ul.admin_tasks {
+                width: auto;
+                padding-top: 1rem;
+            }
+        }
+    }
+}

fonts/icons/LICENSE.txt

@@ -1,33 +1,6 @@
 Font license info
 
 
-## Entypo
-
-   Copyright (C) 2012 by Daniel Bruce
-
-   Author:    Daniel Bruce
-   License:   SIL (http://scripts.sil.org/OFL)
-   Homepage:  http://www.entypo.com
-
-
-## Font Awesome
-
-   Copyright (C) 2016 by Dave Gandy
-
-   Author:    Dave Gandy
-   License:   SIL ()
-   Homepage:  http://fortawesome.github.com/Font-Awesome/
-
-
-## Elusive
-
-   Copyright (C) 2013 by Aristeides Stathopoulos
-
-   Author:    Aristeides Stathopoulos
-   License:   SIL (http://scripts.sil.org/OFL)
-   Homepage:  http://aristeides.com/
-
-
 ## Fontelico
 
    Copyright (C) 2012 by Fontello project
@@ -37,30 +10,12 @@ Font license info
    Homepage:  http://fontello.com
 
 
-## Typicons
+## Font Awesome
 
-   (c) Stephen Hutchings 2012
+   Copyright (C) 2016 by Dave Gandy
 
-   Author:    Stephen Hutchings
-   License:   SIL (http://scripts.sil.org/OFL)
-   Homepage:  http://typicons.com/
-
-
-## Linecons
-
-   Copyright (C) 2013 by Designmodo
-
-   Author:    Designmodo for Smashing Magazine
-   License:   CC BY ()
-   Homepage:  http://designmodo.com/linecons-free/
-
-
-## Iconic
-
-   Copyright (C) 2012 by P.J. Onori
-
-   Author:    P.J. Onori
-   License:   SIL (http://scripts.sil.org/OFL)
-   Homepage:  http://somerandomdude.com/work/iconic/
+   Author:    Dave Gandy
+   License:   SIL ()
+   Homepage:  http://fortawesome.github.com/Font-Awesome/
 
 

fonts/icons/fontello-codes.css

@@ -0,0 +1,78 @@
+
+.icon-pencil-add:before { content: '\e800'; } /* '' */
+.icon-dividers:before { content: '\e801'; } /* '' */
+.icon-file-xml:before { content: '\e802'; } /* '' */
+.icon-revisions-history:before { content: '\e803'; } /* '' */
+.icon-emo-happy:before { content: '\e804'; } /* '' */
+.icon-emo-wink:before { content: '\e805'; } /* '' */
+.icon-emo-unhappy:before { content: '\e806'; } /* '' */
+.icon-emo-sleep:before { content: '\e807'; } /* '' */
+.icon-emo-thumbsup:before { content: '\e808'; } /* '' */
+.icon-folder-image:before { content: '\e809'; } /* '' */
+.icon-file-export:before { content: '\e80a'; } /* '' */
+.icon-emo-grin:before { content: '\e80c'; } /* '' */
+.icon-emo-angry:before { content: '\e80d'; } /* '' */
+.icon-emo-cry:before { content: '\e80f'; } /* '' */
+.icon-emo-squint:before { content: '\e811'; } /* '' */
+.icon-emo-laugh:before { content: '\e812'; } /* '' */
+.icon-emo-wink2:before { content: '\e813'; } /* '' */
+.icon-cog-alt:before { content: '\e818'; } /* '' */
+.icon-left-thick:before { content: '\e82c'; } /* '' */
+.icon-right-small:before { content: '\e82d'; } /* '' */
+.icon-right-thick:before { content: '\e82e'; } /* '' */
+.icon-up-small:before { content: '\e82f'; } /* '' */
+.icon-up-bold:before { content: '\e830'; } /* '' */
+.icon-up-thick:before { content: '\e831'; } /* '' */
+.icon-attachment:before { content: '\e832'; } /* '' */
+.icon-user:before { content: '\e833'; } /* '' */
+.icon-down-small:before { content: '\e834'; } /* '' */
+.icon-down-thick:before { content: '\e835'; } /* '' */
+.icon-left-small:before { content: '\e836'; } /* '' */
+.icon-left-bold:before { content: '\e837'; } /* '' */
+.icon-file-pdf:before { content: '\e838'; } /* '' */
+.icon-revert-replay:before { content: '\e839'; } /* '' */
+.icon-bell:before { content: '\e83a'; } /* '' */
+.icon-bookmark-empty:before { content: '\e83b'; } /* '' */
+.icon-help:before { content: '\e83c'; } /* '' */
+.icon-file-new:before { content: '\e83d'; } /* '' */
+.icon-file:before { content: '\e83e'; } /* '' */
+.icon-book-open:before { content: '\e83f'; } /* '' */
+.icon-pencil:before { content: '\e840'; } /* '' */
+.icon-check:before { content: '\e841'; } /* '' */
+.icon-home:before { content: '\e842'; } /* '' */
+.icon-link:before { content: '\e843'; } /* '' */
+.icon-checkbox-marked:before { content: '\e844'; } /* '' */
+.icon-login:before { content: '\e845'; } /* '' */
+.icon-down-open-big:before { content: '\e846'; } /* '' */
+.icon-logout:before { content: '\e847'; } /* '' */
+.icon-up-open-big:before { content: '\e848'; } /* '' */
+.icon-files:before { content: '\e849'; } /* '' */
+.icon-file-text:before { content: '\e84a'; } /* '' */
+.icon-frown:before { content: '\e84b'; } /* '' */
+.icon-star-outline:before { content: '\e84c'; } /* '' */
+.icon-sitemap:before { content: '\e84d'; } /* '' */
+.icon-cog:before { content: '\e84e'; } /* '' */
+.icon-puzzle:before { content: '\e84f'; } /* '' */
+.icon-plus:before { content: '\e850'; } /* '' */
+.icon-pencil-1:before { content: '\e851'; } /* '' */
+.icon-minus:before { content: '\e852'; } /* '' */
+.icon-up:before { content: '\e853'; } /* '' */
+.icon-menu:before { content: '\e854'; } /* '' */
+.icon-search:before { content: '\e855'; } /* '' */
+.icon-clipboard-empty:before { content: '\e856'; } /* '' */
+.icon-clipboard:before { content: '\e857'; } /* '' */
+.icon-clock:before { content: '\e858'; } /* '' */
+.icon-down:before { content: '\e859'; } /* '' */
+.icon-cloud:before { content: '\e85a'; } /* '' */
+.icon-code-braces:before { content: '\e85b'; } /* '' */
+.icon-disk:before { content: '\e85c'; } /* '' */
+.icon-mail:before { content: '\e85d'; } /* '' */
+.icon-smile:before { content: '\e85e'; } /* '' */
+.icon-meh:before { content: '\e85f'; } /* '' */
+.icon-star:before { content: '\e860'; } /* '' */
+.icon-code:before { content: '\e861'; } /* '' */
+.icon-user-circle:before { content: '\e86c'; } /* '' */
+.icon-comment-question:before { content: '\e880'; } /* '' */
+.icon-jira:before { content: '\e881'; } /* '' */
+.icon-right-bold:before { content: '\e882'; } /* '' */
+.icon-down-bold:before { content: '\e883'; } /* '' */

fonts/icons/fontello.svg

@@ -6,13 +6,13 @@
 <font id="fontello" horiz-adv-x="1000" >
 <font-face font-family="fontello" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="850" descent="-150" />
 <missing-glyph horiz-adv-x="1000" />
-<glyph glyph-name="user" unicode="&#xe800;" d="M736 128q204-72 204-122l0-106-940 0 0 106q0 50 204 122 94 34 128 69t34 95q0 22-22 49t-32 73q-2 12-9 18t-14 8-14 17-9 43q0 16 5 26t9 12l4 4q-8 50-12 88-4 54 41 112t157 58 158-58 40-112l-12-88q18-8 18-42-2-28-9-43t-14-17-14-8-9-18q-8-48-31-74t-23-48q0-60 35-95t127-69z" horiz-adv-x="940" />
+<glyph glyph-name="pencil-add" unicode="&#xe800;" d="M547 178h125v125h83v-125h125v-83h-125v-125h-83v125h-125z m316 379c16 16 16 43 0 58l-98 98c-15 16-42 16-58 0l-77-76 156-157m-661-349v-156h156l461 461-156 157z" horiz-adv-x="1000" />
 
-<glyph glyph-name="logout" unicode="&#xe801;" d="M357 46q0-2 1-11t0-14-2-14-5-11-12-3h-178q-67 0-114 47t-47 114v392q0 67 47 114t114 47h178q8 0 13-5t5-13q0-2 1-11t0-15-2-13-5-11-12-3h-178q-37 0-63-26t-27-64v-392q0-37 27-63t63-27h174t6 0 7-2 4-3 4-5 1-8z m518 304q0-14-11-25l-303-304q-11-10-25-10t-25 10-11 25v161h-250q-14 0-25 11t-11 25v214q0 15 11 25t25 11h250v161q0 14 11 25t25 10 25-10l303-304q11-10 11-25z" horiz-adv-x="928.6" />
+<glyph glyph-name="dividers" unicode="&#xe801;" d="M458 767h84v-84h21a63 63 0 0 0 62-62v-146l-18-18 68-119c46 46 75 109 75 179h83c0-101-44-192-115-253l131-226 5-93-78 51-128 222c-44-22-95-35-148-35-53 0-104 13-148 35l-128-222-78-51 5 93 242 419-18 18v146a63 63 0 0 0 63 62h20v84m-65-477c33-15 69-23 107-23 38 0 74 8 107 23l-61 106h-1c-25-25-65-25-90 0h-1l-61-106m107 310a42 42 0 0 1-42-42 42 42 0 0 1 42-41 42 42 0 0 1 42 41 42 42 0 0 1-42 42z" horiz-adv-x="1000" />
 
-<glyph glyph-name="login" unicode="&#xe802;" d="M661 350q0-14-11-25l-303-304q-11-10-26-10t-25 10-10 25v161h-250q-15 0-25 11t-11 25v214q0 15 11 25t25 11h250v161q0 14 10 25t25 10 26-10l303-304q11-10 11-25z m196 196v-392q0-67-47-114t-114-47h-178q-7 0-13 5t-5 13q0 2-1 11t0 15 2 13 5 11 12 3h178q37 0 64 27t26 63v392q0 37-26 64t-64 26h-174t-6 0-6 2-5 3-4 5-1 8q0 2-1 11t0 15 2 13 5 11 12 3h178q67 0 114-47t47-114z" horiz-adv-x="857.1" />
+<glyph glyph-name="file-xml" unicode="&#xe802;" d="M542 475h229l-229 229v-229m-292 292h333l250-250v-500a83 83 0 0 0-83-84h-500a83 83 0 0 0-83 84v666c0 47 37 84 83 84m5-563l156-156 59 59-97 97 97 97-59 59-156-156m465 0l-156 156-59-59 97-97-97-97 59-59 156 156z" horiz-adv-x="1000" />
 
-<glyph glyph-name="clipboard" unicode="&#xe803;" d="M0-150l0 904 225 0 0-64-161 0 0-774 579 0 0 774-161 0 0 64 225 0 0-904-707 0z m129 129l0 31 31 0 0-31-31 0z m0 121l0 31 31 0 0-31-31 0z m0 121l0 31 31 0 0-31-31 0z m0 121l0 32 31 0 0-32-31 0z m0 121l0 32 31 0 0-32-31 0z m0 96l0 94 129 0 0 97q0 41 27 71t69 29 69-30 28-70q0-56-2-97l129 0 0-94-449 0z m96-582l0 33 353 0 0-33-353 0z m0 121l0 33 353 0 0-33-353 0z m0 121l0 33 353 0 0-33-353 0z m0 121l0 34 353 0 0-34-353 0z m0 121l0 34 353 0 0-34-353 0z m97 260q0-14 9-22t23-9 22 9 9 22-9 24-22 9-23-9-9-24z" horiz-adv-x="707" />
+<glyph glyph-name="revisions-history" unicode="&#xe803;" d="M458 558v-213l197-116 33 54-167 98v177m0 209c-147 0-275-80-343-199l-95 95v-271h271l-114 114c50 105 156 177 281 177a313 313 0 0 0 312-312 313 313 0 0 0-312-313c-136 0-251 87-294 209h-88c46-168 199-292 382-292 218 0 396 177 396 396a396 396 0 0 1-396 396z" horiz-adv-x="1000" />
 
 <glyph glyph-name="emo-happy" unicode="&#xe804;" d="M261 800c-60 0-109-65-109-144 0-80 49-145 109-145s110 65 110 145c0 79-49 144-110 144z m477 0c-61 0-110-65-110-144 0-80 49-145 110-145 60 0 110 65 110 145 0 79-50 144-110 144z m208-599c-13 0-27-5-37-16-4-4-8-8-12-12-111-109-253-164-396-165-142-2-285 50-396 155l-3 3-12 12c-21 21-54 20-75-1-20-21-20-55 1-76 3-4 8-8 14-14l3-3c132-124 301-186 469-184 169 1 337 67 468 195 5 5 9 10 14 14 20 22 20 56-1 77-10 10-23 15-37 15z" horiz-adv-x="999" />
 
@@ -24,97 +24,141 @@
 
 <glyph glyph-name="emo-thumbsup" unicode="&#xe808;" d="M744 850c-60 0-109-64-109-143 0-79 49-143 109-143 60 0 108 64 108 143 0 79-48 143-108 143z m-602-80c-29 0-53-24-53-54s24-53 53-53l290 0c30 0 54 24 54 53s-24 53-54 53l-290 1z m1040-21c-16 0-34-2-54-7-112-51-109-174-93-266l-131 0c-68 0-124-53-124-123 0-34 8-71 30-98-10-11-18-24-23-38-18-48-10-106 23-144-5-6-18-27-18-27-29-57-10-144 46-179 17-11 38-17 64-17l378 0c91 3 167 76 167 169l0 287c0 49-30 108-49 151-25 58-49 116-73 174-30 72-71 118-143 118z m3-115c30 1 42-48 51-67 21-52 42-129 64-181 21-47 38-88 38-104l0-255c0-41-36-72-76-74l-332 0c-17 0-26 9-30 24-5 15-7 34 4 47 6 8 16 13 26 13 21-1 39 17 39 38 0 21-17 37-38 37-9 0-18 4-24 11-15 16-16 50 0 65 3 4 7 6 12 8 4 1 8 2 12 2 20 0 38 17 38 38 0 21-17 38-38 38-28 0-34 28-34 50 0 12 7 23 17 29-1 2 189 4 210 4 27 0 47 30 33 55-27 51-45 207 22 221 2 1 4 1 6 1z m-1133-264c-7 0-14-1-20-4-27-12-39-44-27-71 66-148 194-254 344-297 29-8 59-14 90-17 30-3 61-4 91-2l3 0 2 0c30 3 52 28 50 58-2 29-28 51-58 49l-2 0-1 0c-25-2-50-1-74 1-24 3-48 8-72 14-120 34-222 120-276 238-9 20-29 32-50 31z" horiz-adv-x="1447" />
 
-<glyph glyph-name="clock" unicode="&#xe809;" d="M500 546v-250q0-7-5-12t-13-5h-178q-8 0-13 5t-5 12v36q0 8 5 13t13 5h125v196q0 8 5 13t12 5h36q8 0 13-5t5-13z m232-196q0 83-41 152t-110 111-152 41-153-41-110-111-41-152 41-152 110-111 153-41 152 41 110 111 41 152z m125 0q0-117-57-215t-156-156-215-58-216 58-155 156-58 215 58 215 155 156 216 58 215-58 156-156 57-215z" horiz-adv-x="857.1" />
+<glyph glyph-name="folder-image" unicode="&#xe809;" d="M208 142l188 250 146-188 104 125 146-187m41 458h-333l-83 83h-250a83 83 0 0 1-84-83v-500a83 83 0 0 1 84-83h666a83 83 0 0 1 84 83v417a83 83 0 0 1-84 83z" horiz-adv-x="1000" />
 
-<glyph glyph-name="link" unicode="&#xe80a;" d="M813 171q0 23-16 38l-116 116q-16 16-38 16-24 0-40-18 1-1 10-10t12-12 9-11 7-14 2-15q0-23-16-38t-38-16q-8 0-15 2t-14 7-11 9-12 12-10 10q-19-17-19-40 0-23 16-38l115-116q15-15 38-15 22 0 38 15l82 81q16 16 16 37z m-393 394q0 22-15 38l-115 115q-16 16-38 16-22 0-38-15l-82-82q-16-15-16-37 0-22 16-38l116-116q15-15 38-15 23 0 40 17-2 2-11 11t-12 12-8 10-7 14-2 16q0 22 15 38t38 15q9 0 16-2t14-7 11-8 12-12 10-11q18 17 18 41z m500-394q0-66-48-113l-82-81q-46-47-113-47-68 0-114 48l-115 115q-46 47-46 114 0 68 49 116l-49 49q-48-49-116-49-67 0-114 47l-116 116q-47 47-47 114t47 113l82 82q47 46 114 46 67 0 114-47l115-116q46-46 46-113 0-69-49-117l49-49q48 49 116 49 67 0 114-47l116-116q47-47 47-114z" horiz-adv-x="928.6" />
-
-<glyph glyph-name="bell" unicode="&#xe80b;" d="M509-96q0 8-9 8-33 0-57 24t-23 57q0 9-9 9t-9-9q0-41 29-70t69-28q9 0 9 9z m-372 160h726q-149 168-149 465 0 28-13 58t-39 58-67 45-95 17-95-17-67-45-39-58-13-58q0-297-149-465z m827 0q0-29-21-50t-50-21h-250q0-59-42-101t-101-42-101 42-42 101h-250q-29 0-50 21t-21 50q28 24 51 49t47 67 42 89 27 115 11 145q0 84 66 157t171 89q-5 10-5 21 0 23 16 38t38 16 38-16 16-38q0-11-5-21 106-16 171-89t66-157q0-78 11-145t28-115 41-89 48-67 50-49z" horiz-adv-x="1000" />
+<glyph glyph-name="file-export" unicode="&#xe80a;" d="M250 767c-46 0-83-38-83-84v-666a83 83 0 0 1 83-84h500a83 83 0 0 1 83 84v500l-250 250m-41-63l229-229h-229m-170-134h295v-295l-89 89-118-118-117 118 117 117" horiz-adv-x="1000" />
 
 <glyph glyph-name="emo-grin" unicode="&#xe80c;" d="M197 801c-61 0-110-64-110-144 0-80 49-144 110-144s109 64 109 144c0 80-49 144-109 144z m476 0c-60 0-109-64-109-144 0-80 49-144 109-144 61 0 110 64 110 144 0 80-49 144-110 144z m144-480l-765 0c-29 0-52-24-52-54 3-200 238-351 422-354 186-3 442 156 448 355 0 29-24 53-53 53z m-700-106l634 0c-62-121-190-201-331-197-130 4-246 83-303 197z" horiz-adv-x="870" />
 
 <glyph glyph-name="emo-angry" unicode="&#xe80d;" d="M53 738c-20 0-39-11-48-30-13-26-1-58 25-71l152-80c-3-46 8-93 34-128 21-29 52-49 88-49 90 0 126 107 121 179-120 53-232 115-349 174-7 4-15 5-23 5z m894 0c-8 0-16-1-23-5-117-59-229-121-349-174-5-72 31-179 121-179 36 0 67 20 88 49 25 35 37 82 34 128l152 80c26 13 37 45 25 71-10 19-29 30-48 30z m-453-537c-165 0-330-62-461-184l-2-3c-6-5-11-10-15-14-21-21-21-55-1-76 21-21 54-21 75-1l12 12 3 3c112 105 254 157 396 155 143-1 286-56 396-165 4-4 8-8 12-12 21-21 54-21 75-1 21 21 21 55 0 77-4 5-9 10-14 14-130 129-299 194-468 195-3 0-5 0-8 0z" horiz-adv-x="1000" />
 
-<glyph glyph-name="mail" unicode="&#xe80e;" d="M929 11v428q-18-20-39-36-149-115-238-189-28-24-46-37t-48-28-57-13h-2q-26 0-57 13t-48 28-46 37q-88 74-238 189-21 16-39 36v-428q0-7 6-13t12-5h822q7 0 12 5t6 13z m0 586v14t-1 7-1 7-3 5-5 4-8 2h-822q-7 0-12-6t-6-12q0-94 83-159 107-84 223-176 4-3 20-17t25-21 25-17 28-16 24-5h2q11 0 24 5t28 16 25 17 25 21 20 17q116 92 224 176 30 24 56 65t26 73z m71 21v-607q0-37-26-63t-63-27h-822q-36 0-63 27t-26 63v607q0 37 26 63t63 26h822q37 0 63-26t26-63z" horiz-adv-x="1000" />
-
 <glyph glyph-name="emo-cry" unicode="&#xe80f;" d="M278 787c-7 0-15-2-23-5l-128-62-80-38c-2-1-4-2-6-3-1-5-1-11-1-16l0 0 0-1 0 0c0-69 40-162 122-162l0 0 0 0 0 0c34 0 65 18 87 49 26 35 37 82 34 128l18 9c27 12 38 44 25 71-9 19-28 30-48 30z m212 0c-20 0-39-11-48-30-13-27-1-59 25-71l18-9c-3-46 9-93 34-128 22-31 53-49 87-49l0 0 1 0 0 0c82 0 121 93 122 162l0 0 0 1 0 0c0 5-1 11-1 16-2 1-5 2-7 3l-80 38-128 62c-7 3-15 5-23 5z m279-302c-7 0-15-5-21-16-42-72-96-259 27-259 123 1 73 182 16 261-6 8-14 13-22 14z m-512-138c-57 0-112-9-166-26-10-4-20-7-30-11-11-5-21-9-30-13l0 0-1-1 0 0c-26-12-37-44-25-70 13-26 44-38 70-25l0-1c9 5 17 8 24 11 9 3 17 6 25 9 43 14 88 21 133 21 51 0 101-9 148-27 19-7 37-15 55-24 91-49 163-130 200-232 10-27 40-41 68-31 27 10 42 40 32 67-46 127-137 228-250 289-22 12-45 22-69 31-57 21-120 33-184 33z" horiz-adv-x="851" />
 
-<glyph glyph-name="cloud" unicode="&#xe810;" d="M781-15l-572 0q-86 0-148 61t-61 148q0 72 44 128t112 73l0 8q0 130 92 221t221 91q100 0 180-58t114-152q115 9 196-68t82-191q0-107-76-184t-184-77z m-577 314q-40 0-70-31t-30-74 30-73 75-31l572 0q65 0 111 46t46 110-46 111-111 46q-18 0-42-8l-56-16-9 57q-14 75-71 125t-134 49q-86 0-148-61t-61-146q0-15 5-43l13-62z" horiz-adv-x="1041" />
-
 <glyph glyph-name="emo-squint" unicode="&#xe811;" d="M128 607c-30 0-54-24-54-54 0-30 24-54 54-54l267 0c30 0 54 24 54 54 0 30-24 54-54 54l-267 0z m476 0c-29 0-54-24-54-54 0-30 25-54 54-54l267 0c30 0 54 24 54 54 0 30-24 54-54 54l-267 0z m342-406c-13 0-27-5-37-16-4-4-8-8-12-12-111-109-253-164-396-165-142-2-285 50-396 155l-3 3-12 12c-21 21-54 20-75-1-20-21-20-55 1-76 3-4 8-8 14-14l3-3c132-124 301-186 469-184 169 1 337 67 468 195 5 5 9 10 14 14 20 22 20 56-1 77-10 10-23 15-37 15z" horiz-adv-x="999" />
 
 <glyph glyph-name="emo-laugh" unicode="&#xe812;" d="M206 742c-77 0-151-39-196-103-17-24-11-57 13-74 24-17 58-12 75 13 43 61 127 74 186 31l0 0c4-2 8-5 11-9l1 0 1-1c3-3 7-7 10-11l1-1 0 0 0 0 1-1 0 0c20-22 54-24 76-4 22 19 24 53 4 75-45 53-112 85-183 85z m486 0c-78 0-152-39-197-103-17-24-11-57 13-74 24-17 58-12 75 13 43 61 127 74 186 31l0 0c4-2 8-5 12-9l0 0 1-1c4-3 7-7 10-11l1-1 0 0 0 0 1-1 1 0c19-22 53-24 75-4 22 19 24 53 5 75-46 53-113 85-183 85z m148-421l-765 0c-29 0-52-24-52-54 4-200 238-351 422-354 187-3 443 156 448 355 0 29-24 53-53 53z m-700-106l634 0c-61-121-190-201-330-197-130 4-247 83-304 197z" horiz-adv-x="893" />
 
 <glyph glyph-name="emo-wink2" unicode="&#xe813;" d="M664 800c-61 0-110-65-110-144 0-80 49-145 110-145 60 0 110 65 110 145 0 79-50 144-110 144z m-343-98l-267 0c-30 0-54-24-54-54 0-30 24-54 54-54l267 0c30 0 54 24 54 54 0 30-24 54-54 54z m-262-361c-6 0-13-1-19-3-27-10-41-41-31-68 46-127 136-228 249-289 22-12 45-22 69-31 58-21 120-33 184-33 57 0 113 9 166 27 10 3 20 7 30 11 11 4 22 8 31 12l0 1 0 0 0 0c26 12 38 44 25 71-13 26-44 37-70 25l0 0c-9-4-17-8-24-11-8-3-17-6-25-8-43-14-88-22-133-22-51 0-101 10-148 27-19 7-37 15-55 25-90 48-163 130-200 231-8 21-28 35-49 35z" horiz-adv-x="774" />
 
-<glyph glyph-name="cloud-1" unicode="&#xe814;" d="M0 178q0 55 27 102t75 74q-8 21-8 43 0 58 41 99t99 42q20 0 43-8 34 74 102 119t152 45q110 0 189-73t91-181q82-16 135-80t54-151q0-97-68-166t-166-68l-563 0q-84 0-143 60t-60 143z m63 0q0-58 41-99t99-41l563 0q70 0 121 50t50 121q0 63-39 110t-99 58q-35 8-42 15t-9 42q-8 84-70 141t-147 56q-62 0-117-34t-80-93q-10-19-12-24t-8-13-15-6-22 6q-21 10-43 8-33 0-55-22t-23-56q0-10 4-24 14-33 10-44t-37-30q-70-41-70-121z" horiz-adv-x="1000" />
-
-<glyph glyph-name="home-outline" unicode="&#xe815;" d="M1108 422q38-30 38-80 0-42-30-73t-75-31l-51 0 0-312q0-44-31-75t-74-30l-625 0q-42 0-73 30t-31 75l0 312-52 0q-44 0-74 31t-30 73q0 46 36 79 79 66 204 174t211 181 88 75l34 29 35-29q1-1 86-75t211-181 203-173z m-430-496l0 260-209 0 0-260 209 0z m207 416l156 0q-231 194-468 400-238-206-469-400l156 0 0-416 156 0 0 312 313 0 0-312 156 0 0 416z" horiz-adv-x="1146" />
-
-<glyph glyph-name="home" unicode="&#xe816;" d="M786 296v-267q0-15-11-25t-25-11h-214v214h-143v-214h-214q-15 0-25 11t-11 25v267q0 1 0 2t0 2l321 264 321-264q1-1 1-4z m124 39l-34-41q-5-5-12-6h-2q-7 0-12 3l-386 322-386-322q-7-4-13-3-7 1-12 6l-35 41q-4 6-3 13t6 12l401 334q18 15 42 15t43-15l136-113v108q0 8 5 13t13 5h107q8 0 13-5t5-13v-227l122-102q6-4 6-12t-4-13z" horiz-adv-x="928.6" />
-
-<glyph glyph-name="puzzle-1" unicode="&#xe817;" d="M586 402q-37 0-64-34t-27-82 27-84 64-34q22 0 43 13 26 17 37 11t12-24l0-144q0-31-24-54t-55-23l-143 0q-16 0-23 9t2 31q21 25 21 51 0 38-34 64t-83 26-83-26-35-64q0-22 13-44 17-26 12-37t-25-10l-143 0q-33 0-55 23t-23 54l0 144q0 16 9 23t31-3q24-20 51-20 38 0 65 34t27 84-27 82-65 34q-21 0-42-13-26-17-38-12t-11 25l0 91q0 33 23 56t55 23l143 0q19 0 25 10t-11 37q-14 20-14 44 0 38 35 64t83 26 83-26 34-64q0-26-21-51-10-21-2-31t23-9l143 0q31 0 55-23t24-56l0-91q0-16-10-23t-30 3q-24 20-52 20z" horiz-adv-x="678" />
-
 <glyph glyph-name="cog-alt" unicode="&#xe818;" d="M500 350q0 59-42 101t-101 42-101-42-42-101 42-101 101-42 101 42 42 101z m429-286q0 29-22 51t-50 21-50-21-21-51q0-29 21-50t50-21 51 21 21 50z m0 572q0 29-22 50t-50 21-50-21-21-50q0-30 21-51t50-21 51 21 21 51z m-215-235v-103q0-6-4-11t-8-6l-87-14q-6-19-18-42 19-27 50-64 4-6 4-11 0-7-4-11-12-17-46-50t-43-33q-7 0-12 4l-64 50q-21-11-43-17-6-60-13-87-4-13-17-13h-104q-6 0-11 4t-5 10l-13 85q-19 6-42 18l-66-50q-4-4-11-4-6 0-12 4-80 75-80 90 0 5 4 10 5 8 23 30t26 34q-13 24-20 46l-85 13q-5 1-9 5t-4 11v104q0 5 4 10t9 6l86 14q7 19 18 42-19 27-50 64-4 6-4 11 0 7 4 12 12 16 46 49t44 33q6 0 12-4l64-50q19 10 43 18 6 60 13 86 3 13 16 13h104q6 0 11-4t6-10l13-85q19-6 42-17l65 49q5 4 12 4 6 0 11-4 81-75 81-90 0-4-4-10-7-9-24-30t-25-34q13-27 19-46l85-12q6-2 9-6t4-11z m357-298v-78q0-9-83-17-6-15-16-29 28-63 28-77 0-2-2-4-68-40-69-40-5 0-26 27t-29 37q-11-1-17-1t-17 1q-7-11-29-37t-25-27q-1 0-69 40-3 2-3 4 0 14 29 77-10 14-17 29-83 8-83 17v78q0 9 83 18 7 16 17 29-29 63-29 77 0 2 3 4 2 1 19 11t33 19 17 9q4 0 25-26t29-38q12 1 17 1t17-1q28 40 51 63l4 1q2 0 69-39 2-2 2-4 0-14-28-77 9-13 16-29 83-9 83-18z m0 572v-78q0-9-83-18-6-15-16-29 28-63 28-77 0-2-2-4-68-39-69-39-5 0-26 26t-29 38q-11-1-17-1t-17 1q-7-12-29-38t-25-26q-1 0-69 39-3 2-3 4 0 14 29 77-10 14-17 29-83 9-83 18v78q0 9 83 17 7 16 17 29-29 63-29 77 0 2 3 4 2 1 19 11t33 19 17 9q4 0 25-26t29-37q12 1 17 1t17-1q28 39 51 62l4 1q2 0 69-39 2-2 2-4 0-14-28-77 9-13 16-29 83-8 83-17z" horiz-adv-x="1071.4" />
 
-<glyph glyph-name="cog" unicode="&#xe819;" d="M571 350q0 59-41 101t-101 42-101-42-42-101 42-101 101-42 101 42 41 101z m286 61v-124q0-7-4-13t-11-7l-104-16q-10-30-21-51 19-27 59-77 6-6 6-13t-5-13q-15-21-55-61t-53-39q-7 0-14 5l-77 60q-25-13-51-21-9-76-16-104-4-16-20-16h-124q-8 0-14 5t-6 12l-16 103q-27 9-50 21l-79-60q-6-5-14-5-8 0-14 6-70 64-92 94-4 5-4 13 0 6 5 12 8 12 28 37t30 40q-15 28-23 55l-102 15q-7 1-11 7t-5 13v124q0 7 5 13t10 7l104 16q8 25 22 51-23 32-60 77-6 7-6 14 0 5 5 12 15 20 55 60t53 40q7 0 15-5l77-60q24 13 50 21 9 76 17 104 3 16 20 16h124q7 0 13-5t7-12l15-103q28-9 51-20l79 59q5 5 13 5 7 0 14-5 72-67 92-95 4-5 4-12 0-7-4-13-9-12-29-37t-30-40q15-28 23-54l102-16q7-1 12-7t4-13z" horiz-adv-x="857.1" />
+<glyph glyph-name="left-thick" unicode="&#xe82c;" d="M833 433v-166h-375l146-146-101-101-330 330 330 330 101-101-146-146h375z" horiz-adv-x="1000" />
 
-<glyph glyph-name="help" unicode="&#xe81a;" d="M494 740q86-62 86-184 0-64-42-124-12-20-88-80l-46-30q-40-34-48-60-6-16-8-44 0-14-16-14l-128 0q-16 0-16 12 4 98 28 124 16 22 48 48t56 42l24 14q22 16 34 34 28 44 28 70 0 40-26 78-28 36-92 36-68 0-94-44-28-42-28-92l-166 0q6 162 114 232 70 42 166 42 130 0 214-60z m-216-636q44 0 73-30t27-74q-2-46-32-73t-74-25q-44 0-73 29t-27 75 32 73 74 25z" horiz-adv-x="580" />
+<glyph glyph-name="right-small" unicode="&#xe82d;" d="M167 392v-84h500l-229-229 59-59 330 330-330 330-59-59 229-229h-500z" horiz-adv-x="1000" />
 
-<glyph glyph-name="doc" unicode="&#xe81b;" d="M819 638q16-16 27-42t11-50v-642q0-23-15-38t-38-16h-750q-23 0-38 16t-16 38v892q0 23 16 38t38 16h500q22 0 49-11t42-27z m-248 136v-210h210q-5 17-12 23l-175 175q-6 7-23 12z m215-853v572h-232q-23 0-38 16t-16 37v233h-429v-858h715z" horiz-adv-x="857.1" />
+<glyph glyph-name="right-thick" unicode="&#xe82e;" d="M167 433v-166h375l-146-146 101-101 330 330-330 330-101-101 146-146h-375z" horiz-adv-x="1000" />
 
-<glyph glyph-name="book-open" unicode="&#xe81c;" d="M464 629q5 5 15 12t47 26 83 35 127 27 175 12l0-670q-95 0-176-12t-128-27-82-34-47-29l-14-10q-4 4-13 12t-46 26-83 35-127 27-177 12l0 670q94 0 174-12t128-27 83-33 48-29z m-334 0l0-450q172-14 279-71l0 449q-110 58-279 72z m669-450l0 450q-168-14-278-72l0-449q108 57 278 71z" horiz-adv-x="928" />
+<glyph glyph-name="up-small" unicode="&#xe82f;" d="M542 17h-84v500l-229-229-59 59 330 330 330-330-59-59-229 229v-500z" horiz-adv-x="1000" />
 
-<glyph glyph-name="doc-new" unicode="&#xe81d;" d="M0-150l0 818 188 182 519 0 0-348-86 0 0 260-369 0 0-156-166 0 0-668 418 0 0-88-504 0z m373 207l0 162 209 0 0 207 160 0 0-207 207 0 0-162-207 0 0-207-160 0 0 207-209 0z" horiz-adv-x="949" />
+<glyph glyph-name="up-bold" unicode="&#xe830;" d="M625 17h-250v333h-202l327 327 327-327h-202v-333z" horiz-adv-x="1000" />
 
-<glyph glyph-name="plus" unicode="&#xe81e;" d="M786 439v-107q0-22-16-38t-38-15h-232v-233q0-22-16-37t-38-16h-107q-22 0-38 16t-15 37v233h-232q-23 0-38 15t-16 38v107q0 23 16 38t38 16h232v232q0 22 15 38t38 16h107q23 0 38-16t16-38v-232h232q23 0 38-16t16-38z" horiz-adv-x="785.7" />
+<glyph glyph-name="up-thick" unicode="&#xe831;" d="M583 17h-166v375l-146-146-101 101 330 330 330-330-101-101-146 146v-375z" horiz-adv-x="1000" />
 
-<glyph glyph-name="search" unicode="&#xe81f;" d="M772 78q30-34 6-62l-46-46q-36-32-68 0l-190 190q-74-42-156-42-128 0-223 95t-95 223 90 219 218 91 224-95 96-223q0-88-46-162z m-678 358q0-88 68-156t156-68 151 63 63 153q0 88-68 155t-156 67-151-63-63-151z" horiz-adv-x="789" />
+<glyph glyph-name="attachment" unicode="&#xe832;" d="M313 100a229 229 0 0 0-230 229 229 229 0 0 0 230 229h437a167 167 0 0 0 167-166 167 167 0 0 0-167-167h-354a104 104 0 0 0-104 104 104 104 0 0 0 104 104h312v-62h-312a42 42 0 0 1-42-42 42 42 0 0 1 42-41h354a104 104 0 0 1 104 104 104 104 0 0 1-104 104h-437a167 167 0 0 1-167-167 167 167 0 0 1 167-166h395v-63h-395z" horiz-adv-x="1000" />
 
-<glyph glyph-name="up-outline" unicode="&#xe820;" d="M416-151q-65 0-110 46t-46 110l0 248q-45-40-108-38t-106 44q-46 46-46 111t46 110l370 372 372-372q46-46 46-110t-46-111q-43-42-107-44t-108 38l0-248q0-65-46-110t-111-46z m-51 655l0-499q0-21 15-37t36-15 37 15 16 37l0 499 171-171q15-15 37-15t37 15 15 37-15 37l-298 297-297-297q-15-15-15-37t15-37 37-15 37 15z" horiz-adv-x="834" />
+<glyph glyph-name="user" unicode="&#xe833;" d="M500 683a167 167 0 0 0 167-166 167 167 0 0 0-167-167 167 167 0 0 0-167 167 167 167 0 0 0 167 166m0-416c184 0 333-75 333-167v-83h-666v83c0 92 149 167 333 167z" horiz-adv-x="1000" />
 
-<glyph glyph-name="down-outline" unicode="&#xe821;" d="M416-153l-370 371q-46 46-46 110t46 110q43 43 106 44t108-38l0 253q0 65 46 110t110 46 111-46 46-110l0-253q45 40 108 38t107-44q46-46 46-110t-46-110z m-260 534q-22 0-37-15t-15-37 15-37l297-298 298 298q15 15 15 37t-15 37-37 15-37-15l-171-173 0 504q0 21-16 36t-37 15-36-15-15-36l0-504-172 173q-15 15-37 15z" horiz-adv-x="834" />
+<glyph glyph-name="down-small" unicode="&#xe834;" d="M458 683h84v-500l229 230 59-60-330-330-330 330 59 60 229-230v500z" horiz-adv-x="1000" />
 
-<glyph glyph-name="left-outline" unicode="&#xe822;" d="M638 91q0-64-47-111t-110-46-110 46l-371 371 371 371q44 44 110 44t110-44q47-46 47-110 0-61-40-105l252 0q65 0 111-46t45-110-45-111-111-46l-252 0q40-43 40-103z m-490 260l297-297q15-15 37-15t37 15 15 37-15 36l-173 172 504 0q21 0 36 15t15 37-15 36-36 16l-504 0 173 171q15 15 15 38 0 21-15 36t-37 15-37-15z" horiz-adv-x="1006" />
+<glyph glyph-name="down-thick" unicode="&#xe835;" d="M417 683h166v-375l146 146 101-101-330-330-330 330 101 101 146-146v375z" horiz-adv-x="1000" />
 
-<glyph glyph-name="right-outline" unicode="&#xe823;" d="M525-66q-64 0-110 46t-46 111q0 11 1 20t5 18 7 17 11 21 15 27l-252 0q-65 0-110 46t-46 111 46 110 110 46l252 0q-5 11-14 27t-12 22-7 16-5 20-1 20q0 65 45 110 44 44 110 44t111-44l371-371-371-371q-46-46-110-46z m-369 469q-21 0-37-16t-15-36 15-37 37-15l503 0-171-172q-15-15-15-36t15-37 36-15 37 15l298 297-298 297q-15 15-37 15t-36-15-15-36q0-23 15-38l171-171-503 0z" horiz-adv-x="1006" />
+<glyph glyph-name="left-small" unicode="&#xe836;" d="M833 392v-84h-500l230-229-60-59-330 330 330 330 60-59-230-229h500z" horiz-adv-x="1000" />
 
-<glyph glyph-name="down-small" unicode="&#xe824;" d="M505 346q15-15 15-37t-15-37l-245-245-245 245q-15 15-15 37t15 37 37 15 37-15l120-119 0 395q0 21 15 36t36 15 37-15 16-36l0-395 120 119q15 15 36 15t36-15z" horiz-adv-x="520" />
+<glyph glyph-name="left-bold" unicode="&#xe837;" d="M833 475v-250h-333v-202l-327 327 327 327v-202h333z" horiz-adv-x="1000" />
 
-<glyph glyph-name="left-small" unicode="&#xe825;" d="M595 403q21 0 36-16t15-37-15-37-36-15l-395 0 119-119q15-15 15-37t-15-37-36-15q-23 0-38 15l-245 245 245 245q15 15 37 15t37-15 15-37-15-37l-119-118 395 0z" horiz-adv-x="646" />
+<glyph glyph-name="file-pdf" unicode="&#xe838;" d="M583 475h230l-230 229v-229m-291 292h333l250-250v-500a83 83 0 0 0-83-84h-500c-47 0-84 38-84 84v666a83 83 0 0 0 84 84m205-435c17-38 39-69 64-90l17-13c-36-7-86-19-139-39v0l-5-2 21 44c19 36 33 69 42 100m270-159c8 7 11 17 12 27 1 9-1 17-5 23-12 20-44 29-95 29l-54-3-36 24c-26 22-50 60-67 107l2 6c14 55 26 122-1 150-7 7-16 10-25 10h-10c-16 0-30-16-33-32-16-56-7-86 9-136v-1c-11-37-24-79-45-122l-40-75-37-20c-50-32-74-67-79-89-1-8 0-15 2-22l2-2 20-13 18-5c34 0 72 40 124 128l7 3c43 14 97 23 168 31 43-21 94-31 125-31 19 0 31 5 38 13m-17 30l4-5c-1-4-2-5-4-5h-2l-8-1c-19 0-48 8-79 21 4 4 6 4 10 4 58 0 75-10 79-14m-382-61c-27-50-52-77-70-84 2 16 20 44 50 71l20 13m126 288c-10 37-10 68-3 85l3 5 6-2c7-10 8-23 4-46l-1-7-7-34-2-1z" horiz-adv-x="1000" />
 
-<glyph glyph-name="right-small" unicode="&#xe826;" d="M328 595q15 15 36 15t37-15l245-245-245-245q-15-15-36-15-22 0-37 15t-15 37 15 37l120 119-395 0q-22 0-37 15t-16 37 16 37 37 16l395 0-120 118q-15 15-15 37t15 37z" horiz-adv-x="646" />
+<glyph glyph-name="revert-replay" unicode="&#xe839;" d="M500 642v166l-208-208 208-208v166a250 250 0 0 0 250-250 250 250 0 0 0-250-250 250 250 0 0 0-250 250h-83a333 333 0 0 1 333-333 333 333 0 0 1 333 333 333 333 0 0 1-333 334z" horiz-adv-x="1000" />
 
-<glyph glyph-name="up-small" unicode="&#xe827;" d="M260 673l245-245q15-15 15-37t-15-37-36-15-36 15l-120 120 0-395q0-21-16-37t-37-15-36 15-15 37l0 395-120-120q-15-15-37-15t-37 15-15 37 15 37z" horiz-adv-x="520" />
+<glyph glyph-name="bell" unicode="&#xe83a;" d="M667 142h-375v271c0 104 83 187 187 187 104 0 188-83 188-187m83-230v230c0 127-89 235-208 263v28a63 63 0 0 1-63 63 63 63 0 0 1-62-63v-28c-120-28-209-136-209-263v-230l-83-83v-42h708v42m-354-167a83 83 0 0 1 84 84h-167a83 83 0 0 1 83-84z" horiz-adv-x="1000" />
 
-<glyph glyph-name="down-open-big" unicode="&#xe828;" d="M63 570l370-356 372 356q22 26 48 0 26-22 0-48l-396-392q-22-22-48 0l-396 392q-26 26 0 48 24 24 50 0z" horiz-adv-x="866" />
+<glyph glyph-name="bookmark-empty" unicode="&#xe83b;" d="M708 100l-208 91-208-91v542h416m0 83h-416a83 83 0 0 1-84-83v-667l292 125 292-125v667c0 46-38 83-84 83z" horiz-adv-x="1000" />
 
-<glyph glyph-name="up-open-big" unicode="&#xe829;" d="M804 130l-372 358-370-358q-26-22-50 0-24 24 0 50l396 390q26 26 48 0l396-390q24-26 0-50-26-22-48 0z" horiz-adv-x="864" />
+<glyph glyph-name="help" unicode="&#xe83c;" d="M417 58h125v-125h-125v125m83 709c223-9 320-234 188-403-35-42-91-69-118-104-28-35-28-77-28-118h-125c0 69 0 128 28 170 27 41 83 66 118 93 100 94 75 226-63 237a125 125 0 0 1-125-125h-125a250 250 0 0 0 250 250z" horiz-adv-x="1000" />
 
-<glyph glyph-name="pencil" unicode="&#xe82a;" d="M795 731c50-46 44-118-4-165l-46-46s35 53-37 123c-64 64-124 37-124 37l49 48c43 45 120 45 162 3z m-89-250l-492-493-210-51-4 4 55 210 493 490c8 2 30 9 60 2l-523-522-15-55 60-60 56 15 25 24 3 56-40 40 479 479c7-7 7-7 15-15 71-70 38-124 38-124z" horiz-adv-x="830" />
+<glyph glyph-name="file-new" unicode="&#xe83d;" d="M542 475h229l-229 229v-229m-292 292h333l250-250v-500a83 83 0 0 0-83-84h-500c-46 0-83 38-83 84v666c0 47 37 84 83 84m208-542v125h-83v-125h-125v-83h125v-125h83v125h125v83h-125z" horiz-adv-x="1000" />
 
-<glyph glyph-name="pencil-1" unicode="&#xe82b;" d="M0-41q0 4 1 8t1 8 1 8 1 6l0 2 74 267q10 31 31 53l325 324 0 2 2 2 150 152q60 59 146 59 106 0 186-80 74-74 81-171t-58-161l-476-481q-24-23-55-31l-263-70-3-1q-3-1-7-2t-9-1-10-1-9-1q-45 0-77 32t-32 77z m63 0q0-19 13-33t33-14q6 0 22 4l115 32q4 58-43 105-45 45-105 43l-32-119q-3-14-3-18z m44 168q67-2 118-52t52-120l116 30 11 6q41 47 34 115t-61 121q-51 49-115 59t-112-24q-7-10-11-21z m131 225q45-2 90-20l295 295q-88 22-144-33z m119-35q38-20 65-45 21-22 41-55l297 299q-16 31-39 55-30 29-67 45z m122-129q17-41 21-82l0-24 242 245 0 2q61 60 31 156z m101 508q106 0 186-80 70-73 78-166l0-22 52 55q45 45 41 111-5 74-62 131-63 62-143 62-60 0-101-41z" horiz-adv-x="1000" />
+<glyph glyph-name="file" unicode="&#xe83e;" d="M542 475h229l-229 229v-229m-292 292h333l250-250v-500a83 83 0 0 0-83-84h-500c-46 0-83 38-83 84v666c0 47 37 84 83 84m208-84h-208v-666h208l292 0v375h-292v291z" horiz-adv-x="1000" />
 
-<glyph glyph-name="bookmark-empty" unicode="&#xf097;" d="M643 707h-572v-693l237 227 49 47 50-47 236-227v693z m7 72q12 0 24-5 19-8 29-23t11-35v-719q0-19-11-35t-29-23q-10-4-24-4-27 0-47 18l-246 236-246-236q-20-19-46-19-13 0-25 5-18 7-29 23t-11 35v719q0 19 11 35t29 23q12 5 25 5h585z" horiz-adv-x="714.3" />
+<glyph glyph-name="book-open" unicode="&#xe83f;" d="M875 642c-46 14-97 21-146 21-81 0-169-17-229-63-60 46-148 63-229 63-81 0-169-17-229-63v-610c0-11 10-21 21-21 4 0 6 2 10 2 56 27 137 46 198 46 81 0 169-17 229-63 56 36 158 63 229 63 69 0 140-13 198-44 4-2 6-2 11-2 10 0 20 10 20 21v608c-25 19-52 31-83 42m0-563c-46 15-96 21-146 21-71 0-173-27-229-62v479c56 35 158 62 229 62 50 0 100-6 146-21v-479z" horiz-adv-x="1000" />
 
-<glyph glyph-name="docs" unicode="&#xf0c5;" d="M946 636q23 0 38-16t16-38v-678q0-23-16-38t-38-16h-535q-23 0-38 16t-16 38v160h-303q-23 0-38 16t-16 38v375q0 22 11 49t27 42l228 228q15 16 42 27t49 11h232q23 0 38-16t16-38v-183q38 23 71 23h232z m-303-119l-167-167h167v167z m-357 214l-167-167h167v167z m109-361l176 176v233h-214v-233q0-22-15-37t-38-16h-233v-357h286v143q0 22 11 49t27 42z m534-449v643h-215v-232q0-22-15-38t-38-15h-232v-358h500z" horiz-adv-x="1000" />
+<glyph glyph-name="pencil" unicode="&#xe840;" d="M702 736c-17 0-32-6-45-18l-88-88 221-222 88 88c25 25 25 65 0 89l-132 133c-13 12-28 18-44 18m-163-136l-337-338 106-12 8-95 95-7 12-107 337 338m-583-156l-73-278 279 74-10 90-96 7-7 97" horiz-adv-x="1000" />
 
-<glyph glyph-name="menu" unicode="&#xf0c9;" d="M857 100v-71q0-15-10-25t-26-11h-785q-15 0-25 11t-11 25v71q0 15 11 25t25 11h785q15 0 26-11t10-25z m0 286v-72q0-14-10-25t-26-10h-785q-15 0-25 10t-11 25v72q0 14 11 25t25 10h785q15 0 26-10t10-25z m0 285v-71q0-14-10-25t-26-11h-785q-15 0-25 11t-11 25v71q0 15 11 26t25 10h785q15 0 26-10t10-26z" horiz-adv-x="857.1" />
+<glyph glyph-name="check" unicode="&#xe841;" d="M875 558l-500-500-229 230 59 58 170-170 441 441 59-59z" horiz-adv-x="1000" />
 
-<glyph glyph-name="sitemap" unicode="&#xf0e8;" d="M1000 154v-179q0-22-16-38t-38-16h-178q-22 0-38 16t-16 38v179q0 22 16 38t38 15h53v107h-285v-107h53q23 0 38-15t16-38v-179q0-22-16-38t-38-16h-178q-23 0-38 16t-16 38v179q0 22 16 38t38 15h53v107h-285v-107h53q23 0 38-15t16-38v-179q0-22-16-38t-38-16h-178q-23 0-38 16t-16 38v179q0 22 16 38t38 15h53v107q0 29 21 51t51 21h285v107h-53q-23 0-38 16t-16 37v179q0 22 16 38t38 16h178q23 0 38-16t16-38v-179q0-22-16-37t-38-16h-53v-107h285q29 0 51-21t21-51v-107h53q23 0 38-15t16-38z" horiz-adv-x="1000" />
+<glyph glyph-name="home" unicode="&#xe842;" d="M417 17v250h166v-250h209v333h125l-417 375-417-375h125v-333h209z" horiz-adv-x="1000" />
 
-<glyph glyph-name="doc-text" unicode="&#xf0f6;" d="M819 638q16-16 27-42t11-50v-642q0-23-15-38t-38-16h-750q-23 0-38 16t-16 38v892q0 23 16 38t38 16h500q22 0 49-11t42-27z m-248 136v-210h210q-5 17-12 23l-175 175q-6 7-23 12z m215-853v572h-232q-23 0-38 16t-16 37v233h-429v-858h715z m-572 483q0 7 5 12t13 5h393q8 0 13-5t5-12v-36q0-8-5-13t-13-5h-393q-8 0-13 5t-5 13v36z m411-125q8 0 13-5t5-13v-36q0-8-5-13t-13-5h-393q-8 0-13 5t-5 13v36q0 8 5 13t13 5h393z m0-143q8 0 13-5t5-13v-36q0-8-5-13t-13-5h-393q-8 0-13 5t-5 13v36q0 8 5 13t13 5h393z" horiz-adv-x="857.1" />
+<glyph glyph-name="link" unicode="&#xe843;" d="M441 291c17-16 17-43 0-59-16-16-43-16-59 0-81 81-81 213 0 295v0l148 147c81 81 213 81 294 0 81-81 81-213 0-294l-62-62c1 34-5 68-17 100l20 20c49 49 49 128 0 177-49 49-128 49-177 0l-147-147c-49-49-49-128 0-177m118 177c16 16 43 16 59 0 81-81 81-213 0-295v0l-148-147c-81-81-213-81-294 0-81 81-81 213 0 294l62 63c0-35 5-69 17-102l-20-19c-49-49-49-128 0-177 49-49 128-49 177 0l147 147c49 49 49 128 0 177-17 16-17 43 0 59z" horiz-adv-x="1000" />
 
-<glyph glyph-name="smile" unicode="&#xf118;" d="M633 250q-21-67-77-109t-127-41-128 41-77 109q-4 14 3 27t21 18q14 4 27-2t17-22q14-44 52-72t85-28 84 28 52 72q4 15 18 22t27 2 21-18 2-27z m-276 243q0-30-21-51t-50-21-51 21-21 51 21 50 51 21 50-21 21-50z m286 0q0-30-21-51t-51-21-50 21-21 51 21 50 50 21 51-21 21-50z m143-143q0 73-29 139t-76 114-114 76-138 28-139-28-114-76-76-114-29-139 29-139 76-113 114-77 139-28 138 28 114 77 76 113 29 139z m71 0q0-117-57-215t-156-156-215-58-216 58-155 156-58 215 58 215 155 156 216 58 215-58 156-156 57-215z" horiz-adv-x="857.1" />
+<glyph glyph-name="checkbox-marked" unicode="&#xe844;" d="M417 142l-209 208 59 59 150-149 316 316 59-59m0 208h-584c-46 0-83-37-83-83v-584a83 83 0 0 1 83-83h584a83 83 0 0 1 83 83v584c0 46-37 83-83 83z" horiz-adv-x="1000" />
 
-<glyph glyph-name="frown" unicode="&#xf119;" d="M633 164q4-14-2-27t-21-17-27 2-18 21q-14 45-52 72t-84 28-85-28-52-72q-4-14-17-21t-27-2q-15 4-21 17t-3 27q21 68 77 109t128 41 127-41 77-109z m-276 329q0-30-21-51t-50-21-51 21-21 51 21 50 51 21 50-21 21-50z m286 0q0-30-21-51t-51-21-50 21-21 51 21 50 50 21 51-21 21-50z m143-143q0 73-29 139t-76 114-114 76-138 28-139-28-114-76-76-114-29-139 29-139 76-113 114-77 139-28 138 28 114 77 76 113 29 139z m71 0q0-117-57-215t-156-156-215-58-216 58-155 156-58 215 58 215 155 156 216 58 215-58 156-156 57-215z" horiz-adv-x="857.1" />
+<glyph glyph-name="login" unicode="&#xe845;" d="M792 725h-584c-46 0-83-37-83-83v-167h83v167h584v-584h-584v167h-83v-167a83 83 0 0 1 83-83h584a83 83 0 0 1 83 83v584c0 46-37 83-83 83m-372-524l59-59 209 208-209 208-59-58 108-108h-403v-84h403l-108-107z" horiz-adv-x="1000" />
 
-<glyph glyph-name="meh" unicode="&#xf11a;" d="M643 243q0-15-11-25t-25-11h-357q-14 0-25 11t-11 25 11 25 25 11h357q15 0 25-11t11-25z m-286 250q0-30-21-51t-50-21-51 21-21 51 21 50 51 21 50-21 21-50z m286 0q0-30-21-51t-51-21-50 21-21 51 21 50 50 21 51-21 21-50z m143-143q0 73-29 139t-76 114-114 76-138 28-139-28-114-76-76-114-29-139 29-139 76-113 114-77 139-28 138 28 114 77 76 113 29 139z m71 0q0-117-57-215t-156-156-215-58-216 58-155 156-58 215 58 215 155 156 216 58 215-58 156-156 57-215z" horiz-adv-x="857.1" />
+<glyph glyph-name="down-open-big" unicode="&#xe846;" d="M309 493l191-192 191 192 59-60-250-250-250 250 59 60z" horiz-adv-x="1000" />
 
-<glyph glyph-name="code" unicode="&#xf121;" d="M344 69l-28-28q-5-5-12-5t-13 5l-260 261q-6 5-6 12t6 13l260 260q5 6 13 6t12-6l28-28q6-5 6-13t-6-12l-219-220 219-219q6-6 6-13t-6-13z m330 596l-208-721q-2-7-9-11t-13-1l-34 9q-8 3-11 9t-2 14l209 720q2 8 8 11t13 2l35-10q7-2 11-9t1-13z m367-363l-260-261q-6-5-13-5t-13 5l-28 28q-5 6-5 13t5 13l219 219-219 220q-5 5-5 12t5 13l28 28q6 6 13 6t13-6l260-260q5-5 5-13t-5-12z" horiz-adv-x="1071.4" />
+<glyph glyph-name="logout" unicode="&#xe847;" d="M587 200l108 108h-403v84h403l-108 108 59 58 208-208-208-208-59 58m205 525a83 83 0 0 0 83-83v-195l-83 83v112h-584v-584h584v112l83 83v-195a83 83 0 0 0-83-83h-584c-46 0-83 38-83 83v584c0 46 37 83 83 83h584z" horiz-adv-x="1000" />
 
-<glyph glyph-name="puzzle" unicode="&#xf12e;" d="M929 237q0-45-25-75t-69-30q-23 0-43 10t-33 21-32 21-39 10q-62 0-62-69 0-22 9-65t8-64v-3q-12 0-18 0-19-2-54-7t-65-7-54-3q-35 0-58 15t-23 47q0 20 9 39t22 32 21 33 10 43q0 44-31 69t-75 25q-47 0-80-26t-33-71q0-24 9-46t18-36 19-30 8-28q0-25-25-50-21-19-65-19-54 0-137 13-5 1-16 2t-15 3l-7 1q-1 0-2 0-1 0-1 1v571q1 0 10-2t19-2 12-2q83-14 137-14 44 0 65 20 25 24 25 49 0 13-8 29t-19 29-18 36-9 47q0 45 33 71t81 25q44 0 74-25t31-69q0-23-10-43t-21-33-22-31-9-40q0-32 23-47t58-14q35 0 100 8t91 9v-1q-1-1-2-9t-3-19-2-12q-13-84-13-137 0-45 19-65 25-26 50-26 12 0 28 8t30 19 36 19 46 8q46 0 71-33t26-80z" horiz-adv-x="928.6" />
+<glyph glyph-name="up-open-big" unicode="&#xe848;" d="M309 208l191 191 191-191 59 59-250 250-250-250 59-59z" horiz-adv-x="1000" />
 
-<glyph glyph-name="file-pdf" unicode="&#xf1c1;" d="M819 638q16-16 27-42t11-50v-642q0-23-15-38t-38-16h-750q-23 0-38 16t-16 38v892q0 23 16 38t38 16h500q22 0 49-11t42-27z m-248 136v-210h210q-5 17-12 23l-175 175q-6 7-23 12z m215-853v572h-232q-23 0-38 16t-16 37v233h-429v-858h715z m-287 331q18-14 47-31 33 4 65 4 82 0 99-27 9-13 1-29 0-1-1-1l-1-2v0q-3-21-39-21-27 0-64 11t-73 29q-123-13-219-46-85-146-135-146-8 0-15 4l-14 7q0 0-3 2-6 6-4 20 5 23 32 51t73 54q8 5 13-3 1-1 1-2 29 47 60 110 38 76 58 146-13 46-17 89t4 71q6 22 23 22h12q13 0 20-8 10-12 5-38-1-3-2-4 0-2 0-5v-17q-1-68-8-107 31-91 82-133z m-321-229q29 13 76 88-29-22-49-47t-27-41z m222 513q-9-23-2-73 1 4 4 24 0 2 4 24 1 3 3 5-1 0-1 1-1 1-1 2 0 12-7 20 0-1 0-1v-2z m-70-368q76 30 159 45-1 0-7 5t-9 8q-43 37-71 98-15-48-46-110-17-31-26-46z m361 9q-13 13-78 13 42-16 69-16 8 0 10 1 0 0-1 2z" horiz-adv-x="857.1" />
+<glyph glyph-name="files" unicode="&#xe849;" d="M625 558h229l-229 230v-230m-292 292h334l250-250v-500a83 83 0 0 0-84-83h-500c-46 0-83 37-83 83v667a83 83 0 0 0 83 83m-166-167v-750h666v-83h-666a83 83 0 0 0-84 83v750h84z" horiz-adv-x="1000" />
+
+<glyph glyph-name="file-text" unicode="&#xe84a;" d="M542 475h229l-229 229v-229m-292 292h333l250-250v-500a83 83 0 0 0-83-84h-500c-46 0-83 38-83 84v666c0 47 37 84 83 84m375-667v83h-375v-83h375m125 167v83h-500v-83h500z" horiz-adv-x="1000" />
+
+<glyph glyph-name="frown" unicode="&#xe84b;" d="M833 350a333 333 0 0 1-333 333 333 333 0 0 1-333-333 333 333 0 0 1 333-333 333 333 0 0 1 333 333m84 0a417 417 0 0 0-417-417 417 417 0 0 0-417 417 417 417 0 0 0 417 417 417 417 0 0 0 417-417m-271 167c33 0 62-29 62-63 0-33-29-62-62-62-33 0-63 29-63 62 0 34 30 63 63 63m-229-63c0-33-29-62-63-62-33 0-62 29-62 62 0 34 29 63 62 63 34 0 63-29 63-63m83-187c73 0 137-30 175-76l-60-59c-18 31-63 51-115 51-52 0-97-20-115-51l-60 59c38 46 102 76 175 76z" horiz-adv-x="1000" />
+
+<glyph glyph-name="star-outline" unicode="&#xe84c;" d="M500 209l-157-95 42 179-139 120 183 15 71 168 71-168 183-15-139-120 42-179m260 351l-300 25-117 277-117-277-300-25 227-197-67-293 257 155 258-155-69 293 228 197z" horiz-adv-x="1000" />
+
+<glyph glyph-name="sitemap" unicode="&#xe84d;" d="M375 767v-250h83v-125h-250c-46 0-83-37-83-84v-125h-83v-250h250v250h-84v125h250v-125h-83v-250h250v250h-83v125h250v-125h-84v-250h250v250h-83v125c0 47-37 84-83 84h-250v125h83v250h-250z" horiz-adv-x="1000" />
+
+<glyph glyph-name="cog" unicode="&#xe84e;" d="M500 204a146 146 0 0 0-146 146 146 146 0 0 0 146 146 146 146 0 0 0 146-146 146 146 0 0 0-146-146m310 106c1 13 3 26 3 40 0 14-2 28-3 42l88 68c7 6 10 17 5 26l-84 144c-5 10-16 13-25 10l-104-42c-22 16-44 30-70 41l-16 110c-1 10-10 18-21 18h-166c-11 0-19-8-21-18l-16-110c-26-11-48-25-70-41l-104 42c-9 3-20 0-25-10l-83-144c-6-9-3-20 5-26l87-68c-1-14-2-28-2-42 0-14 1-27 2-40l-87-70c-8-6-11-17-5-26l83-144c5-10 16-13 25-10l104 43c22-17 44-31 70-42l16-110c2-10 10-18 21-18h166c11 0 20 8 21 18l16 110c26 11 48 25 70 42l104-43c9-3 20 0 25 10l84 144c5 9 2 20-5 26l-88 70z" horiz-adv-x="1000" />
+
+<glyph glyph-name="puzzle" unicode="&#xe84f;" d="M854 392h-62v166c0 47-38 84-84 84h-166v62a104 104 0 0 1-104 104 104 104 0 0 1-105-104v-62h-166a83 83 0 0 1-84-84v-158h63c62 0 112-50 112-112 0-63-50-113-112-113h-63v-158a83 83 0 0 1 84-84h158v63c0 62 50 112 113 112 62 0 112-50 112-112v-63h158a83 83 0 0 1 84 84v166h62a104 104 0 0 1 104 105 104 104 0 0 1-104 104z" horiz-adv-x="1000" />
+
+<glyph glyph-name="plus" unicode="&#xe850;" d="M792 308h-250v-250h-84v250h-250v84h250v250h84v-250h250v-84z" horiz-adv-x="1000" />
+
+<glyph glyph-name="pencil-1" unicode="&#xe851;" d="M863 557c16 16 16 43 0 58l-98 98c-15 16-42 16-58 0l-77-76 156-157m-661-349v-156h156l461 461-156 157-461-462z" horiz-adv-x="1000" />
+
+<glyph glyph-name="minus" unicode="&#xe852;" d="M792 308h-584v84h584v-84z" horiz-adv-x="1000" />
+
+<glyph glyph-name="up" unicode="&#xe853;" d="M292 225l208 208 208-208h-416z" horiz-adv-x="1000" />
+
+<glyph glyph-name="menu" unicode="&#xe854;" d="M125 600h750v-83h-750v83m0-208h750v-84h-750v84m0-209h750v-83h-750v83z" horiz-adv-x="1000" />
+
+<glyph glyph-name="search" unicode="&#xe855;" d="M396 725a271 271 0 0 0 271-271c0-67-25-129-65-176l11-11h33l208-209-62-62-209 208v33l-11 11c-47-40-109-65-176-65a271 271 0 0 0-271 271 271 271 0 0 0 271 271m0-83c-104 0-188-84-188-188 0-104 84-187 188-187 104 0 187 83 187 187 0 104-83 188-187 188z" horiz-adv-x="1000" />
+
+<glyph glyph-name="clipboard-empty" unicode="&#xe856;" d="M292 517v83h-84v-542h584v542h-84v-83h-416m83 166a125 125 0 0 0 125 125 125 125 0 0 0 125-125h167a83 83 0 0 0 83-83v-542a83 83 0 0 0-83-83h-584a83 83 0 0 0-83 83v542a83 83 0 0 0 83 83h167m125 42a42 42 0 0 1-42-42 42 42 0 0 1 42-41 42 42 0 0 1 42 41 42 42 0 0 1-42 42z" horiz-adv-x="1000" />
+
+<glyph glyph-name="clipboard" unicode="&#xe857;" d="M708 475h-416v83h416m0-250h-416v84h416m-125-250h-291v83h291m-83 500a42 42 0 0 0 42-42 42 42 0 0 0-42-41 42 42 0 0 0-42 41 42 42 0 0 0 42 42m292 0h-174c-18 48-64 83-118 83-54 0-100-35-117-83h-175a83 83 0 0 1-83-83v-584a83 83 0 0 1 83-83h584a83 83 0 0 1 83 83v584a83 83 0 0 1-83 83z" horiz-adv-x="1000" />
+
+<glyph glyph-name="clock" unicode="&#xe858;" d="M500 17a333 333 0 0 1 333 333 333 333 0 0 1-333 333 333 333 0 0 1-333-333 333 333 0 0 1 333-333m0 750a417 417 0 0 0 417-417 417 417 0 0 0-417-417c-230 0-417 188-417 417a417 417 0 0 0 417 417m21-209v-218l187-112-31-51-219 131v250h63z" horiz-adv-x="1000" />
+
+<glyph glyph-name="down" unicode="&#xe859;" d="M292 433l208-208 208 208h-416z" horiz-adv-x="1000" />
+
+<glyph glyph-name="cloud" unicode="&#xe85a;" d="M792 100h-542a167 167 0 0 0-167 167 167 167 0 0 0 167 166h30c27 97 116 167 220 167a229 229 0 0 0 229-229v-21h63a125 125 0 0 0 125-125 125 125 0 0 0-125-125m14 332c-28 143-154 251-306 251-120 0-225-68-277-168-125-13-223-119-223-248a250 250 0 0 1 250-250h542a208 208 0 0 1 208 208c0 110-85 199-194 207z" horiz-adv-x="1000" />
+
+<glyph glyph-name="code-braces" unicode="&#xe85b;" d="M333 725a83 83 0 0 1-83-83v-167a83 83 0 0 0-83-83h-42v-84h42a83 83 0 0 0 83-83v-167a83 83 0 0 1 83-83h84v83h-84v209a83 83 0 0 1-83 83 83 83 0 0 1 83 83v209h84v83m250 0a83 83 0 0 0 83-83v-167a83 83 0 0 1 83-83h42v-84h-42a83 83 0 0 1-83-83v-167a83 83 0 0 0-83-83h-84v83h84v209a83 83 0 0 0 83 83 83 83 0 0 0-83 83v209h-84v83h84z" horiz-adv-x="1000" />
+
+<glyph glyph-name="disk" unicode="&#xe85c;" d="M500 267c-46 0-83 37-83 83 0 46 37 83 83 83 46 0 83-37 83-83a83 83 0 0 0-83-83m0 416a333 333 0 0 1-333-333 333 333 0 0 1 333-333 333 333 0 0 1 333 333 333 333 0 0 1-333 333z" horiz-adv-x="1000" />
+
+<glyph glyph-name="mail" unicode="&#xe85d;" d="M833 683h-666a83 83 0 0 1-84-83v-500a83 83 0 0 1 84-83h666a83 83 0 0 1 84 83v500a83 83 0 0 1-84 83m0-583h-666v417l333-209 333 209v-417m0 500l-333-208-333 208v0h666v0z" horiz-adv-x="1000" />
+
+<glyph glyph-name="smile" unicode="&#xe85e;" d="M833 350a333 333 0 0 1-333 333 333 333 0 0 1-333-333 333 333 0 0 1 333-333 333 333 0 0 1 333 333m84 0a417 417 0 0 0-417-417 417 417 0 0 0-417 417 417 417 0 0 0 417 417 417 417 0 0 0 417-417m-500 104c0-33-29-62-63-62-33 0-62 29-62 62 0 34 29 63 62 63 34 0 63-29 63-63m291 0c0-33-29-62-62-62-33 0-63 29-63 62 0 34 30 63 63 63 33 0 62-29 62-63m-208-322c-73 0-137 31-175 76l60 59c18-30 63-52 115-52 52 0 97 22 115 52l60-59c-38-45-102-76-175-76z" horiz-adv-x="1000" />
+
+<glyph glyph-name="meh" unicode="&#xe85f;" d="M354 392a63 63 0 0 0-62 62 63 63 0 0 0 62 63 63 63 0 0 0 63-63 63 63 0 0 0-63-62m292 0a63 63 0 0 0-63 62 63 63 0 0 0 63 63 63 63 0 0 0 62-63 63 63 0 0 0-62-62m-146-375a333 333 0 0 1 333 333 333 333 0 0 1-333 333 333 333 0 0 1-333-333 333 333 0 0 1 333-333m0 750a417 417 0 0 0 417-417 417 417 0 0 0-417-417c-230 0-417 188-417 417a417 417 0 0 0 417 417m-125-500h250a42 42 0 0 0 42-42 42 42 0 0 0-42-42h-250a42 42 0 0 0-42 42 42 42 0 0 0 42 42z" horiz-adv-x="1000" />
+
+<glyph glyph-name="star" unicode="&#xe860;" d="M500 130l258-155-69 293 228 197-300 26-117 276-117-276-300-26 227-197-67-293 257 155z" horiz-adv-x="1000" />
+
+<glyph glyph-name="code" unicode="&#xe861;" d="M608 158l192 192-192 192 59 58 250-250-250-250-59 58m-216 0l-192 192 192 192-59 58-250-250 250-250 59 58z" horiz-adv-x="1000" />
+
+<glyph glyph-name="user-circle" unicode="&#xe86c;" d="M500 50c-104 0-196 53-250 133 1 84 167 130 250 130 83 0 249-46 250-130-54-80-146-133-250-133m0 592a125 125 0 0 0 125-125 125 125 0 0 0-125-125 125 125 0 0 0-125 125 125 125 0 0 0 125 125m0 125a417 417 0 0 1-417-417 417 417 0 0 1 417-417 417 417 0 0 1 417 417c0 230-188 417-417 417z" horiz-adv-x="1000" />
+
+<glyph glyph-name="comment-question" unicode="&#xe880;" d="M167 767a83 83 0 0 1-84-84v-500a83 83 0 0 1 84-83h166v-125a42 42 0 0 1 42-42h21v0c10 0 21 4 29 12l154 155h254a83 83 0 0 1 84 83v500c0 47-38 84-84 84h-666m0-84h666v-500h-288l-128-128v128h-250v500m341-62c-37 0-67-8-89-23-23-15-35-40-33-68-377 0-112 0 82 0 0 11 5 20 11 26 9 6 18 9 29 9 13 0 24-4 32-11 7-7 11-16 11-29 0-12-3-22-9-31-7-9-16-16-27-22-22-14-36-25-45-35-7-10-12-24-12-45h84c0 11 2 21 6 28 3 7 10 13 21 20 19 8 35 20 47 35 12 15 19 32 19 50 0 29-12 53-34 70-23 17-54 26-93 26m-50-271v-83h84v83h-84z" horiz-adv-x="1000" />
+
+<glyph glyph-name="jira" unicode="&#xe881;" d="M500 767a66 66 0 0 0 66-66 66 66 0 0 0-66-66 66 66 0 0 0-66 66 66 66 0 0 0 66 66m-175-44c36 0 65-30 65-66 0-36-29-66-65-66a66 66 0 0 0-66 66 66 66 0 0 0 66 66m350 0c37 0 66-30 66-66 0-36-29-66-66-66a66 66 0 0 0-65 66 66 66 0 0 0 65 66m-183-329c-88 88-66 131-66 131h154c0-65-88-131-88-131m88-439c0 0 0 88-176 263-175 176-197 220-219 351 0 0 16 22 38 0 22-21 72-38 115-38 0 0 44-137 165-225 0 0 159 164 159 230 0 0 49-11 109 33 0 0 42 22 44 0 6-44-38-197-219-351 0 0 115-131 104-263h-120m-198 220l93-105c-43-43-49-137-49-137h-131c21 176 87 242 87 242z" horiz-adv-x="1000" />
+
+<glyph glyph-name="right-bold" unicode="&#xe882;" d="M167 225v250h333v202l327-327-327-327v202h-333z" horiz-adv-x="1000" />
+
+<glyph glyph-name="down-bold" unicode="&#xe883;" d="M375 683h250v-333h202l-327-327-327 327h202v333z" horiz-adv-x="1000" />
 </font>
 </defs>
 </svg>

images/tools/00-default_checkbox-blank-circle-outline.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 20a8 8 0 0 1-8-8 8 8 0 0 1 8-8 8 8 0 0 1 8 8 8 8 0 0 1-8 8m0-18A10 10 0 0 0 2 12a10 10 0 0 0 10 10 10 10 0 0 0 10-10A10 10 0 0 0 12 2z"/></svg>

images/tools/01-edit_pencil.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-1.84 1.83 3.75 3.75M3 17.25V21h3.75L17.81 9.93l-3.75-3.75L3 17.25z"/></svg>

images/tools/02-create_pencil.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" height="24" width="24"><path d="M13.118 16.118h3v-3h2v3h3v2h-3v3h-2v-3h-3zM20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-1.84 1.83 3.75 3.75M3 17.25V21h3.75L17.81 9.93l-3.75-3.75z"/></svg>

images/tools/03-draft_android-studio.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M11 2h2v2h.5A1.5 1.5 0 0 1 15 5.5V9l-.44.44 1.64 2.84C17.31 11.19 18 9.68 18 8h2c0 2.42-1.07 4.59-2.77 6.06l3.14 5.44.13 2.22-1.87-1.22-3.07-5.33c-1.06.53-2.28.83-3.56.83-1.28 0-2.5-.3-3.56-.83L5.37 20.5 3.5 21.72l.13-2.22L9.44 9.44 9 9V5.5A1.5 1.5 0 0 1 10.5 4h.5V2M9.44 13.43c.78.37 1.65.57 2.56.57.91 0 1.78-.2 2.56-.57L13.1 10.9h-.01c-.62.6-1.56.6-2.18 0h-.01l-1.46 2.53M12 6a1 1 0 0 0-1 1 1 1 0 0 0 1 1 1 1 0 0 0 1-1 1 1 0 0 0-1-1z"/></svg>

images/tools/04-show_file-document.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M13 9h5.5L13 3.5V9M6 2h8l6 6v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4c0-1.11.89-2 2-2m9 16v-2H6v2h9m3-4v-2H6v2h12z"/></svg>

images/tools/05-source_file-xml.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M13 9h5.5L13 3.5V9M6 2h8l6 6v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4c0-1.11.89-2 2-2m.12 13.5l3.74 3.74 1.42-1.41-2.33-2.33 2.33-2.33-1.42-1.41-3.74 3.74m11.16 0l-3.74-3.74-1.42 1.41 2.33 2.33-2.33 2.33 1.42 1.41 3.74-3.74z"/></svg>

images/tools/06-revert_replay.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 5V1L7 6l5 5V7a6 6 0 0 1 6 6 6 6 0 0 1-6 6 6 6 0 0 1-6-6H4a8 8 0 0 0 8 8 8 8 0 0 0 8-8 8 8 0 0 0-8-8z"/></svg>

images/tools/07-revisions_history.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M11 7v5.11l4.71 2.79.79-1.28-4-2.37V7m0-5C8.97 2 5.91 3.92 4.27 6.77L2 4.5V11h6.5L5.75 8.25C6.96 5.73 9.5 4 12.5 4a7.5 7.5 0 0 1 7.5 7.5 7.5 7.5 0 0 1-7.5 7.5c-3.27 0-6.03-2.09-7.06-5h-2.1c1.1 4.03 4.77 7 9.16 7 5.24 0 9.5-4.25 9.5-9.5A9.5 9.5 0 0 0 12.5 2z"/></svg>

images/tools/08-backlink_link-variant.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M10.59 13.41c.41.39.41 1.03 0 1.42-.39.39-1.03.39-1.42 0a5.003 5.003 0 0 1 0-7.07l3.54-3.54a5.003 5.003 0 0 1 7.07 0 5.003 5.003 0 0 1 0 7.07l-1.49 1.49c.01-.82-.12-1.64-.4-2.42l.47-.48a2.982 2.982 0 0 0 0-4.24 2.982 2.982 0 0 0-4.24 0l-3.53 3.53a2.982 2.982 0 0 0 0 4.24m2.82-4.24c.39-.39 1.03-.39 1.42 0a5.003 5.003 0 0 1 0 7.07l-3.54 3.54a5.003 5.003 0 0 1-7.07 0 5.003 5.003 0 0 1 0-7.07l1.49-1.49c-.01.82.12 1.64.4 2.43l-.47.47a2.982 2.982 0 0 0 0 4.24 2.982 2.982 0 0 0 4.24 0l3.53-3.53a2.982 2.982 0 0 0 0-4.24.973.973 0 0 1 0-1.42z"/></svg>

images/tools/09-subscribe_email-outline.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2m0 14H4V8l8 5 8-5v10m0-12l-8 5-8-5h16z"/></svg>

images/tools/10-top_arrow-up.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M13 20h-2V8l-5.5 5.5-1.42-1.42L12 4.16l7.92 7.92-1.42 1.42L13 8v12z"/></svg>

images/tools/11-mediamanager_folder-image.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M5 17l4.5-6 3.5 4.5 2.5-3L19 17m1-11h-8l-2-2H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2z"/></svg>

images/tools/12-back_arrow-left.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20 11v2H8l5.5 5.5-1.42 1.42L4.16 12l7.92-7.92L13.5 5.5 8 11h12z"/></svg>

images/tools/40-pdf-file.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 24 24">
+    <path d="M14,9H19.5L14,3.5V9M7,2H15L21,8V20A2,2 0 0,1 19,22H7C5.89,22 5,21.1 5,20V4A2,2 0 0,1 7,2M11.93,12.44C12.34,13.34 12.86,14.08 13.46,14.59L13.87,14.91C13,15.07 11.8,15.35 10.53,15.84V15.84L10.42,15.88L10.92,14.84C11.37,13.97 11.7,13.18 11.93,12.44M18.41,16.25C18.59,16.07 18.68,15.84 18.69,15.59C18.72,15.39 18.67,15.2 18.57,15.04C18.28,14.57 17.53,14.35 16.29,14.35L15,14.42L14.13,13.84C13.5,13.32 12.93,12.41 12.53,11.28L12.57,11.14C12.9,9.81 13.21,8.2 12.55,7.54C12.39,7.38 12.17,7.3 11.94,7.3H11.7C11.33,7.3 11,7.69 10.91,8.07C10.54,9.4 10.76,10.13 11.13,11.34V11.35C10.88,12.23 10.56,13.25 10.05,14.28L9.09,16.08L8.2,16.57C7,17.32 6.43,18.16 6.32,18.69C6.28,18.88 6.3,19.05 6.37,19.23L6.4,19.28L6.88,19.59L7.32,19.7C8.13,19.7 9.05,18.75 10.29,16.63L10.47,16.56C11.5,16.23 12.78,16 14.5,15.81C15.53,16.32 16.74,16.55 17.5,16.55C17.94,16.55 18.24,16.44 18.41,16.25M18,15.54L18.09,15.65C18.08,15.75 18.05,15.76 18,15.78H17.96L17.77,15.8C17.31,15.8 16.6,15.61 15.87,15.29C15.96,15.19 16,15.19 16.1,15.19C17.5,15.19 17.9,15.44 18,15.54M8.83,17C8.18,18.19 7.59,18.85 7.14,19C7.19,18.62 7.64,17.96 8.35,17.31L8.83,17M11.85,10.09C11.62,9.19 11.61,8.46 11.78,8.04L11.85,7.92L12,7.97C12.17,8.21 12.19,8.53 12.09,9.07L12.06,9.23L11.9,10.05L11.85,10.09Z" />
+</svg>

images/tools/41-format-paint.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 24 24">
+    <path d="M18,4V3A1,1 0 0,0 17,2H5A1,1 0 0,0 4,3V7A1,1 0 0,0 5,8H17A1,1 0 0,0 18,7V6H19V10H9V21A1,1 0 0,0 10,22H12A1,1 0 0,0 13,21V12H21V4H18Z" />
+</svg>

images/tools/43-file-delimeted.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 24 24">
+    <path d="M13,9H18.5L13,3.5V9M6,2H14L20,8V20A2,2 0 0,1 18,22H6C4.89,22 4,21.1 4,20V4C4,2.89 4.89,2 6,2M14,15V11H10V15H12.3C12.6,17 12,18 9.7,19.38L10.85,20.2C13,19 14,16 14,15Z" />
+</svg>

img/down.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="24" height="24" viewBox="0 0 24 24"><path d="M7,10L12,15L17,10H7Z" /></svg>

img/file-export.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="24" height="24" viewBox="0 0 24 24"><path d="M6,2C4.89,2 4,2.9 4,4V20A2,2 0 0,0 6,22H18A2,2 0 0,0 20,20V8L14,2M13,3.5L18.5,9H13M8.93,12.22H16V19.29L13.88,17.17L11.05,20L8.22,17.17L11.05,14.35" /></svg>

img/up.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="24" height="24" viewBox="0 0 24 24"><path d="M7,15L12,10L17,15H7Z" /></svg>

lang/de/lang.php

@@ -1,16 +1,19 @@
 <?php
 /**
  * German language file for template
- *
+ *__background_site__
  * @license    GPL 2 (http://www.gnu.org/licenses/gpl.html)
  */
 
+
 $lang['direct_prefix']              = 'Direkt';
 $lang['direct_content_main']        = 'Hauptinhalt dieser Seite';
 $lang['direct_menu_main']           = 'Hauptmenü';
 
 $lang['adjunct_start_logo_text']    = 'Logo: ';
 $lang['adjunct_linked_logo_text']   = '. Link zur Startseite';
+$lang['a11y_search']                = 'geh zur Suche';
+$lang['a11y_sidebartoggle']         = 'Sidebar öffnen/schliessen';
 
 $lang['nav-area-head']              = 'Navigationsmenüs und Suche';
 $lang['head_magic_matcher']         = 'MagicMatcher';
@@ -27,6 +30,8 @@ $lang['meta_box_jira_tickets_none'] = 'Keine Jira-Tickets verknüpft';
 $lang['meta_box_tags_none']         = 'Keine Tags verknüpft';
 $lang['js']['meta_box_toc_none']    = 'kein Inhaltsverzeichnis vorhanden';
 
+$lang['tab_tags']                   = 'Tags';
+
 $lang['quality_trigger']            = 'Seitenanalyse ein- bzw. ausblenden';
 
 $lang['prefix_tasks']               = 'offene Aufgaben: ';
@@ -37,12 +42,44 @@ $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__']               = 'Schriftfarbe für Links zu vorhandenen Webseiten';
-$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 :
+/**
+ * colors
+ */
+
+$lang['__site_width__']             = 'Content - Breite (in %)';
+
+$lang['__background__']             = 'Website - Hintergrundfarbe';
+$lang['__text_webframe__']          = 'Website unverlinkt: Claim, Titel, Footer, Navigation - Schriftfarbe';
+
+$lang['__nav_menu_color__']         = 'verlinkt: Navigation, Footer, Pagetools Icons, Tabbox - Schriftfarbe';
+$lang['__nav_menu_hover_color__']   = 'verlinkt: Navigation (hover) - Schriftfarbe, Rahmenfarbe; Wiki Icons - Schriftfarbe; Wiki Icons (hover) - Hintergrundfarbe';
+$lang['__nav_menu_hover_bg__']      = 'verlinkt: Navigation (hover) - Hintergrundfarbe; Wiki Icons - Hintergrundfarbe; Wiki Icons (hover) - Schriftfarbe';
+
+$lang['__background_content__']     = 'Content, Breadcrumb, Pagetools (hover) - Hintergrundfarbe';
+$lang['__text__']                   = 'Content: Text - Schriftfarbe';
+
+$lang['__background_neu__']         = 'Content neutral (nicht zu unterschiedlich zum Content-Hintergrund) - Hintergrundfarbe';
+$lang['__text_neu__']               = 'Content neutral - Schriftfarbe';
+
+$lang['__background_page_header__'] = 'Content: Header, Footer, Tabinclude Tab controlls deaktiviert - Hintergrundfarbe';
+$lang['__background_page_footer__'] = 'Content: Footer, Tabinclude Tab controlls deaktiviert - Schriftfarbe';
+
+$lang['__border_light__']           = 'Content: Header, Footer - Rahmenfarbe';
+
+$lang['__highlight__']              = 'Texthervorhebung (z.B. für Suchergebnisse) - Hintergrundfarbe';
+$lang['__highlight_text__']         = 'Texthervorhebung (z.B. für Suchergebnisse) - Schriftfarbe';
+
+$lang['__existing__']               = 'Links zu Wikiseiten, Stift, Pagetools (hover) - Schriftfarbe; Tabbox (hover) - Schriftfarbe, Rahmenfarbe';
+$lang['__link__']                   = 'Links zu nicht-Wikiseiten (externe Links) - Schriftfarbe';
+$lang['__missing__']                = 'Links zu nicht vorhandenen Wikiseiten - Schriftfarbe';
+
+$lang['__button_color__']           = 'Buttons - Schriftfarbe';
+$lang['__button_background__']      = 'Buttons - Hintergrundfarbe';
+
+$lang['__background_alt__']         = 'Tabellenkopf, hover: Tabellenzeile, struct Label - Hintergrundfarbe (alternativ)';
+$lang['__text_alt__']               = 'Tabellenkopf unverlinkt, hover: Tabellenzeile, struct Label - Schriftfarbe (alternativ)';
+
+$lang['__border__']                 = 'Tabellen, Formularfelder, Zitate - Rahmenfarbe';
+$lang['__default_border_radius__']  = 'Wiki Icons, Content (oben rechts) - Borderradius';

lang/en/lang.php

@@ -5,6 +5,7 @@
  *  @license    GPL 2 (http://www.gnu.org/licenses/gpl.html)
  */
 
+
 $lang['direct_prefix']              = 'jump to';
 $lang['direct_content_main']        = 'main content';
 $lang['direct_menu_main']           = 'main menu';
@@ -30,6 +31,7 @@ $lang['meta_box_tags_none']         = 'tags found: none';
 $lang['js']['meta_box_toc_none']    = 'no Table of Contents available';
 
 $lang['tab_tags']                   = 'Tags';
+$lang['tab_issues']                 = 'Issues';
 
 $lang['quality_trigger']            = 'toggle page analysis';
 
@@ -41,10 +43,44 @@ $lang['tasks_page_none']            = 'no open tasks for this page';
 $lang['discussion']                 = 'Discussion';
 $lang['back_to_article']            = 'Back to article';
 $lang['userpage']                   = 'User page';
-$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';
+
+/**
+ * colors
+ */
+
+$lang['__site_width__']             = 'content - width (in %)';
+
+$lang['__background__']             = 'website - background color';
+$lang['__text_webframe__']          = 'website unlinked: claim, title, footer, navigation - font color';
+
+$lang['__nav_menu_color__']         = 'link: navigation, footer, pagetools icons, tabbox - font color';
+$lang['__nav_menu_hover_color__']   = 'link: navigation (hover) - font color, border color; wiki icons - font color; wiki icons (hover) - background color';
+$lang['__nav_menu_hover_bg__']      = 'link: navigation (hover) - background color; wiki icons - background color; wiki icons (hover) - font color';
+
+$lang['__background_content__']     = 'content, breadcrumb, pagetools (hover) - background color';
+$lang['__text__']                   = 'content: text - font color';
+
+$lang['__background_neu__']         = 'Content neutral (not too different from the content background) - background color';
+$lang['__text_neu__']               = 'content neutral: text - font color';
+
+$lang['__background_page_header__'] = 'content: header, footer, tabinclude tab controlls deactivate - background color';
+$lang['__background_page_footer__'] = 'content: footer, tabinclude tab controlls deactivate - font color';
+
+$lang['__border_light__']           = 'content: header, footer - border color';
+
+$lang['__highlight__']              = 'text emphasize (e.g. for search results) - background color';
+$lang['__highlight_text__']         = 'text emphasize (e.g. for search results) - font color';
+
+$lang['__existing__']               = 'links to wikipages, pencil, pagetools (hover) - font color; tabbox (hover) - font color, border color';
+$lang['__link__']                   = 'links to non wikipages (external links) - font color';
+$lang['__missing__']                = 'links to non-existing pages - font color';
+
+$lang['__button_color__']           = 'buttons - font color';
+$lang['__button_background__']      = 'buttons - background color';
+
+$lang['__background_alt__']         = 'table head, hover: table cell, struct Label - background color (alternative)';
+$lang['__text_alt__']               = 'table head unlinked, hover: table cell, struct Label - font color (alternative)';
+
+$lang['__border__']                 = 'tables, form fields, blockquotes - border color';
+$lang['__default_border_radius__']  = 'wiki icons, content (top right) - border radius';

main.php

@@ -9,14 +9,13 @@
  * @license  GPL 2 (http://www.gnu.org/licenses/gpl.html)
  */
 
+use dokuwiki\template\sprintdoc\Template;
+
 if (!defined('DOKU_INC')) die();                        /* must be run from within DokuWiki */
 header('X-UA-Compatible: IE=edge,chrome=1');
 
 $showTools = !tpl_getConf('hideTools') || ( tpl_getConf('hideTools') && !empty($_SERVER['REMOTE_USER']) );
 $showSidebar =  true; /*  */
-$hasFooter = page_findnearest('pagefooter');
-$showFooter = $hasFooter && ($ACT === 'show');
-
 ?>
 <html class="edge no-js" lang="<?php echo $conf['lang'] ?>" dir="<?php echo $lang['direction'] ?>">
 <head>
@@ -90,6 +89,12 @@ $classWideContent = ($ACT === "show") ? "": "wide-content ";
                 <div class="row">
                     <div class="col-xs-12">
                         <div class="claim main-sidebar">
+                            <div class="menu-togglelink mobile-only">
+                                <a href="#">
+                                    <span class="sr-out"><?php echo tpl_getLang('a11y_sidebartoggle'); ?></span>
+                                </a>
+                            </div>
+
                             <?php if (tpl_getConf('logo') && file_exists(mediaFN(tpl_getConf('logo')))){
 
 
@@ -99,11 +104,35 @@ $classWideContent = ($ACT === "show") ? "": "wide-content ";
 /* upload your logo into the data/media folder (root of the media manager) and replace 'logo.png' in der template config accordingly: */
                                 include('tpl/main-sidebar-logo.php');
                              } ?>
-                            <?php if ($conf['tagline']): ?>
+                            <div class="main-title">
+                                <?php if ($conf['title']):
+
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/* Wiki Title Mobile */
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */ ?>
+                                    <p class="title mobile-only"><?php echo $conf['title'] ?></p>
+                                <?php endif ?>
+                            </div><!-- .main-title -->
+                        </div><!-- .headings -->
+                    </div><!-- .col -->
+
+                    <div class="col-xs-12">
+                        <div class="main-title desktop-only">
+                            <?php if ($conf['title']):
+
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/* Wiki Title Desktop */
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */ ?>
+                                <p class="title"><?php echo $conf['title'] ?></p>
+                            <?php endif ?>
+                            <?php if ($conf['tagline']):
+
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/* Wiki Tagline Desktop */
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */ ?>
                                 <p class="claim"><?php echo $conf['tagline'] ?></p>
                             <?php endif ?>
-
-                        </div><!-- .headings -->
+                        </div><!-- .main-title -->
                     </div><!-- .col -->
                 </div><!-- .row -->
             </div><!-- .container -->
@@ -220,7 +249,7 @@ $classWideContent = ($ACT === "show") ? "": "wide-content ";
                         <div class="breadcrumbs" data-do="<?php echo $ACT?>">
 
                             <div class="togglelink page_main-content">
-                                <a href="#">&lt; &gt;<span class="sr-out"><?php echo tpl_getLang('a11y_sidebartoggle')?></span></a>
+                                <a href="#"><span class="sr-out"><?php echo tpl_getLang('a11y_sidebartoggle')?></span></a>
                             </div>
 
                             <h6 class="sr-only" role="heading" aria-level="2"><?php echo  tpl_getLang('head_menu_status')  ?></h6>
@@ -278,19 +307,13 @@ $classWideContent = ($ACT === "show") ? "": "wide-content ";
                                 tpl_content(false); /* the main content */
                             ?>
                             <div class="clearer"></div>
-                            <?php if($showFooter):
-
-
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
-/* Page Include Hook: pagefooter.txt */
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
-                                ?>
-                                <div class="wikipagefooter">
-                                    <hr>
-                                    <?php tpl_include_page('pagefooter', true, true) ?>
-                                    <div class="clearer"></div>
-                                </div>
-                            <?php endif; ?>
+                            <?php
+                            if($ACT == 'show') echo Template::getInstance()->getInclude(
+                                'footer',
+                                '<div class="wikipagefooter"><hr>',
+                                '<div class="clearer"></div></div>'
+                            );
+                            ?>
                         </div><!-- .main-content -->
 
 

style.ini

@@ -53,8 +53,7 @@
 
 css/base.less                         = all
 css/base_mixins.less                  = all
-css/base_fontello-codes.less          = all
-css/base_fonts.less                   = all
+css/base_fontello-icons.less          = all
 css/base_structure.less               = all
 css/base_design.less                  = all
 
@@ -78,6 +77,9 @@ css/area_main-sidebar-content.less    = all
 css/area_main-content.less            = all
 css/area_main-content-secedit.less    = all
 css/area_togglelink.less              = all
+css/area_forms.less                   = all
+css/area_search.less                  = all
+css/area_tabs.less                    = all
 
 css/template_admin.less               = all
 
@@ -94,8 +96,12 @@ css/plugins/highlight_parent.less     = all
 css/plugins/edit.less                 = all
 css/plugins/mediamanager.less         = all
 css/plugins/tabinclude.less           = all
+css/plugins/tagging.less              = all
 css/plugins/include.less              = all
 css/plugins/edittable.less            = all
+css/plugins/extension__manager.less   = all
+css/plugins/folded.less               = all
+css/plugins/configmanager.less        = all
 
 
 ; _____________  print styles  _____________
@@ -113,66 +119,72 @@ css/print.css                         = print
 [replacements]
 
 
-; + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
-; guaranteed dokuwiki color placeholders that every plugin can use
-; + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+; + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+; guaranteed dokuwiki color placeholders that every plugin can use + template specific placeholders
+; + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+; main content width (from this ASIDE is calculated)
+__site_width__              = "73%"              ; @ini_site_width
 
-; main text and background colors
-__text__                = "#252525"              ; @ini_text
-__background__          = "#ECECEC"              ; @ini_background
 
 ; alternative text and background colors
-__text_alt__            = "#454545"              ; @ini_text_alt
-__background_alt__      = "#f6f6f6"              ; @ini_background_alt
+__background__              = "#ECECEC"          ; @ini_background                         (guaranteed for every plugin)
 
-; neutral text and background colors
-__text_neu__            = "#656565"              ; @ini_text_neu
-__background_neu__      = "#ffffff"              ; @ini_background_neu
+__text_webframe__           = "#696969"          ; @ini_text_webframe
+
+
+; icons: usertools, pagetools, metabox, tabbox
+__nav_menu_color__          = "#696969"          ; @ini_nav_menu_color
+__nav_menu_hover_color__    = "#286da8"          ; @ini_nav_menu_hover_color
+__nav_menu_hover_bg__       = "#FFF"             ; @ini_nav_menu_hover_bg
+
+__background_content__      = "#FFF"             ; @ini_background_content
+__text__                    = "#252525"          ; @ini_text                               (guaranteed for every plugin)
+
+__background_neu__          = "#ffffff"          ; @ini_background_neu                     (guaranteed for every plugin)
+__text_neu__                = "#656565"          ; @ini_text_neu                           (guaranteed for every plugin)
+
+__background_page_header__  = "#F6F6F6"          ; @ini_background_page_header
+__border_light__            = "#dadada"          ; @ini_border_light
+__background_page_footer__  = "#252525"          ; @ini_background_page_footer
 
-; border color
-__border__              = "#bbbbbb"              ; @ini_border
 
 ; highlighted text (e.g. search snippets)
-__highlight__           = "#efefef"              ; @ini_highlight
+__highlight__               = "#efefef"          ; @ini_highlight                          (guaranteed for every plugin)
+__highlight_text__          = "#252525"          ; @ini_highlight_text
 
 
-
-; + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
-; template specific placeholders
-; + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
-
 ; these are used for links
-__link__                    = "#286DA8"                                                 ; @ini_link
-__existing__                = "#286DA8"                                                 ; @ini_existing
-__missing__                 = "#CD5360"                                                 ; @ini_missing
+__existing__                = "#286DA8"          ; @ini_existing
+__missing__                 = "#CD5360"          ; @ini_missing
+__link__                    = "#286DA8"          ; @ini_link
 
-__button_color__            = "#FFF"
-__button_background__       = "#286DA8"
 
-; widths
-__site_width__              = "64em"                                                    ; @ini_site_width
-__sidebar_width__           = "16em"                                                    ; @ini_sidebar_width
+; buttons: submit, links styled like buttons, togglebuttons
+__button_color__            = "#FFF"             ; @ini_button_color
+__button_background__       = "#286DA8"          ; @ini_button_background
 
-__font_family_screen__      = "arial, sans-serif"
-__font_family_menu__        = "arial, sans-serif"
-__font_family_print__       = "'times new roman', serif"
+__background_alt__          = "#f6f6f6"          ; @ini_background_alt                     (guaranteed for every plugin)
+__text_alt__                = "#454545"          ; @ini_text_alt                           (guaranteed for every plugin)
 
-__nav_direct_background__   = "#FFF"
-__nav_direct_color__        = "#286da8"
-__box_shadow_colored__      = "0 0 .5em rgba(40,109,168,.5)"
-__box_shadow__              = "0 0 .5em rgb(153,153,153,.5)"
-__box_shadow_right_bottom__ = "0.1em 0.3rem 0.5em rgb(153,153,153,.5)"
-__box_shadow_bottom__       = "0 0.1em 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__       = "#FFF"
 
-__background_content__      = "#FFF"
-__background_site__         = "#ECECEC"
+; border color
+__border__                  = "#bbbbbb"          ; @ini_border                             (guaranteed for every plugin)
 
-__default_border_radius__   = "3px"
+__default_border_radius__   = "3px"              ; @ini_default_border_radius
 
-__background_page-header__  = "#F6F6F6"
 
-__border_light__            = "#dadada"
+; + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+; obsolete
+
+;__sidebar_width__           = "23%"
+
+;__font_family_screen__      = "arial, sans-serif"
+;__font_family_menu__        = "arial, sans-serif"
+;__font_family_print__       = "times new roman, serif"
+
+;__box_shadow_colored__      = "0 0 .5em rgba(40,109,168,.5)"
+;__box_shadow__              = "0 0 .5em rgb(153,153,153,.5)"
+;__box_shadow_right_bottom__ = "0.1em 0.3rem 0.5em rgb(153,153,153,.5)"
+;__box_shadow_bottom__       = "0 0.1em 0.5em rgb(153,153,153,.5)"
+;__box_shadow_offset__       = ".1em .1em .1em rgb(153,153,153,.5)"

tpl.php

@@ -0,0 +1,100 @@
+<?php
+
+namespace dokuwiki\template\sprintdoc;
+
+/**
+ * Class tpl
+ *
+ * Provides additional template functions for the dokuwiki template
+ * @package dokuwiki\tpl\dokuwiki
+ */
+
+class tpl {
+  static $icons = array(
+              'default' => '00-default_checkbox-blank-circle-outline.svg',
+              'edit' => '01-edit_pencil.svg',
+              'create' => '02-create_pencil.svg',
+              'draft' => '03-draft_android-studio.svg',
+              'show' => '04-show_file-document.svg',
+              'source' => '05-source_file-xml.svg',
+              'revert' => '06-revert_replay.svg',
+              'revs' => '07-revisions_history.svg',
+              'backlink' => '08-backlink_link-variant.svg',
+              'subscribe' => '09-subscribe_email-outline.svg',
+              'top' => '10-top_arrow-up.svg',
+              'mediaManager' => '11-mediamanager_folder-image.svg',
+              'img_backto' => '12-back_arrow-left.svg',
+          );
+
+/**
+   * Return the HTML for one of the default actions
+   *
+   * Reimplements parts of tpl_actionlink
+   *
+   * @param string $action
+   * @return string
+   */
+  static public function pageToolAction($action) {
+              $data = tpl_get_action($action);
+              if(!is_array($data)) return '';
+      global $lang;
+
+      if($data['id'][0] == '#') {
+                      $linktarget = $data['id'];
+                  } else {
+                      $linktarget = wl($data['id'], $data['params'], false, '&');
+                  }
+      $caption = $lang['btn_' . $data['type']];
+      if(strpos($caption, '%s')) {
+                      $caption = sprintf($caption, $data['replacement']);
+                  }
+
+      $svg = __DIR__ . '/images/tools/' . self::$icons[$data['type']];
+
+      return self::pageToolItem(
+                      $linktarget,
+                      $caption,
+                      $svg,
+          array('accesskey' => $data['accesskey'])
+              );
+  }
+
+/**
+   * Return the HTML for a page action
+   *
+   * Plugins may use this in TEMPLATE_PAGETOOLS_DISPLAY
+   *
+   * @param string $link The link
+   * @param string $caption The label of the action
+   * @param string $svg The icon to show
+   * @param string[] $args HTML attributes for the item
+   * @return string
+   */
+  static public function pageToolItem($link, $caption, $svg, $args = array()) {
+              if(blank($args['title'])) {
+                      $args['title'] = $caption;
+                  }
+
+      if(!blank($args['accesskey'])) {
+                      $args['title'] .= ' [' . strtoupper($args['accesskey']) . ']';
+                  }
+
+      if(blank($args['rel'])) {
+                      $args['rel'] = 'nofollow';
+                  }
+
+      $args['href'] = $link;
+
+      $svg = inlineSVG($svg);
+      if(!$svg) $svg = inlineSVG(__DIR__ . '/images/tools/' . self::$icons['default']);
+
+      $attributes = buildAttributes($args, true);
+
+      $out = "<a $attributes>";
+      $out .= '<span>' . hsc($caption) . '</span>';
+      $out .= $svg;
+      $out .= '</a>';
+
+      return $out;
+  }
+}

tpl/main-sidebar-logo.php

@@ -1,13 +1,6 @@
 <?php
 if(!defined('DOKU_INC')) die();
 
-echo '<div class="menu-togglelink mobile-only">';
-echo '<a href="#">';
-echo inlineSVG(__DIR__ . '/../img/menu.svg');
-echo '<span class="sr-out">'.tpl_getLang('a11y_sidebartoggle').'</span>';
-echo '</a>';
-echo '</div>';
-
 echo '<div class="logo">';
 \dokuwiki\template\sprintdoc\Template::getInstance()->mainLogo();
 echo '<hr class="structure" />';

tpl/nav-meta-box.php

@@ -9,6 +9,9 @@ $tabs = \dokuwiki\template\sprintdoc\Template::getInstance()->getMetaBoxTabs();
         <li class="a11y">&nbsp;</li>
         <?php
         foreach($tabs as $tab) {
+            if (empty($tab['tab']) || trim($tab['tab']) === '') {
+                continue;
+            }
             echo '<li class="' . $tab['id'] . '">';
             echo '<a href="#' . $tab['id'] . '" aria-expanded="false">';
             echo '<span class="prefix">';
@@ -27,6 +30,9 @@ $tabs = \dokuwiki\template\sprintdoc\Template::getInstance()->getMetaBoxTabs();
         <div class="box-content">
             <?php
             foreach($tabs as $tab) {
+                if (empty($tab['tab']) || trim($tab['tab']) === '') {
+                    continue;
+                }
                 echo '<div id="' . $tab['id'] . '" class="tab-pane" aria-hidden="true">';
                 echo $tab['tab'];
                 echo '</div>';

tpl/nav-page-attributes.php

@@ -30,10 +30,10 @@ if($doPlugin !== null) {
         $title = $this->getLang('title_alldone');
     } elseif($count['late'] == 0) { // open tasks but none late
         $class = 'do_undone';
-        $title = sprintf($this->getLang('title_intime'), $count['undone']);
+        $title = sprintf(tpl_getLang('title_intime'), $count['undone']);
     } else { // late tasks
         $class = 'do_late';
-        $title = sprintf($this->getLang('title_late'), $count['undone'], $count['late']);
+        $title = sprintf(tpl_getLang('title_late'), $count['undone'], $count['late']);
     }
     $markup = "<li class=\"plugin__do_pagetasks " . $class . "\" title=\"'.$title.'\"><strong><span class=\"prefix\">" . tpl_getLang('prefix_tasks_page') . " </span><span class=\"num\">" . $num . "</span></strong></li>";
 

tpl/nav-page-tools.php

@@ -7,16 +7,87 @@
         <div class="tools">
 
         <?php include('nav-status.php');?>
-        <ul>
-            <?php tpl_toolsevent('pagetools', array(
-                'edit'      => tpl_action('edit', 1, 'li', 1),
-                'revisions' => tpl_action('revisions', 1, 'li', 1),
-                'backlink'  => tpl_action('backlink', 1, 'li', 1),
-                'subscribe' => tpl_action('subscribe', 1, 'li', 1),
-                'revert'    => tpl_action('revert', 1, 'li', 1),
-                'top'       => tpl_action('top', 1, 'li', 1),
-            )); ?>
-        </ul>
+            <ul>
+                <?php
+                $data = array(
+                    'view'  => 'main-svg',
+                    'items' => array(
+                            'edit'      => dokuwiki\template\sprintdoc\tpl::pageToolAction('edit'),
+                            'revert'    => dokuwiki\template\sprintdoc\tpl::pageToolAction('revert'),
+                            'revisions' => dokuwiki\template\sprintdoc\tpl::pageToolAction('revisions'),
+                            'backlink'  => dokuwiki\template\sprintdoc\tpl::pageToolAction('backlink'),
+                            'subscribe' => dokuwiki\template\sprintdoc\tpl::pageToolAction('subscribe'),
+                            'top'       => dokuwiki\template\sprintdoc\tpl::pageToolAction('top'),
+                         )
+                     );
+
+
+                foreach ($data['items'] as $k => $html) {
+                    if ($html) {
+                        echo "<li>$html</li>";
+                    }
+                }
+
+                /**
+                 * ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+                 * Begin shims as a temporary solution until the svg-approach is mainlined and the plugins have adapted
+                 * ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+                 */
+                global $ACT;
+                if (act_clean($ACT) === 'show') {
+                    /** @var action_plugin_move_rename $move */
+                    $move = plugin_load('action', 'move_rename');
+                    if ($move && $move->getConf('pagetools_integration')) {
+                        $attr = array(
+                            'style' => 'background-image: none;',
+                        );
+                        $item = \dokuwiki\template\sprintdoc\tpl::pageToolItem('', $move->getLang('renamepage'), __DIR__ . '/../images/tools/41-format-paint.svg', $attr);
+                        echo '<li class="plugin_move_page">' . $item . '</li>';
+                    }
+
+                    /** @var action_plugin_odt_export $odt */
+                    $odt = plugin_load('action', 'odt_export');
+                    if ($odt && $odt->getConf('showexportbutton')) {
+                        global $ID, $REV;
+                        $params = array('do' => 'export_odt');
+                        if ($REV) {
+                            $params['rev'] = $REV;
+                        }
+                        $attr = array(
+                            'class' => 'action export_pdf',
+                            'style' => 'background-image: none;',
+                        );
+                        $svg = __DIR__ . '/../images/tools/43-file-delimeted.svg';
+                        $item = \dokuwiki\template\sprintdoc\tpl::pageToolItem(wl($ID, $params, false, '&'), $odt->getLang('export_odt_button'), $svg, $attr);
+                        echo '<li>' . $item . '</li>';
+                    }
+
+                    /** @var action_plugin_dw2pdf $dw2pdf */
+                    $dw2pdf = plugin_load('action', 'dw2pdf');
+                    if ($dw2pdf && $dw2pdf->getConf('showexportbutton')) {
+                        global $ID, $REV;
+
+                        $params = array('do' => 'export_pdf');
+                        if ($REV) {
+                            $params['rev'] = $REV;
+                        }
+                        $attr = array(
+                            'class' => 'action export_pdf',
+                            'style' => 'background-image: none;',
+                        );
+                        $svg = __DIR__ . '/../images/tools/40-pdf-file.svg';
+                        $item = \dokuwiki\template\sprintdoc\tpl::pageToolItem(wl($ID, $params, false, '&'), $dw2pdf->getLang('export_pdf_button'), $svg, $attr);
+                        echo '<li>' . $item . '</li>';
+                    }
+                }
+                /**
+                 * ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+                 * End of shims
+                 * ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+                 */
+
+                ?>
+            </ul>
         </div>
     </nav>
 <?php endif; ?>

tpl/nav-usertools-buttons.php

@@ -3,52 +3,53 @@
 
     if ($conf['useacl'] && $showTools): ?>
 
-                            <nav id="dokuwiki__usertools" class="nav-usertools <?php echo $navClass?>">
-                                <h6 class="sr-only" role="heading" aria-level="2"><?php echo $lang['user_tools']; ?></h6>
-                                <ul>
-                                    <li class="log"><?php tpl_actionlink('login'); ?></li>
-                                    <?php
-                                    if (!empty($_SERVER['REMOTE_USER'])) {
-                                        echo '<li class="user"><span class="sr-only">'.$lang['loggedinas'].' </span>'.userlink().'</li>';
-                                    }?>
+        <nav id="dokuwiki__usertools" class="nav-usertools <?php echo $navClass?>">
+            <h6 class="sr-only" role="heading" aria-level="2"><?php echo $lang['user_tools']; ?></h6>
+            <ul>
+                <li class="log"><?php tpl_actionlink('login'); ?></li>
 
-                                    <?php /* tasks do Plug-In */
-                                    /** @var \helper_plugin_do $doplugin */
-                                    $doplugin = plugin_load('helper','do');
-                                    if ($doplugin !== null && isset($_SERVER['REMOTE_USER'])) {
-                                        $tasks = $doplugin->loadTasks(array('status' => array('undone'),'user'   => $_SERVER['REMOTE_USER']));
-                                        $num = count($tasks);
-                                        switch ($num) {
-                                            case 0: $class = 'noopentasks'; break;
-                                            case 1:  $class = 'opentask'; break;
-                                            default:
-                                                $class = 'opentask opentasks';
-                                                break;
-                                        }
-                                        $linktarget = tpl_getConf('tasks_page');
-                                        $doInner = "<span class=\"prefix\">".tpl_getLang('prefix_tasks_user')." </span><span class=\"num\">".count($tasks)."</span>";
-                                        if($linktarget){
-                                            if (substr($linktarget, 0, 1) !== ':') {
-                                                $linktarget = tpl_getConf('user_ns'). $_SERVER['REMOTE_USER'] .':' . $linktarget;
-                                            }
-                                            if($num == 0){
-                                                echo '<li class="user-task '.$class.'"><strong>'.$doInner.'</strong></li>';
-                                            }else{
-                                                echo '<li class="user-task '.$class.'"><a href="'.wl($linktarget).'">'.$doInner.'</a></li>';
-                                            }
-                                        }
-                                        else{
-                                            echo '<li class="user-task '.$class.'"><strong>'.$doInner.'</strong></li>';
-                                        }
-                                    } ?>
+                <?php
+                if (!empty($_SERVER['REMOTE_USER'])) {
+                    echo '<li class="user"><span class="sr-only">'.$lang['loggedinas'].' </span>'.userlink().'</li>';
+                }?>
 
-                                    <?php /* dokuwiki user tools */
-                                    tpl_toolsevent('usertools', array(
-                                        'admin'     => tpl_action('admin', 1, 'li', 1),
-                                        'register'  => tpl_action('register', 1, 'li', 1),
-                                    )); ?>
+                <?php /* dokuwiki user tools */
+                tpl_toolsevent('usertools', array(
+                    'admin'     => tpl_action('admin', 1, 'li', 1),
+                    'register'  => tpl_action('register', 1, 'li', 1),
+                )); ?>
 
-                                </ul>
-                            </nav><!-- #dokuwiki__usertools -->
+                <?php /* tasks do Plug-In */
+                /** @var \helper_plugin_do $doplugin */
+                $doplugin = plugin_load('helper','do');
+                if ($doplugin !== null && isset($_SERVER['REMOTE_USER'])) {
+                    $tasks = $doplugin->loadTasks(array('status' => array('undone'),'user'   => $_SERVER['REMOTE_USER']));
+                    $num = count($tasks);
+                    switch ($num) {
+                        case 0: $class = 'noopentasks'; break;
+                        case 1:  $class = 'opentask'; break;
+                        default:
+                            $class = 'opentask opentasks';
+                            break;
+                    }
+                    $linktarget = tpl_getConf('tasks_page');
+                    $doInner = "<span class=\"prefix\">".tpl_getLang('prefix_tasks_user')." </span><span class=\"num\">".count($tasks)."</span>";
+                    if($linktarget){
+                        if (substr($linktarget, 0, 1) !== ':') {
+                            $linktarget = tpl_getConf('user_ns'). $_SERVER['REMOTE_USER'] .':' . $linktarget;
+                        }
+                        if($num == 0){
+                            echo '<li class="user-task '.$class.'"><strong>'.$doInner.'</strong></li>';
+                        }else{
+                            echo '<li class="user-task '.$class.'"><a href="'.wl($linktarget).'">'.$doInner.'</a></li>';
+                        }
+                    }
+                    else{
+                        echo '<li class="user-task '.$class.'"><strong>'.$doInner.'</strong></li>';
+                    }
+                } ?>
+
+            </ul>
+        </nav><!-- #dokuwiki__usertools -->
     <?php endif ?>