Merge pull request #93 from splitbrain/frontend_improvements

Frontend improvements

28 files changed, 831 insertions, 815 deletions

diff --git a/lib/exe/css.php b/lib/exe/css.php
index 69b512205..1b2b0c86b 100644
--- a/lib/exe/css.php
+++ b/lib/exe/css.php
@@ -9,6 +9,7 @@
 if(!defined('DOKU_INC')) define('DOKU_INC',dirname(__FILE__).'/../../');
 if(!defined('NOSESSION')) define('NOSESSION',true); // we do not use a session or authentication here (better caching)
 if(!defined('DOKU_DISABLE_GZIP_OUTPUT')) define('DOKU_DISABLE_GZIP_OUTPUT',1); // we gzip ourself here
+if(!defined('NL')) define('NL',"\n");
 require_once(DOKU_INC.'inc/init.php');
 
 // Main (don't run when UNIT test)
@@ -30,10 +31,12 @@ function css_out(){
     global $lang;
     global $config_cascade;
 
-    $mediatype = 'screen';
-    if (isset($_REQUEST['s']) &&
-        in_array($_REQUEST['s'], array('all', 'print', 'feed'))) {
-        $mediatype = $_REQUEST['s'];
+    if (isset($_REQUEST['s']) && ($_REQUEST['s'] == 'feed')) {
+        $mediatypes = array('feed');
+        $type = 'feed';
+    } else {
+        $mediatypes = array('screen', 'all', 'print');
+        $type = '';
     }
 
     $tpl = trim(preg_replace('/[^\w-]+/','',$_REQUEST['t']));
@@ -46,7 +49,7 @@ function css_out(){
     }
 
     // The generated script depends on some dynamic options
-    $cache = new cache('styles'.$_SERVER['HTTP_HOST'].$_SERVER['SERVER_PORT'].DOKU_BASE.$tplinc.$mediatype,'.css');
+    $cache = new cache('styles'.$_SERVER['HTTP_HOST'].$_SERVER['SERVER_PORT'].DOKU_BASE.$tplinc.$type,'.css');
 
     // load template styles
     $tplstyles = array();
@@ -57,57 +60,79 @@ function css_out(){
         }
     }
 
-    // Array of needed files and their web locations, the latter ones
-    // are needed to fix relative paths in the stylesheets
-    $files   = array();
-    // load core styles
-    $files[DOKU_INC.'lib/styles/'.$mediatype.'.css'] = DOKU_BASE.'lib/styles/';
-    // load jQuery-UI theme
-    $files[DOKU_INC.'lib/scripts/jquery/jquery-ui-theme/smoothness.css'] = DOKU_BASE.'lib/scripts/jquery/jquery-ui-theme/';
-    // load plugin styles
-    $files = array_merge($files, css_pluginstyles($mediatype));
-    // load template styles
-    if (isset($tplstyles[$mediatype])) {
-        $files = array_merge($files, $tplstyles[$mediatype]);
-    }
-    // if old 'default' userstyle setting exists, make it 'screen' userstyle for backwards compatibility
-    if (isset($config_cascade['userstyle']['default'])) {
-        $config_cascade['userstyle']['screen'] = $config_cascade['userstyle']['default'];
-    }
-    // load user styles
-    if(isset($config_cascade['userstyle'][$mediatype])){
-        $files[$config_cascade['userstyle'][$mediatype]] = DOKU_BASE;
-    }
-    // load rtl styles
-    // @todo: this currently adds the rtl styles only to the 'screen' media type
-    //        but 'print' and 'all' should also be supported
-    if ($mediatype=='screen') {
-        if($lang['direction'] == 'rtl'){
-            if (isset($tplstyles['rtl'])) $files = array_merge($files, $tplstyles['rtl']);
+    // start output buffering
+    ob_start();
+
+    foreach($mediatypes as $mediatype) {
+        // Array of needed files and their web locations, the latter ones
+        // are needed to fix relative paths in the stylesheets
+        $files   = array();
+        // load core styles
+        $files[DOKU_INC.'lib/styles/'.$mediatype.'.css'] = DOKU_BASE.'lib/styles/';
+        // load jQuery-UI theme
+        if ($mediatype == 'screen') {
+            $files[DOKU_INC.'lib/scripts/jquery/jquery-ui-theme/smoothness.css'] = DOKU_BASE.'lib/scripts/jquery/jquery-ui-theme/';
+        }
+        // load plugin styles
+        $files = array_merge($files, css_pluginstyles($mediatype));
+        // load template styles
+        if (isset($tplstyles[$mediatype])) {
+            $files = array_merge($files, $tplstyles[$mediatype]);
+        }
+        // if old 'default' userstyle setting exists, make it 'screen' userstyle for backwards compatibility
+        if (isset($config_cascade['userstyle']['default'])) {
+            $config_cascade['userstyle']['screen'] = $config_cascade['userstyle']['default'];
+        }
+        // load user styles
+        if(isset($config_cascade['userstyle'][$mediatype])){
+            $files[$config_cascade['userstyle'][$mediatype]] = DOKU_BASE;
+        }
+        // load rtl styles
+        // note: this adds the rtl styles only to the 'screen' media type
+        // @deprecated 2012-04-09: rtl will cease to be a mode of its own,
+        //     please use "[dir=rtl]" in any css file in all, screen or print mode instead
+        if ($mediatype=='screen') {
+            if($lang['direction'] == 'rtl'){
+                if (isset($tplstyles['rtl'])) $files = array_merge($files, $tplstyles['rtl']);
+            }
         }
-    }
 
-    $cache_files = array_merge(array_keys($files), getConfigFiles('main'));
-    $cache_files[] = $tplinc.'style.ini';
-    $cache_files[] = __FILE__;
+        $cache_files = array_merge(array_keys($files), getConfigFiles('main'));
+        $cache_files[] = $tplinc.'style.ini';
+        $cache_files[] = __FILE__;
 
-    // check cache age & handle conditional request
-    // This may exit if a cache can be used
-    http_cached($cache->cache,
-                $cache->useCache(array('files' => $cache_files)));
+        // check cache age & handle conditional request
+        // This may exit if a cache can be used
+        http_cached($cache->cache,
+                    $cache->useCache(array('files' => $cache_files)));
 
-    // start output buffering and build the stylesheet
-    ob_start();
+        // build the stylesheet
 
-    // print the default classes for interwiki links and file downloads
-    css_interwiki();
-    css_filetypes();
+        // print the default classes for interwiki links and file downloads
+        if ($mediatype == 'screen') {
+            css_interwiki();
+            css_filetypes();
+        }
 
-    // load files
-    foreach($files as $file => $location){
-        print css_loadfile($file, $location);
+        // load files
+        $css_content = '';
+        foreach($files as $file => $location){
+            $css_content .= css_loadfile($file, $location);
+        }
+        switch ($mediatype) {
+            case 'screen':
+                print NL.'@media screen { /* START screen styles */'.NL.$css_content.NL.'} /* /@media END screen styles */'.NL;
+                break;
+            case 'print':
+                print NL.'@media print { /* START print styles */'.NL.$css_content.NL.'} /* /@media END print styles */'.NL;
+                break;
+            case 'all':
+            case 'feed':
+            default:
+                print NL.'/* START rest styles */ '.NL.$css_content.NL.'/* END rest styles */'.NL;
+                break;
+        }
     }
-
     // end output buffering and get contents
     $css = ob_get_contents();
     ob_end_clean();
@@ -275,6 +300,8 @@ function css_pluginstyles($mediatype='screen'){
         if ($mediatype=='screen') {
             $list[DOKU_PLUGIN."$p/style.css"]  = DOKU_BASE."lib/plugins/$p/";
         }
+        // @deprecated 2012-04-09: rtl will cease to be a mode of its own,
+        //     please use "[dir=rtl]" in any css file in all, screen or print mode instead
         if($lang['direction'] == 'rtl'){
             $list[DOKU_PLUGIN."$p/rtl.css"] = DOKU_BASE."lib/plugins/$p/";
         }
diff --git a/lib/scripts/page.js b/lib/scripts/page.js
index 5da4a9cc0..78943be7a 100644
--- a/lib/scripts/page.js
+++ b/lib/scripts/page.js
@@ -10,7 +10,7 @@ dw_page = {
     init: function(){
         dw_page.sectionHighlight();
         jQuery('a.fn_top').mouseover(dw_page.footnoteDisplay);
-        dw_page.initTocToggle();
+        dw_page.makeToggle('#dw__toc h3','#dw__toc > div');
     },
 
     /**
@@ -93,48 +93,76 @@ dw_page = {
     },
 
     /**
-     * Adds the toggle switch to the TOC
+     * Makes an element foldable by clicking its handle
+     *
+     * This is used for the TOC toggling, but can be used for other elements
+     * as well. A state indicator is inserted into the handle and can be styled
+     * by CSS.
+     *
+     * @param selector handle What should be clicked to toggle
+     * @param selector content This element will be toggled
      */
-    initTocToggle: function() {
-        var $header, $clicky, $toc, $tocul, setClicky;
-        $header = jQuery('#toc__header');
-        if(!$header.length) {
-            return;
-        }
-        $toc = jQuery('#toc__inside');
-        $tocul = $toc.children('ul.toc');
+    makeToggle: function(handle, content, state){
+        var $handle, $content, $clicky, $child, setClicky;
+        $handle = jQuery(handle);
+        if(!$handle.length) return;
+        $content = jQuery(content);
+        if(!$content.length) return;
+
+        // we animate the children
+        $child = $content.children();
 
+        // class/display toggling
         setClicky = function(hiding){
             if(hiding){
                 $clicky.html('<span>+</span>');
-                $clicky[0].className = 'toc_open';
+                $handle.addClass('closed');
+                $handle.removeClass('open');
             }else{
                 $clicky.html('<span>&minus;</span>');
-                $clicky[0].className = 'toc_close';
+                $handle.addClass('open');
+                $handle.removeClass('closed');
             }
         };
 
-        $clicky = jQuery(document.createElement('span'))
-                        .attr('id','toc__toggle');
-        $header.css('cursor','pointer')
-               .click(function () {
-                    var hidden;
+        $handle[0].setState = function(state){
+            var hidden;
+            if(!state) state = 1;
+
+            // Assert that content instantly takes the whole space
+            $content.css('height', $content.height()).show();
 
-                    // Assert that $toc instantly takes the whole TOC space
-                    $toc.css('height', $toc.height()).show();
+            // stop any running animation
+            $child.stop(true, true);
 
-                    hidden = $tocul.stop(true, true).is(':hidden');
+            // was a state given or do we toggle?
+            if(state === -1) {
+                hidden = false;
+            } else if(state === 1) {
+                hidden = true;
+            } else {
+                hidden = $child.is(':hidden');
+            }
+
+            // update the state
+            setClicky(!hidden);
+
+            // Start animation and assure that $toc is hidden/visible
+            $child.dw_toggle(hidden, function () {
+                $content.toggle(hidden);
+            });
+        };
 
-                    setClicky(!hidden);
+        // the state indicator
+        $clicky = jQuery(document.createElement('strong'));
 
-                    // Start animation and assure that $toc is hidden/visible
-                    $tocul.dw_toggle(hidden, function () {
-                        $toc.toggle(hidden);
-                    });
-                })
+        // click function
+        $handle.css('cursor','pointer')
+               .click($handle[0].setState)
                .prepend($clicky);
 
-        setClicky();
+        // initial state
+        $handle[0].setState(state);
     }
 };
 
diff --git a/lib/tpl/default/_mediamanager.css b/lib/tpl/default/_mediamanager.css
index 68fa2e97f..8c605f69a 100644
--- a/lib/tpl/default/_mediamanager.css
+++ b/lib/tpl/default/_mediamanager.css
@@ -343,18 +343,18 @@
 
 /*____________ Revisions form ____________*/
 
-#mediamanager__page #page__revisions ul {
+#mediamanager__page form.changes ul {
     margin-left: 10px;
     list-style-type: none;
 }
 
-#mediamanager__page #page__revisions ul li div.li div {
+#mediamanager__page form.changes ul li div.li div {
     font-size: 90%;
     color: __text_neu__;
     padding-left: 18px;
 }
 
-#mediamanager__page #page__revisions ul li div.li input {
+#mediamanager__page form.changes ul li div.li input {
     position: relative;
     top: 1px;
 }
diff --git a/lib/tpl/default/design.css b/lib/tpl/default/design.css
index a94f814aa..3405ec258 100644
--- a/lib/tpl/default/design.css
+++ b/lib/tpl/default/design.css
@@ -265,11 +265,6 @@ div.dokuwiki a:active {
   text-decoration: underline;
 }
 
-div.dokuwiki h1 a,
-div.dokuwiki h2 a,
-div.dokuwiki h3 a,
-div.dokuwiki h4 a,
-div.dokuwiki h5 a,
 div.dokuwiki a.nolink {
   color: __text__ !important;
   text-decoration: none !important;
@@ -383,11 +378,11 @@ div.dokuwiki img.mediacenter {
 }
 
 /* smileys */
-div.dokuwiki img.middle {
+div.dokuwiki img.icon {
   vertical-align: middle;
 }
 
-div.dokuwiki acronym {
+div.dokuwiki abbr {
   cursor: help;
   border-bottom: 1px dotted __text__;
 }
@@ -552,7 +547,7 @@ div.dokuwiki table.inline td {
 
 /* ---------- table of contents ------------------- */
 
-div.dokuwiki div.toc {
+div.dokuwiki #dw__toc {
   margin: 1.2em 0 0 2em;
   float: right;
   width: 200px;
@@ -560,46 +555,45 @@ div.dokuwiki div.toc {
   clear: both;
 }
 
-div.dokuwiki div.tocheader {
+div.dokuwiki #dw__toc h3 {
   border: 1px solid __border__;
   background-color: __background_alt__;
   text-align: left;
   font-weight: bold;
   padding: 3px;
-  margin-bottom: 2px;
+  margin: 0 0 2px 0;
+  font-size: 1em;
 }
 
-div.dokuwiki span.toc_open,
-div.dokuwiki span.toc_close {
+div.dokuwiki .toggle strong {
     border: 0.4em solid __background_alt__;
     float: right;
     display: block;
     margin: 0.4em 3px 0 0;
 }
 
-div.dokuwiki span.toc_open span,
-div.dokuwiki span.toc_close span {
+div.dokuwiki .toggle span {
     display: none;
 }
 
-div.dokuwiki span.toc_open {
+div.dokuwiki .toggle.closed strong {
     margin-top: 0.4em;
     border-top: 0.4em solid __text__;
 }
 
-div.dokuwiki span.toc_close {
+div.dokuwiki .toggle.open strong {
     margin-top: 0;
     border-bottom: 0.4em solid __text__;
 }
 
-div.dokuwiki #toc__inside {
+div.dokuwiki #dw__toc > div {
   border: 1px solid __border__;
   background-color: __background__;
   text-align: left;
   padding: 0.5em 0 0.7em 0;
 }
 
-div.dokuwiki ul.toc {
+div.dokuwiki #dw__toc ul {
   list-style-type: none;
   list-style-image: none;
   line-height: 1.2em;
@@ -607,23 +601,23 @@ div.dokuwiki ul.toc {
   margin: 0;
 }
 
-div.dokuwiki ul.toc li {
+div.dokuwiki #dw__toc ul li {
   background: transparent url(images/tocdot2.gif) 0 0.6em no-repeat;
   padding-left: 0.4em;
 }
 
-div.dokuwiki ul.toc li.clear {
+div.dokuwiki #dw__toc ul li.clear {
   background-image: none;
   padding-left: 0.4em;
 }
 
-div.dokuwiki a.toc:link,
-div.dokuwiki a.toc:visited {
+div.dokuwiki #dw__toc a:link,
+div.dokuwiki #dw__toc a:visited {
   color: __extern__;
 }
 
-div.dokuwiki a.toc:hover,
-div.dokuwiki a.toc:active {
+div.dokuwiki #dw__toc a:hover,
+div.dokuwiki #dw__toc a:active {
   color: __text__;
 }
 
@@ -712,12 +706,20 @@ div.insitu-footnote {
 }
 
 /* --------------- search result formating --------------- */
-div.dokuwiki .search_result {
-  margin-bottom: 6px;
+#dw__loading {
+    text-align: center;
+    margin-bottom: 1em;
+}
+
+div.dokuwiki .search_results {
   padding: 0 10px 0 30px;
 }
 
-div.dokuwiki .search_snippet {
+div.dokuwiki .search_results dt {
+  margin-bottom: 3px;
+}
+div.dokuwiki .search_results dd {
+  margin-bottom: 6px;
   color: __text_other__;
   font-size: 12px;
   margin-left: 20px;
diff --git a/lib/tpl/default/print.css b/lib/tpl/default/print.css
index 45b60aad2..f83e8c97c 100644
--- a/lib/tpl/default/print.css
+++ b/lib/tpl/default/print.css
@@ -200,7 +200,7 @@ a.fn_bot {
   font-weight: bold;
 }
 
-acronym {
+abbr {
   border: 0;
 }
 
@@ -224,5 +224,5 @@ table.inline td {
   border: 1px solid #000000;
 }
 
-.toc, .footerinc, .header, .bar, .user { display: none; }
+#dw__toc, .footerinc, .header, .bar, .user { display: none; }
 
diff --git a/lib/tpl/default/rtl.css b/lib/tpl/default/rtl.css
index 82c85839b..8b2837874 100644
--- a/lib/tpl/default/rtl.css
+++ b/lib/tpl/default/rtl.css
@@ -89,30 +89,36 @@ div.dokuwiki div.level4 { margin-left: 0px; margin-right: 63px; }
 div.dokuwiki div.level5 { margin-left: 0px; margin-right: 83px; }
 
 /* TOC control */
-div.dokuwiki div.toc {
+div.dokuwiki #dw__toc {
   float: left;
+  margin: 1.2em 2em 0 0;
 }
 
-div.dokuwiki div.tocheader {
+div.dokuwiki #dw__toc h3 {
   text-align: right;
 }
 
-div.dokuwiki #toc__inside {
+div.dokuwiki .toggle strong {
+    float: left;
+    margin: 0.4em 0 0 3px;
+}
+
+div.dokuwiki #dw__toc > div {
   text-align: right;
 }
 
-div.dokuwiki ul.toc {
+div.dokuwiki #dw__toc ul {
   padding: 0;
   padding-right: 1em;
 }
 
-div.dokuwiki ul.toc li {
+div.dokuwiki #dw__toc ul li {
   background-position: right 0.6em;
   padding-right: 0.4em;
   direction: rtl;
 }
 
-div.dokuwiki ul.toc li.clear {
+div.dokuwiki #dw__toc ul li.clear {
   padding-right: 0.4em;
 }
 
diff --git a/lib/tpl/dokuwiki/css/_admin.css b/lib/tpl/dokuwiki/css/_admin.css
index e4664367c..c8f3694b5 100644
--- a/lib/tpl/dokuwiki/css/_admin.css
+++ b/lib/tpl/dokuwiki/css/_admin.css
@@ -9,6 +9,9 @@
     list-style-type: none;
     font-size: 1.125em;
 }
+[dir=rtl] .dokuwiki ul.admin_tasks {
+    float: right;
+}
 
 .dokuwiki ul.admin_tasks li {
     padding-left: 35px;
@@ -18,6 +21,11 @@
     background: transparent none no-repeat scroll 0 0;
     color: inherit;
 }
+[dir=rtl] .dokuwiki ul.admin_tasks li {
+    padding-left: 0;
+    padding-right: 35px;
+    background-position: right 0;
+}
 
 .dokuwiki ul.admin_tasks li.admin_acl {
     background-image: url(../../images/admin/acl.png);
@@ -45,3 +53,7 @@
     color: __text_neu__;
     background-color: inherit;
 }
+[dir=rtl] .dokuwiki #admin__version {
+    clear: right;
+    float: left;
+}
diff --git a/lib/tpl/dokuwiki/css/_edit.css b/lib/tpl/dokuwiki/css/_edit.css
index 5a3952c90..374ddeb96 100644
--- a/lib/tpl/dokuwiki/css/_edit.css
+++ b/lib/tpl/dokuwiki/css/_edit.css
@@ -6,18 +6,24 @@
 /* edit view
 ********************************************************************/
 
+.dokuwiki div.editBox {
+}
+
 /*____________ toolbar ____________*/
 
 .dokuwiki div.toolbar {
     margin-bottom: .5em;
     overflow: hidden;
 }
-.dokuwiki div.toolbar #draft__status {
+#draft__status {
     float: right;
     color: __text_alt__;
     background-color: inherit;
 }
-.dokuwiki div.toolbar #tool__bar {
+[dir=rtl] #draft__status {
+    float: left;
+}
+#tool__bar {
     float: left;
 }
 
@@ -55,42 +61,49 @@ div.picker button.toolbutton {
 
 /*____________ below the textarea ____________*/
 
-.dokuwiki #wiki__editbar {
+.dokuwiki div.editBar {
     overflow: hidden;
     margin-bottom: .5em;
 }
 
 /* size and wrap controls */
-.dokuwiki #wiki__editbar #size__ctl {
+#size__ctl {
     float: right;
 }
-.dokuwiki #wiki__editbar #size__ctl img {
+[dir=rtl] #size__ctl {
+    float: left;
+}
+#size__ctl img {
     cursor: pointer;
 }
 
 /* edit buttons */
-.dokuwiki #wiki__editbar .editButtons {
+.dokuwiki .editBar .editButtons {
     display: inline;
     margin-right: 1em;
 }
-.dokuwiki #wiki__editbar .editButtons input {
+[dir=rtl] .dokuwiki .editBar .editButtons {
+    margin-right: 0;
+    margin-left: 1em;
+}
+.dokuwiki .editBar .editButtons input {
 }
 
 /* summary input and minor changes checkbox */
-.dokuwiki #wiki__editbar .summary {
+.dokuwiki .editBar .summary {
     display: inline;
 }
-.dokuwiki #wiki__editbar .summary label {
+.dokuwiki .editBar .summary label {
     vertical-align: middle;
     white-space: nowrap;
 }
-.dokuwiki #wiki__editbar .summary label span {
+.dokuwiki .editBar .summary label span {
     vertical-align: middle;
 }
-.dokuwiki #wiki__editbar .summary input {
+.dokuwiki .editBar .summary input {
 }
 /* change background colour if summary is missing */
-.dokuwiki #wiki__editbar .summary input.missing {
+.dokuwiki .editBar .summary input.missing {
     color: __text__;
     background-color: #ffcccc;
 }
@@ -112,6 +125,9 @@ div.picker button.toolbutton {
     float: right;
     margin-top: -1.4em;
 }
+[dir=rtl] .dokuwiki .secedit {
+    float: left;
+}
 .dokuwiki .secedit input.button {
     font-size: 75%;
 }
diff --git a/lib/tpl/dokuwiki/css/_forms.css b/lib/tpl/dokuwiki/css/_forms.css
index 0c82f5f8c..fb07e989a 100644
--- a/lib/tpl/dokuwiki/css/_forms.css
+++ b/lib/tpl/dokuwiki/css/_forms.css
@@ -23,12 +23,18 @@
   text-align: right;
   font-weight: bold;
 }
+[dir=rtl] .dokuwiki label.block {
+    text-align: left;
+}
 
 .dokuwiki label.simple {
   display: block;
   text-align: left;
   font-weight: normal;
 }
+[dir=rtl] .dokuwiki label.simple {
+    text-align: right;
+}
 
 .dokuwiki label.block input.edit {
   width: 50%;
@@ -75,6 +81,9 @@
     text-align: left;
     margin: 0.5em 0;
 }
+[dir=rtl] #subscribe__form fieldset {
+    text-align: right;
+}
 
 #subscribe__form label {
     display: block;
diff --git a/lib/tpl/dokuwiki/css/_imgdetail.css b/lib/tpl/dokuwiki/css/_imgdetail.css
index a3e0f55f5..a07400028 100644
--- a/lib/tpl/dokuwiki/css/_imgdetail.css
+++ b/lib/tpl/dokuwiki/css/_imgdetail.css
@@ -12,9 +12,17 @@
     float: left;
     margin: 0 1.5em .5em 0;
 }
+[dir=rtl] #dokuwiki__detail div.content img {
+    float: right;
+    margin-right: 0;
+    margin-left: 1.5em;
+}
 #dokuwiki__detail div.img_detail {
     float: left;
 }
+[dir=rtl] #dokuwiki__detail div.content div.img_detail {
+    float: right
+}
 
 #dokuwiki__detail div.img_detail h2 {
 }
diff --git a/lib/tpl/dokuwiki/css/_links.css b/lib/tpl/dokuwiki/css/_links.css
index 58b611635..c8f5b7c9e 100644
--- a/lib/tpl/dokuwiki/css/_links.css
+++ b/lib/tpl/dokuwiki/css/_links.css
@@ -63,3 +63,13 @@
 .dokuwiki a.interwiki {
     padding: 0 0 0 17px;
 }
+
+/* RTL corrections; if link icons don't work as expected, remove the following lines */
+[dir=rtl] .dokuwiki a.urlextern,
+[dir=rtl] .dokuwiki a.windows,
+[dir=rtl] .dokuwiki a.mail,
+[dir=rtl] .dokuwiki a.interwiki,
+[dir=rtl] .dokuwiki a.mediafile {
+    background-position: right center;
+    padding: 0 17px 0 0;
+}
diff --git a/lib/tpl/dokuwiki/css/_media_popup.css b/lib/tpl/dokuwiki/css/_media_popup.css
index 0469c8e60..c776e6b8a 100644
--- a/lib/tpl/dokuwiki/css/_media_popup.css
+++ b/lib/tpl/dokuwiki/css/_media_popup.css
@@ -22,6 +22,12 @@ html.popup {
     left: 0;
     border-right: 1px solid __border__;
 }
+[dir=rtl] #mediamgr__aside {
+    left: auto;
+    right: 0;
+    border-right-width: 0;
+    border-left: 1px solid __border__;
+}
 #mediamgr__aside .pad {
     padding: .5em;
 }
@@ -33,6 +39,10 @@ html.popup {
     position: absolute;
     right: 0;
 }
+[dir=rtl] #mediamgr__content {
+    right: auto;
+    left: 0;
+}
 #mediamgr__content .pad {
     padding: .5em;
 }
@@ -57,6 +67,10 @@ html.popup {
 #media__opts input {
     margin-right: .3em;
 }
+[dir=rtl] #media__opts input {
+    margin-right: 0;
+    margin-left: .3em;
+}
 #media__opts label {
 }
 
@@ -65,22 +79,38 @@ html.popup {
 #media__tree ul {
     padding-left: .2em;
 }
+[dir=rtl] #media__tree ul {
+    padding-left: 0;
+    padding-right: .2em;
+}
 #media__tree ul li {
     clear: left;
     list-style-type: none;
     list-style-image: none;
     margin-left: 0;
 }
+[dir=rtl] #media__tree ul li {
+    clear: right;
+    margin-right: 0;
+}
 #media__tree ul li img {
     float: left;
     padding: .5em .3em 0 0;
 }
+[dir=rtl] #media__tree ul li img {
+    float: right;
+    padding: .5em 0 0 .3em;
+}
 #media__tree ul li div.li {
     display: inline;
 }
 #media__tree ul li li {
     margin-left: 1.5em;
 }
+[dir=rtl] #media__tree ul li li {
+    margin-left: 0;
+    margin-right: 1.5em;
+}
 
 /* right side
 ********************************************************************/
@@ -125,6 +155,10 @@ html.popup {
     margin-right: 1.5em;
     font-weight: bold;
 }
+[dir=rtl] #media__content a.mediafile {
+    margin-right: 0;
+    margin-left: 1.5em;
+}
 #media__content span.info {
 }
 #media__content img.btn {
@@ -144,6 +178,10 @@ html.popup {
     float: left;
     margin: 0 .5em 0 18px;
 }
+[dir=rtl] #media__content div.detail div.thumb {
+    float: right;
+    margin: 0 18px 0 .5em;
+}
 #media__content div.detail div.thumb a {
     display: block;
     cursor: pointer;
@@ -155,17 +193,17 @@ html.popup {
 
 /*____________ media search ____________*/
 
-form#dw__mediasearch {
+#dw__mediasearch {
 }
-form#dw__mediasearch p {
+#dw__mediasearch p {
 }
-form#dw__mediasearch label {
+#dw__mediasearch label {
 }
-form#dw__mediasearch label span {
+#dw__mediasearch label span {
 }
-form#dw__mediasearch input.edit {
+#dw__mediasearch input.edit {
 }
-form#dw__mediasearch input.button {
+#dw__mediasearch input.button {
 }
 
 
@@ -180,6 +218,9 @@ form#dw__mediasearch input.button {
     margin-bottom: .5em;
     overflow: hidden;
 }
+[dir=rtl] #media__content form.meta div.metafield {
+    clear: right;
+}
 
 #media__content form.meta label {
     display: block;
@@ -188,11 +229,18 @@ form#dw__mediasearch input.button {
     font-weight: bold;
     clear: left;
 }
+[dir=rtl] #media__content form.meta label {
+    float: right;
+    clear: right;
+}
 #media__content form.meta .edit {
     float: left;
     width: 70%;
     margin: 0;
 }
+[dir=rtl] #media__content form.meta .edit {
+    float: right;
+}
 #media__content form.meta textarea.edit {
     /* needed because of IE8 hack in _edit.css for textarea.edit: */
     max-width: 70%;
@@ -203,3 +251,7 @@ form#dw__mediasearch input.button {
     clear: left;
     margin: .2em 0 0 25%;
 }
+[dir=rtl] #media__content form.meta div.buttons {
+    clear: right;
+    margin: .2em 25% 0 0;
+}
diff --git a/lib/tpl/dokuwiki/css/_modal.css b/lib/tpl/dokuwiki/css/_modal.css
index 125f702a8..a3d3be194 100644
--- a/lib/tpl/dokuwiki/css/_modal.css
+++ b/lib/tpl/dokuwiki/css/_modal.css
@@ -13,6 +13,10 @@
 #link__wiz {
 }
 
+[dir=rtl] #link__wiz_close {
+    float: left;
+}
+
 #link__wiz_result {
     background-color: __background__;
     width:  293px;
@@ -23,6 +27,9 @@
     text-align: left;
     line-height: 1;
 }
+[dir=rtl] #link__wiz_result {
+    text-align: right;
+}
 
 #link__wiz_result div {
     padding: 3px 3px 3px 0;
@@ -34,6 +41,10 @@
     min-height: 16px;
     background: transparent 3px center no-repeat;
 }
+[dir=rtl] #link__wiz_result div a {
+    padding: 3px 22px 3px 3px;
+    background-position: 257px 3px;
+}
 
 #link__wiz_result div.type_u a {
     background-image: url(../../images/up.png);
diff --git a/lib/tpl/dokuwiki/css/_recent.css b/lib/tpl/dokuwiki/css/_recent.css
index 68f0e5826..d73bb9463 100644
--- a/lib/tpl/dokuwiki/css/_recent.css
+++ b/lib/tpl/dokuwiki/css/_recent.css
@@ -5,54 +5,44 @@
 
 /*____________ list of revisions / recent changes ____________*/
 
-/* select type of revisions (media/pages), should have a class on it's own, but hasn't */
-.dokuwiki #dw__recent label {
+/* select type of revisions (media/pages) */
+.dokuwiki .changeType {
     margin-bottom: .5em;
-    display: block;
 }
 
-.dokuwiki #dw__recent ul li,
-.dokuwiki #page__revisions ul li {
+.dokuwiki form.changes ul li {
     list-style: none;
     margin-left: 0;
 }
-.dokuwiki #dw__recent ul li span,
-.dokuwiki #dw__recent ul li a,
-.dokuwiki #page__revisions ul li span,
-.dokuwiki #page__revisions ul li a {
+[dir=rtl] .dokuwiki form.changes ul li {
+    margin-right: 0;
+}
+.dokuwiki form.changes ul li span,
+.dokuwiki form.changes ul li a {
     vertical-align: middle;
 }
-.dokuwiki #dw__recent ul li span.user a,
-.dokuwiki #page__revisions ul li span.user a {
+.dokuwiki form.changes ul li span.user a {
     vertical-align: bottom;
 }
-.dokuwiki #dw__recent ul li.minor,
-.dokuwiki #page__revisions ul li.minor {
+.dokuwiki form.changes ul li.minor {
     opacity: .7;
 }
 
-.dokuwiki #dw__recent li span.date,
-.dokuwiki #page__revisions li span.date {
+.dokuwiki form.changes li span.date {
 }
-.dokuwiki #dw__recent li a.diff_link,
-.dokuwiki #page__revisions li a.diff_link {
+.dokuwiki form.changes li a.diff_link {
     vertical-align: baseline;
 }
-.dokuwiki #dw__recent li a.revisions_link,
-.dokuwiki #page__revisions li a.revisions_link {
+.dokuwiki form.changes li a.revisions_link {
     vertical-align: baseline;
 }
-.dokuwiki #dw__recent li a.wikilink1,
-.dokuwiki #dw__recent li a.wikilink2,
-.dokuwiki #page__revisions li a.wikilink1,
-.dokuwiki #page__revisions li a.wikilink2 {
+.dokuwiki form.changes li a.wikilink1,
+.dokuwiki form.changes li a.wikilink2 {
 }
-.dokuwiki #dw__recent li span.sum,
-.dokuwiki #page__revisions li span.sum {
+.dokuwiki form.changes li span.sum {
     font-weight: bold;
 }
-.dokuwiki #dw__recent li span.user,
-.dokuwiki #page__revisions li span.user {
+.dokuwiki form.changes li span.user {
 }
 
 
diff --git a/lib/tpl/dokuwiki/css/_search.css b/lib/tpl/dokuwiki/css/_search.css
index c124c1e86..0090308c9 100644
--- a/lib/tpl/dokuwiki/css/_search.css
+++ b/lib/tpl/dokuwiki/css/_search.css
@@ -8,6 +8,8 @@
 
 /* loading gif */
 #dw__loading {
+    text-align: center;
+    margin-bottom: 1.4em;
 }
 
 /*____________ matching pagenames ____________*/
@@ -25,17 +27,26 @@
     width: 12em;
     margin: 0 1.5em;
 }
+[dir=rtl] .dokuwiki div.search_quickresult ul li {
+    float: right;
+}
 
 /*____________ search results ____________*/
 
-/* container for one search result */
-.dokuwiki div.search_result {
-    margin-bottom: 1.4em;
+.dokuwiki dl.search_results {
+    margin-bottom: 1.2em;
+}
+
+/* search heading */
+.dokuwiki dl.search_results dt {
+    font-weight: normal;
+    margin-bottom: .2em;
 }
 /* search snippet */
-.dokuwiki div.search_result div.search_snippet {
+.dokuwiki dl.search_results dd {
     color: __text_alt__;
     background-color: inherit;
+    margin: 0 0 1.2em 0;
 }
 
 /* search hit in normal text */
@@ -44,11 +55,11 @@
     background-color: __highlight__;
 }
 /* search hit in search results */
-.dokuwiki div.search_result strong.search_hit {
+.dokuwiki .search_results strong.search_hit {
     font-weight: normal;
 }
 /* ellipsis separating snippets */
-.dokuwiki div.search_result .search_sep {
+.dokuwiki .search_results .search_sep {
     color: __text__;
     background-color: inherit;
 }
@@ -78,6 +89,11 @@
     text-align: left;
     display: none;
 }
+[dir=rtl] .dokuwiki form.search div.ajax_qsearch {
+    left: auto;
+    right: -13.5em;
+    text-align: right;
+}
 .dokuwiki form.search div.ajax_qsearch strong {
     display: block;
     margin-bottom: .3em;
diff --git a/lib/tpl/dokuwiki/css/_toc.css b/lib/tpl/dokuwiki/css/_toc.css
index b78817523..0d1b976d1 100644
--- a/lib/tpl/dokuwiki/css/_toc.css
+++ b/lib/tpl/dokuwiki/css/_toc.css
@@ -7,56 +7,66 @@
 ********************************************************************/
 
 /* toc container */
-.dokuwiki div.toc {
+#dw__toc {
     float: right;
     margin: 0 0 1.4em 1.4em;
     width: 12em;
     background-color: __background_alt__;
     color: inherit;
 }
+[dir=rtl] #dw__toc {
+    float: left;
+    margin: 0 1.4em 1.4em 0;
+}
 
 /*____________ toc header ____________*/
 
-.dokuwiki div.tocheader {
+.dokuwiki h3.toggle {
     padding: .2em .5em;
     font-weight: bold;
 }
 
-.dokuwiki .toc span.toc_open,
-.dokuwiki .toc span.toc_close {
+.dokuwiki .toggle strong {
     float: right;
     margin: 0 .2em;
 }
+[dir=rtl] .dokuwiki .toggle strong {
+    float: left;
+}
 
 /*____________ toc list ____________*/
 
-.dokuwiki #toc__inside {
+#dw__toc > div {
     padding: .2em .5em;
 }
-.dokuwiki #toc__inside ul {
+#dw__toc ul {
     padding: 0;
     margin: 0;
 }
-.dokuwiki #toc__inside ul li {
+#dw__toc ul li {
     list-style: none;
     padding: 0;
     margin: 0;
     line-height: 1.1;
 }
-.dokuwiki #toc__inside ul li div.li {
+#dw__toc ul li div.li {
     padding: .15em 0;
 }
-.dokuwiki #toc__inside ul ul {
+#dw__toc ul ul {
     padding-left: 1em;
 }
-.dokuwiki #toc__inside ul ul li {
+[dir=rtl] #dw__toc ul ul {
+    padding-left: 0;
+    padding-right: 1em;
+}
+#dw__toc ul ul li {
 }
-.dokuwiki #toc__inside ul li a {
+#dw__toc ul li a {
 }
 
 /* in case of toc list jumping one level
   (e.g. if heading level 3 follows directly after heading level 1) */
-.dokuwiki #toc__inside ul li.clear {
+#dw__toc ul li.clear {
 }
 
 
@@ -66,6 +76,9 @@
 .dokuwiki ul.idx {
     padding-left: 0;
 }
+[dir=rtl] .dokuwiki ul.idx {
+    padding-right: 0;
+}
 .dokuwiki ul.idx li {
     list-style-image: url(images/bullet.png);
 }
@@ -75,3 +88,6 @@
 .dokuwiki ul.idx li.closed {
     list-style-image: url(images/closed.png);
 }
+[dir=rtl] .dokuwiki ul.idx li.closed {
+    list-style-image: url(images/closed-rtl.png);
+}
diff --git a/lib/tpl/dokuwiki/css/basic.css b/lib/tpl/dokuwiki/css/basic.css
index 0c8b0c13f..eb659f12e 100644
--- a/lib/tpl/dokuwiki/css/basic.css
+++ b/lib/tpl/dokuwiki/css/basic.css
@@ -15,15 +15,7 @@ html {
 html,
 body {
     color: __text__;
-    background-color: __background_site__;
-    background-image: url(images/page-background.svg);
-    /*background-image: -moz-linear-gradient(   top, __background_neu__ 0%, __background_alt__ 1em, __background_site__ 4em); see FS#2447*/
-    background-image: -webkit-linear-gradient(top, __background_neu__ 0%, __background_alt__ 1em, __background_site__ 4em);
-    background-image: -o-linear-gradient(     top, __background_neu__ 0%, __background_alt__ 1em, __background_site__ 4em);
-    background-image: -ms-linear-gradient(    top, __background_neu__ 0%, __background_alt__ 1em, __background_site__ 4em);
-    background-image: linear-gradient(        top, __background_neu__ 0%, __background_alt__ 1em, __background_site__ 4em);
-    background-size: 1px 10em;
-    background-repeat: repeat-x;
+    background: __background_site__ url(images/page-gradient.png) top left repeat-x;
     margin: 0;
     padding: 0;
 }
@@ -383,3 +375,38 @@ button[readonly] {
     cursor: auto;
 }
 
+/*____________ rtl corrections ____________*/
+
+[dir=rtl] caption,
+[dir=rtl] td,
+[dir=rtl] th {
+    text-align: right;
+}
+
+[dir=rtl] ul,
+[dir=rtl] ol {
+    padding: 0 1.5em 0 0;
+}
+[dir=rtl] li,
+[dir=rtl] dd {
+    margin: 0 1.5em 0 0;
+}
+[dir=rtl] blockquote {
+    border-width: 0 .25em 0 0;
+}
+
+[dir=rtl] h1,
+[dir=rtl] h2,
+[dir=rtl] h3,
+[dir=rtl] h4,
+[dir=rtl] h5,
+[dir=rtl] h6,
+[dir=rtl] caption,
+[dir=rtl] legend {
+    clear: right;
+}
+
+[dir=rtl] .a11y {
+    left: auto;
+    right: -9000px;
+}
diff --git a/lib/tpl/dokuwiki/css/content.css b/lib/tpl/dokuwiki/css/content.css
index 7cb7c6edf..ebeb4e17e 100644
--- a/lib/tpl/dokuwiki/css/content.css
+++ b/lib/tpl/dokuwiki/css/content.css
@@ -19,6 +19,17 @@
 .dokuwiki.page  div.level3 {margin-left: 2em;}
 .dokuwiki.page  div.level4 {margin-left: 3em;}
 .dokuwiki.page  div.level5 {margin-left: 4em;}
+
+[dir=rtl] .dokuwiki .page h1 {margin-left: 0; margin-right: 0;}
+[dir=rtl] .dokuwiki .page h2 {margin-left: 0; margin-right: .666em;}
+[dir=rtl] .dokuwiki .page h3 {margin-left: 0; margin-right: 1.776em;}
+[dir=rtl] .dokuwiki .page h4 {margin-left: 0; margin-right: 3em;}
+[dir=rtl] .dokuwiki .page h5 {margin-left: 0; margin-right: 4.5712em;}
+[dir=rtl] .dokuwiki .page div.level1 {margin-left: 0; margin-right: 0;}
+[dir=rtl] .dokuwiki .page div.level2 {margin-left: 0; margin-right: 1em;}
+[dir=rtl] .dokuwiki .page div.level3 {margin-left: 0; margin-right: 2em;}
+[dir=rtl] .dokuwiki .page div.level4 {margin-left: 0; margin-right: 3em;}
+[dir=rtl] .dokuwiki .page div.level5 {margin-left: 0; margin-right: 4em;}
 */
 /* hx margin-left = (1 / font-size) * .levelx-margin */
 
@@ -133,6 +144,11 @@
     margin-bottom: -1px;
     float: left;
 }
+[dir=rtl] .dokuwiki dl.code dt,
+[dir=rtl] .dokuwiki dl.file dt {
+    margin-left: 0;
+    margin-right: 1em;
+}
 .dokuwiki dl.code dt a,
 .dokuwiki dl.file dt a {
     background-color: transparent;
diff --git a/lib/tpl/dokuwiki/css/design.css b/lib/tpl/dokuwiki/css/design.css
index 31fc62390..4f18b79e8 100644
--- a/lib/tpl/dokuwiki/css/design.css
+++ b/lib/tpl/dokuwiki/css/design.css
@@ -23,6 +23,11 @@
     float: left;
     margin-right: .5em;
 }
+[dir=rtl] #dokuwiki__header h1 img {
+    float: right;
+    margin-left: .5em;
+    margin-right: 0;
+}
 #dokuwiki__header h1 span {
     display: block;
     padding-top: 10px;
@@ -78,6 +83,10 @@
     list-style: none;
     display: inline;
 }
+[dir=rtl] #dokuwiki__header .tools li {
+    margin-right: 1em;
+    margin-left: 0;
+}
 #dokuwiki__header .tools form.search div.ajax_qsearch li {
     font-size: 1em;
     margin-left: 0;
@@ -108,6 +117,11 @@
     text-align: right;
     width: 100%;
 }
+[dir=rtl] #dokuwiki__usertools {
+    text-align: left;
+    left: 40px;
+    right: auto;
+}
 #dokuwiki__usertools ul {
     margin: 0 auto;
     padding: 0;
@@ -153,6 +167,9 @@
 #dokuwiki__sitetools {
     text-align: right;
 }
+[dir=rtl] #dokuwiki__sitetools {
+    text-align: left;
+}
 
 #dokuwiki__sitetools form.search {
     display: block;
@@ -163,6 +180,9 @@
     width: 18em;
     padding: .35em 22px .35em .1em;
 }
+[dir=rtl] #dokuwiki__sitetools form.search input.edit {
+    padding: .35em .1em .35em 22px;
+}
 #dokuwiki__sitetools form.search input.button {
     background: transparent url(images/search.png) no-repeat 0 0;
     border-width: 0;
@@ -173,6 +193,11 @@
     box-shadow: none;
     padding: 0;
 }
+[dir=rtl] #dokuwiki__sitetools form.search input.button {
+    background-position: 5px 0;
+    margin-left: 0;
+    margin-right: -20px;
+}
 
 #dokuwiki__sitetools ul {
     margin-top: 0.5em;
@@ -263,6 +288,10 @@
 #dokuwiki__aside ol {
     padding-left: 0;
 }
+[dir=rtl] #dokuwiki__aside ul,
+[dir=rtl] #dokuwiki__aside ol {
+    padding-right: 0;
+}
 #dokuwiki__aside li ul,
 #dokuwiki__aside li ol {
     margin-bottom: 0;
@@ -288,6 +317,10 @@
     overflow: hidden;
     padding: 1em 1em 0;
 }
+[dir=rtl] .dokuwiki .pageId {
+    right: auto;
+    left: -1em;
+}
 .dokuwiki .pageId span {
     font-size: 0.875em;
     border: solid __background_alt__;
@@ -317,6 +350,9 @@
     font-size: 0.875em;
     text-align: right;
 }
+[dir=rtl] .dokuwiki .docInfo {
+    text-align: left;
+}
 
 /*____________ misc ____________*/
 
@@ -354,16 +390,35 @@
     border-bottom-left-radius: 4px;
     border-left-width: 1px;
 }
+[dir=rtl] .dokuwiki div.toolbar button.toolbutton:first-child {
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+    border-top-right-radius: 4px;
+    border-bottom-right-radius: 4px;
+    border-left-width: 0;
+    border-right-width: 1px;
+}
 .dokuwiki div.toolbar button.toolbutton:last-child {
     border-top-right-radius: 4px;
     border-bottom-right-radius: 4px;
 }
+[dir=rtl] .dokuwiki div.toolbar button.toolbutton:last-child {
+    border-top-left-radius: 4px;
+    border-bottom-left-radius: 4px;
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
+    border-left-width: 1px;
+}
 
 .dokuwiki div.section_highlight {
     margin: -3em -2em -.01em -2em;
     padding: 3em 1em .01em 1em;
     border-width: 0 1em;
 }
+[dir=rtl] .dokuwiki div.section_highlight {
+    margin-right: -2em;
+    border-right-width: 1em;
+}
 
 .dokuwiki textarea.edit {
     font-family: Consolas, "Andale Mono WT", "Andale Mono", "Bitstream Vera Sans Mono", "Liberation Mono", Monaco, "Courier New", monospace;
@@ -377,52 +432,61 @@
 
 /*____________ changes to _toc ____________*/
 
-.dokuwiki div.toc {
+#dw__toc {
     margin:  -2em -2em .5em 1.4em;
     width: __sidebar_width__;
     border-left: 1px solid __border__;
     background: __background__;
     color: inherit;
 }
+[dir=rtl] #dw__toc {
+    margin: -2em 1.4em .5em -2em;
+    border-left-width: 0;
+    border-right: 1px solid __border__;
+}
 
-.dokuwiki div.tocheader {
+.dokuwiki h3.toggle {
     padding: .5em 1em;
     margin-bottom: 0;
     font-size: .875em;
     letter-spacing: .1em;
 }
+#dokuwiki__aside h3.toggle {
+    display: none;
+}
 
-.dokuwiki .toc span.toc_open,
-.dokuwiki .toc span.toc_close {
+.dokuwiki .toggle strong {
     background: transparent url(images/toc-arrows.png) 0 0;
     width: 8px;
     height: 5px;
     margin: .4em 0 0;
 }
-.dokuwiki .toc span.toc_open {
+.dokuwiki .toggle.closed strong {
     background-position: 0 -5px;
 }
 
-.dokuwiki .toc span.toc_open span,
-.dokuwiki .toc span.toc_close span {
+.dokuwiki .toggle strong span {
     display: none;
 }
 
 
-.dokuwiki #toc__inside {
+#dw__toc > div {
     font-size: 0.875em;
     padding: .5em 1em 1em;
 }
-.dokuwiki #toc__inside ul {
+#dw__toc ul {
     padding: 0 0 0 1.2em;
 }
-.dokuwiki #toc__inside ul li {
+[dir=rtl] #dw__toc ul {
+    padding: 0 1.5em 0 0;
+}
+#dw__toc ul li {
     list-style-image: url(images/toc-bullet.png);
 }
-.dokuwiki #toc__inside ul li.clear {
+#dw__toc ul li.clear {
     list-style: none;
 }
-.dokuwiki #toc__inside ul li div.li {
+#dw__toc ul li div.li {
     padding: .2em 0;
 }
 
@@ -449,9 +513,18 @@
     text-align: right;
     clear: left;
 }
+[dir=rtl] #dokuwiki__detail div.img_detail dl dt {
+    float: right;
+    text-align: left;
+    clear: right;
+}
 #dokuwiki__detail div.img_detail dl dd {
     margin-left: 9.5em;
 }
+[dir=rtl] #dokuwiki__detail div.img_detail dl dd {
+    margin-left: 0;
+    margin-right: 9.5em;
+}
 
 
 /*____________ JS popup ____________*/
@@ -475,6 +548,10 @@
 .JSpopup ol {
     padding-left: 0;
 }
+[dir=rtl] .JSpopup ul,
+[dir=rtl] .JSpopup ol {
+    padding-right: 0;
+}
 
 
 /* footer
@@ -497,6 +574,10 @@
     font-size: 100%;
 }
 
+[dir=rtl] #dokuwiki__footer .license img {
+    margin: 0 0 0 .5em;
+}
+
 #dokuwiki__footer div.buttons a img {
     opacity: 0.5;
 }
diff --git a/lib/tpl/dokuwiki/css/mobile.css b/lib/tpl/dokuwiki/css/mobile.css
index e1052f437..4d18113ac 100644
--- a/lib/tpl/dokuwiki/css/mobile.css
+++ b/lib/tpl/dokuwiki/css/mobile.css
@@ -5,17 +5,27 @@
  * @author Anika Henke <anika@selfthinker.org>
  */
 
-/* up to 768px screen widths
+/* up to 979px screen widths
 ********************************************************************/
-@media only screen and (max-width: 768px), only screen and (max-device-width: 960px) {
+@media only screen and (max-width: 979px) {
 
 /* structure */
 #dokuwiki__aside {
     width: 100%;
     float: none;
 }
-#dokuwiki__aside > .pad {
+
+#dokuwiki__aside > .pad,
+[dir=rtl] #dokuwiki__aside > .pad {
     margin: 0 0 .5em;
+    /* style like .page */
+    background: __background__;
+    color: inherit;
+    border: 1px solid #eee;
+    box-shadow: 0 0 .5em #999;
+    border-radius: 2px;
+    padding: 1em;
+    margin-bottom: .5em;
 }
 
 .hasSidebar #dokuwiki__content {
@@ -27,18 +37,30 @@
     margin-left: 0;
 }
 
+[dir=rtl] .hasSidebar #dokuwiki__content,
+[dir=rtl] .hasSidebar #dokuwiki__content > .pad {
+    margin-right: 0;
+}
+
 /* toc */
-.dokuwiki div.toc {
+#dw__toc {
     float: none;
     margin: 0 0 1em 0;
     width: auto;
     border-left-width: 0;
     border-bottom: 1px solid __border__;
 }
-.dokuwiki div.tocheader {
-    padding: 0 0 .5em;
+[dir=rtl] #dw__toc {
+    float: none;
+    margin: 0 0 1em 0;
+    border-right-width: 0;
+}
+
+.dokuwiki h3.toggle {
+    padding: 0 .5em .5em 0;
 }
-.dokuwiki #toc__inside {
+#dw__toc > div,
+#dokuwiki__aside div.content {
     padding: .2em 0 .5em;
 }
 
@@ -46,12 +68,6 @@
 .dokuwiki div.page {
     padding: 1em;
 }
-.dokuwiki .pageId span {
-    border-width: 0;
-    background-color: __background_site__;
-    color: __text_alt__;
-    box-shadow: 0 0 0;
-}
 
 /* _edit */
 .dokuwiki div.section_highlight {
@@ -65,10 +81,12 @@
 }
 
 /* _recent */
-.dokuwiki #dw__recent ul,
-.dokuwiki #page__revisions ul {
+.dokuwiki form.changes ul {
     padding-left: 0;
 }
+[dir=rtl] .dokuwiki form.changes ul {
+    padding-right: 0;
+}
 
 
 } /* /@media */
@@ -76,7 +94,7 @@
 
 /* up to 480px screen widths
 ********************************************************************/
-@media only screen and (max-width: 480px), only screen and (max-device-width: 960px) {
+@media only screen and (max-width: 480px) {
 
 /*____________ structure ____________*/
 
@@ -90,6 +108,18 @@
     padding: .5em 0;
 }
 
+#dokuwiki__aside h3.toggle {
+    font-size: 1em;
+}
+#dokuwiki__aside h3.toggle.closed {
+    margin-bottom: 0;
+    padding-bottom: 0;
+}
+#dokuwiki__aside h3.toggle.open {
+    border-bottom: 1px solid __border__;
+}
+
+
 /*____________ header ____________*/
 
 #dokuwiki__header ul.a11y.skip {
@@ -103,10 +133,19 @@
     padding-left: 0;
     margin: 0;
 }
+[dir=rtl] #dokuwiki__header ul.a11y.skip {
+    left: auto !important;
+    right: 0 !important;
+    float: left;
+    padding-right: 0;
+}
 #dokuwiki__header ul.a11y.skip li {
     margin-left: .35em;
     display: inline;
 }
+[dir=rtl] #dokuwiki__header ul.a11y.skip li {
+    margin: 0 .35em 0 0;
+}
 
 #dokuwiki__header .headings,
 #dokuwiki__header .tools {
@@ -115,9 +154,18 @@
     width: auto;
     margin-bottom: .5em;
 }
+[dir=rtl] #dokuwiki__header .headings,
+[dir=rtl] #dokuwiki__header .tools {
+    float: none;
+    text-align: right;
+    width: auto;
+}
 #dokuwiki__sitetools {
     text-align: left;
 }
+[dir=rtl] #dokuwiki__sitetools {
+    text-align: right;
+}
 #dokuwiki__usertools,
 #dokuwiki__sitetools ul,
 #dokuwiki__sitetools h3,
@@ -133,6 +181,11 @@
     margin: 0 .2em .2em 0;
     width: 49%;
 }
+[dir=rtl] #dokuwiki__sitetools form.search {
+    float: right;
+    margin: 0 0 .2em .2em;
+}
+
 #dokuwiki__sitetools form.search input.edit {
     width: 100% !important;
 }
@@ -148,6 +201,9 @@
     float: right;
     width: 49%;
 }
+[dir=rtl] #dokuwiki__header .mobileTools {
+    float: left;
+}
 #dokuwiki__header .mobileTools select {
     padding: .3em .1em;
     width: 100% !important;
@@ -156,6 +212,7 @@
 
 /*____________ content ____________*/
 
+#dokuwiki__aside > .pad,
 .dokuwiki div.page {
     padding: .5em;
 }
@@ -178,6 +235,9 @@
 .dokuwiki label.block {
     text-align: left;
 }
+[dir=rtl] .dokuwiki label.block {
+    text-align: right;
+}
 .dokuwiki label.block span {
     display: block;
 }
diff --git a/lib/tpl/dokuwiki/css/pagetools.css b/lib/tpl/dokuwiki/css/pagetools.css
index bfa22cb2e..a40d525b3 100644
--- a/lib/tpl/dokuwiki/css/pagetools.css
+++ b/lib/tpl/dokuwiki/css/pagetools.css
@@ -22,6 +22,10 @@
     /* move the tools just outside of the site */
     right: 40px;
 }
+[dir=rtl] #dokuwiki__usertools {
+    right: auto;
+    left: 40px;
+}
 
 
 #dokuwiki__pagetools {
@@ -31,6 +35,10 @@
     top: 2em;
     width: 40px;
 }
+[dir=rtl] #dokuwiki__pagetools {
+    right: auto;
+    left: -40px;
+}
 
 #dokuwiki__pagetools div.tools {
     position: fixed;
@@ -46,6 +54,11 @@
     /* add transparent border to prevent jumping when proper border is added on hover */
     border: 1px solid transparent;
 }
+[dir=rtl] #dokuwiki__pagetools ul {
+    right: auto;
+    left: 0;
+    text-align: left;
+}
 
 #dokuwiki__pagetools ul li {
     padding: 0;
@@ -66,6 +79,10 @@
     border: 1px solid transparent;
     white-space: nowrap;
 }
+[dir=rtl] #dokuwiki__pagetools ul li a {
+    padding: 5px 5px 5px 40px;
+    background-position: left 0;
+}
 
 /* hide labels accessibly when neither on hover nor on focus */
 #dokuwiki__pagetools ul li a span {
@@ -82,6 +99,10 @@
     border-radius: 2px;
     box-shadow: 2px 2px 2px __text_alt__;
 }
+[dir=rtl] #dokuwiki__pagetools:hover ul,
+[dir=rtl] #dokuwiki__pagetools ul li a:focus {
+    box-shadow: -2px 2px 2px __text_alt__;
+}
 
 #dokuwiki__pagetools:hover ul li a span,
 #dokuwiki__pagetools ul li a:focus span {
@@ -108,6 +129,14 @@
 #dokuwiki__pagetools ul li a.edit:focus {
     background-position: right -45px;
 }
+[dir=rtl] #dokuwiki__pagetools ul li a.edit {
+    background-position: left 0;
+}
+[dir=rtl] #dokuwiki__pagetools ul li a.edit:hover,
+[dir=rtl] #dokuwiki__pagetools ul li a.edit:active,
+[dir=rtl] #dokuwiki__pagetools ul li a.edit:focus {
+    background-position: left -45px;
+}
 
 #dokuwiki__pagetools ul li a.create {
     background-position: right -90px;
@@ -117,6 +146,14 @@
 #dokuwiki__pagetools ul li a.create:focus {
     background-position: right -135px;
 }
+[dir=rtl] #dokuwiki__pagetools ul li a.create {
+    background-position: left -90px;
+}
+[dir=rtl] #dokuwiki__pagetools ul li a.create:hover,
+[dir=rtl] #dokuwiki__pagetools ul li a.create:active,
+[dir=rtl] #dokuwiki__pagetools ul li a.create:focus {
+    background-position: left -135px;
+}
 
 #dokuwiki__pagetools ul li a.show {
     background-position: right -270px;
@@ -126,6 +163,14 @@
 #dokuwiki__pagetools ul li a.show:focus {
     background-position: right -315px;
 }
+[dir=rtl] #dokuwiki__pagetools ul li a.show {
+    background-position: left -270px;
+}
+[dir=rtl] #dokuwiki__pagetools ul li a.show:hover,
+[dir=rtl] #dokuwiki__pagetools ul li a.show:active,
+[dir=rtl] #dokuwiki__pagetools ul li a.show:focus {
+    background-position: left -315px;
+}
 
 #dokuwiki__pagetools ul li a.source {
     background-position: right -360px;
@@ -135,6 +180,14 @@
 #dokuwiki__pagetools ul li a.source:focus {
     background-position: right -405px;
 }
+[dir=rtl] #dokuwiki__pagetools ul li a.source {
+    background-position: left -360px;
+}
+[dir=rtl] #dokuwiki__pagetools ul li a.source:hover,
+[dir=rtl] #dokuwiki__pagetools ul li a.source:active,
+[dir=rtl] #dokuwiki__pagetools ul li a.source:focus {
+    background-position: left -405px;
+}
 
 #dokuwiki__pagetools ul li a.draft {
     background-position: right -180px;
@@ -144,6 +197,14 @@
 #dokuwiki__pagetools ul li a.draft:focus {
     background-position: right -225px;
 }
+[dir=rtl] #dokuwiki__pagetools ul li a.draft {
+    background-position: left -180px;
+}
+[dir=rtl] #dokuwiki__pagetools ul li a.draft:hover,
+[dir=rtl] #dokuwiki__pagetools ul li a.draft:active,
+[dir=rtl] #dokuwiki__pagetools ul li a.draft:focus {
+    background-position: left -225px;
+}
 
 #dokuwiki__pagetools ul li a.revs {
     background-position: right -540px;
@@ -154,6 +215,15 @@
 .mode_revisions #dokuwiki__pagetools ul li a.revs {
     background-position: right -585px;
 }
+[dir=rtl] #dokuwiki__pagetools ul li a.revs {
+    background-position: left -540px;
+}
+[dir=rtl] #dokuwiki__pagetools ul li a.revs:hover,
+[dir=rtl] #dokuwiki__pagetools ul li a.revs:active,
+[dir=rtl] #dokuwiki__pagetools ul li a.revs:focus,
+.mode_revisions [dir=rtl] #dokuwiki__pagetools ul li a.revs {
+    background-position: left -585px;
+}
 
 #dokuwiki__pagetools ul li a.backlink {
     background-position: right -630px;
@@ -164,6 +234,15 @@
 .mode_backlink #dokuwiki__pagetools ul li a.backlink {
     background-position: right -675px;
 }
+[dir=rtl] #dokuwiki__pagetools ul li a.backlink {
+    background-position: left -630px;
+}
+[dir=rtl] #dokuwiki__pagetools ul li a.backlink:hover,
+[dir=rtl] #dokuwiki__pagetools ul li a.backlink:active,
+[dir=rtl] #dokuwiki__pagetools ul li a.backlink:focus,
+.mode_backlink [dir=rtl] #dokuwiki__pagetools ul li a.backlink {
+    background-position: left -675px;
+}
 
 #dokuwiki__pagetools ul li a.top {
     background-position: right -810px;
@@ -173,6 +252,14 @@
 #dokuwiki__pagetools ul li a.top:focus {
     background-position: right -855px;
 }
+[dir=rtl] #dokuwiki__pagetools ul li a.top {
+    background-position: left -810px;
+}
+[dir=rtl] #dokuwiki__pagetools ul li a.top:hover,
+[dir=rtl] #dokuwiki__pagetools ul li a.top:active,
+[dir=rtl] #dokuwiki__pagetools ul li a.top:focus {
+    background-position: left -855px;
+}
 
 #dokuwiki__pagetools ul li a.revert {
     background-position: right -450px;
@@ -183,6 +270,15 @@
 .mode_revert #dokuwiki__pagetools ul li a.revert {
     background-position: right -495px;
 }
+[dir=rtl] #dokuwiki__pagetools ul li a.revert {
+    background-position: left -450px;
+}
+[dir=rtl] #dokuwiki__pagetools ul li a.revert:hover,
+[dir=rtl] #dokuwiki__pagetools ul li a.revert:active,
+[dir=rtl] #dokuwiki__pagetools ul li a.revert:focus,
+.mode_revert [dir=rtl] #dokuwiki__pagetools ul li a.revert {
+    background-position: left -495px;
+}
 
 #dokuwiki__pagetools ul li a.subscribe {
     background-position: right -720px;
@@ -193,6 +289,15 @@
 .mode_subscribe #dokuwiki__pagetools ul li a.subscribe {
     background-position: right -765px;
 }
+[dir=rtl] #dokuwiki__pagetools ul li a.subscribe {
+    background-position: left -720px;
+}
+[dir=rtl] #dokuwiki__pagetools ul li a.subscribe:hover,
+[dir=rtl] #dokuwiki__pagetools ul li a.subscribe:active,
+[dir=rtl] #dokuwiki__pagetools ul li a.subscribe:focus,
+.mode_subscribe [dir=rtl] #dokuwiki__pagetools ul li a.subscribe {
+    background-position: left -765px;
+}
 
 #dokuwiki__pagetools ul li a.mediaManager {
     background-position: right -900px;
@@ -202,6 +307,14 @@
 #dokuwiki__pagetools ul li a.mediaManager:focus {
     background-position: right -945px;
 }
+[dir=rtl] #dokuwiki__pagetools ul li a.mediaManager {
+    background-position: left -900px;
+}
+[dir=rtl] #dokuwiki__pagetools ul li a.mediaManager:hover,
+[dir=rtl] #dokuwiki__pagetools ul li a.mediaManager:active,
+[dir=rtl] #dokuwiki__pagetools ul li a.mediaManager:focus {
+    background-position: left -945px;
+}
 
 #dokuwiki__pagetools ul li a.back {
     background-position: right -990px;
@@ -211,3 +324,11 @@
 #dokuwiki__pagetools ul li a.back:focus {
     background-position: right -1035px;
 }
+[dir=rtl] #dokuwiki__pagetools ul li a.back {
+    background-position: left -990px;
+}
+[dir=rtl] #dokuwiki__pagetools ul li a.back:hover,
+[dir=rtl] #dokuwiki__pagetools ul li a.back:active,
+[dir=rtl] #dokuwiki__pagetools ul li a.back:focus {
+    background-position: left -1035px;
+}
diff --git a/lib/tpl/dokuwiki/css/print.css b/lib/tpl/dokuwiki/css/print.css
index 58b8a5f0d..191d50c28 100644
--- a/lib/tpl/dokuwiki/css/print.css
+++ b/lib/tpl/dokuwiki/css/print.css
@@ -21,7 +21,8 @@ div.error,
 #dokuwiki__header .tools,
 #dokuwiki__aside,
 .dokuwiki .breadcrumbs,
-.dokuwiki .toc,
+#dw__toc,
+h3.toggle,
 .dokuwiki .secedit,
 #dokuwiki__pagetools,
 #dokuwiki__footer {
diff --git a/lib/tpl/dokuwiki/css/rtl.css b/lib/tpl/dokuwiki/css/rtl.css
deleted file mode 100644
index e0f81bb21..000000000
--- a/lib/tpl/dokuwiki/css/rtl.css
+++ /dev/null
@@ -1,593 +0,0 @@
-/**
- * This file provides layout and design corrections for right-to-left
- * languages.
- *
- * @author Anika Henke <anika@selfthinker.org>
- */
-
-/*____________ basic ____________*/
-
-[dir=rtl] caption,
-[dir=rtl] td,
-[dir=rtl] th {
-    text-align: right;
-}
-
-[dir=rtl] ul,
-[dir=rtl] ol {
-    padding: 0 1.5em 0 0;
-}
-[dir=rtl] li,
-[dir=rtl] dd {
-    margin: 0 1.5em 0 0;
-}
-[dir=rtl] blockquote {
-    border-width: 0 .25em 0 0;
-}
-
-[dir=rtl] h1,
-[dir=rtl] h2,
-[dir=rtl] h3,
-[dir=rtl] h4,
-[dir=rtl] h5,
-[dir=rtl] h6,
-[dir=rtl] caption,
-[dir=rtl] legend {
-    clear: right;
-}
-
-[dir=rtl] .a11y {
-    left: auto;
-    right: -9000px;
-}
-
-
-/*____________ _imgdetail ____________*/
-
-[dir=rtl] #dokuwiki__detail div.content img {
-    float: right;
-    margin-right: 0;
-    margin-left: 1.5em;
-}
-[dir=rtl] #dokuwiki__detail div.content div.img_detail {
-    float: right
-}
-
-
-/*____________ _mediamanager ____________*/
-
-[dir=rtl] #mediamgr__aside {
-    left: auto;
-    right: 0;
-    border-right-width: 0;
-    border-left: 1px solid __border__;
-}
-[dir=rtl] #mediamgr__content {
-    right: auto;
-    left: 0;
-}
-
-[dir=rtl] #media__opts input {
-    margin-right: 0;
-    margin-left: .3em;
-}
-
-[dir=rtl] #media__tree ul {
-    padding-left: 0;
-    padding-right: .2em;
-}
-[dir=rtl] #media__tree ul li {
-    clear: right;
-    margin-right: 0;
-}
-[dir=rtl] #media__tree ul li img {
-    float: right;
-    padding: .5em 0 0 .3em;
-}
-[dir=rtl] #media__tree ul li li {
-    margin-left: 0;
-    margin-right: 1.5em;
-}
-
-[dir=rtl] #media__content a.mediafile {
-    margin-right: 0;
-    margin-left: 1.5em;
-}
-[dir=rtl] #media__content div.detail div.thumb {
-    float: right;
-    margin: 0 18px 0 .5em;
-}
-[dir=rtl] #media__content form.meta div.metafield {
-    clear: right;
-}
-[dir=rtl] #media__content form.meta label {
-    float: right;
-    clear: right;
-}
-[dir=rtl] #media__content form.meta .edit {
-    float: right;
-}
-[dir=rtl] #media__content form.meta div.buttons {
-    clear: right;
-    margin: .2em 25% 0 0;
-}
-
-
-/*____________ _links ____________*/
-
-/* if link icons don't work as expected, remove the following lines */
-[dir=rtl] .dokuwiki a.urlextern,
-[dir=rtl] .dokuwiki a.windows,
-[dir=rtl] .dokuwiki a.mail,
-[dir=rtl] .dokuwiki a.interwiki,
-[dir=rtl] .dokuwiki a.mediafile {
-    background-position: right center;
-    padding: 0 17px 0 0;
-}
-
-
-/*____________ _toc ____________*/
-
-[dir=rtl] .dokuwiki div.toc {
-    float: left;
-    margin: 0 1.4em 1.4em 0;
-}
-[dir=rtl] .dokuwiki .toc span.toc_open,
-[dir=rtl] .dokuwiki .toc span.toc_close {
-    float: left;
-}
-[dir=rtl] .dokuwiki #toc__inside ul ul {
-    padding-left: 0;
-    padding-right: 1em;
-}
-
-[dir=rtl] .dokuwiki ul.idx {
-    padding-right: 0;
-}
-[dir=rtl] .dokuwiki ul.idx li.closed {
-    list-style-image: url(images/closed-rtl.png);
-}
-
-
-/*____________ _footnotes ____________*/
-
-
-/*____________ _search ____________*/
-
-[dir=rtl] .dokuwiki div.search_quickresult ul li {
-    float: right;
-}
-[dir=rtl] .dokuwiki form.search div.ajax_qsearch {
-    left: auto;
-    right: -13.5em;
-    text-align: right;
-}
-
-
-/*____________ _recent ____________*/
-
-[dir=rtl] .dokuwiki #dw__recent ul li,
-[dir=rtl] .dokuwiki #page__revisions ul li {
-    margin-right: 0;
-}
-
-
-/*____________ _diff ____________*/
-
-
-/*____________ _edit ____________*/
-
-[dir=rtl] .dokuwiki div.toolbar #draft__status {
-    float: left;
-}
-[dir=rtl] .dokuwiki #wiki__editbar #size__ctl {
-    float: left;
-}
-[dir=rtl] .dokuwiki #wiki__editbar #size__ctl img {
-    cursor: pointer;
-}
-[dir=rtl] .dokuwiki #wiki__editbar .editButtons {
-    margin-right: 0;
-    margin-left: 1em;
-}
-
-[dir=rtl] .dokuwiki .secedit {
-    float: left;
-}
-
-
-/*____________ _modal ____________*/
-
-[dir=rtl] #link__wiz_close {
-    float: left;
-}
-[dir=rtl] #link__wiz_result {
-    text-align: right;
-}
-[dir=rtl] #link__wiz_result div.type_u,
-[dir=rtl] #link__wiz_result div.type_f,
-[dir=rtl] #link__wiz_result div.type_d {
-    padding: 3px 22px 3px 3px;
-    background-position: 257px 3px;
-}
-
-
-/*____________ _forms ____________*/
-
-[dir=rtl] .dokuwiki label.block {
-    text-align: left;
-}
-[dir=rtl] .dokuwiki label.simple {
-    text-align: right;
-}
-
-[dir=rtl] form#subscribe__form fieldset {
-    text-align: right;
-}
-
-
-/*____________ _admin ____________*/
-
-[dir=rtl] .dokuwiki ul.admin_tasks {
-    float: right;
-}
-[dir=rtl] .dokuwiki ul.admin_tasks li {
-    padding-left: 0;
-    padding-right: 35px;
-    background-position: right 0;
-}
-
-[dir=rtl] .dokuwiki #admin__version {
-    clear: right;
-    float: left;
-}
-
-
-/*____________ includes ____________*/
-
-
-/*____________ structure ____________*/
-
-[dir=rtl] #dokuwiki__header .headings {
-    float: right;
-    text-align: right;
-}
-[dir=rtl] #dokuwiki__header .tools {
-    float: left;
-    text-align: left;
-}
-
-[dir=rtl] #dokuwiki__aside {
-    float: right;
-}
-[dir=rtl] #dokuwiki__aside > .pad {
-    margin: 0 0 0 1.5em;
-}
-
-[dir=rtl] .hasSidebar #dokuwiki__content {
-    float: left;
-    margin-left: 0;
-    margin-right: -__sidebar_width__;
-}
-[dir=rtl] .hasSidebar #dokuwiki__content > .pad {
-    margin-left: 0;
-    margin-right: __sidebar_width__;
-}
-
-/*____________ design ____________*/
-
-[dir=rtl] #dokuwiki__header h1 img {
-    float: right;
-    margin-left: .5em;
-    margin-right: 0;
-}
-
-[dir=rtl] #dokuwiki__sitetools form.search input.edit {
-    padding: .35em .1em .35em 22px;
-}
-[dir=rtl] #dokuwiki__sitetools form.search input.button {
-    background-position: 5px 0;
-    margin-left: 0;
-    margin-right: -20px;
-}
-
-[dir=rtl] #dokuwiki__usertools {
-    text-align: left;
-    left: 40px;
-    right: auto;
-}
-
-[dir=rtl] #dokuwiki__sitetools {
-    text-align: left;
-}
-
-[dir=rtl] #dokuwiki__aside ul, #dokuwiki__aside ol {
-    padding-right: 0;
-}
-
-[dir=rtl] .dokuwiki .pageId {
-    right: auto;
-    left: -1em;
-}
-
-[dir=rtl] .dokuwiki .docInfo {
-    text-align: left;
-}
-
-[dir=rtl] .dokuwiki div.toolbar button.toolbutton:first-child {
-    border-top-left-radius: 0;
-    border-bottom-left-radius: 0;
-    border-top-right-radius: 4px;
-    border-bottom-right-radius: 4px;
-    border-left-width: 0;
-    border-right-width: 1px;
-}
-[dir=rtl] .dokuwiki div.toolbar button.toolbutton:last-child {
-    border-top-left-radius: 4px;
-    border-bottom-left-radius: 4px;
-    border-top-right-radius: 0;
-    border-bottom-right-radius: 0;
-    border-left-width: 1px;
-}
-
-[dir=rtl] .dokuwiki div.section_highlight {
-    margin-right: -2em;
-    border-right-width: 1em;
-}
-
-[dir=rtl] #dokuwiki__footer .license img {
-    margin: 0 0 0 .5em;
-}
-
-[dir=rtl] .dokuwiki div.toc {
-    margin: -2em 1.4em .5em -2em;
-    border-left-width: 0;
-    border-right: 1px solid __border__;
-}
-[dir=rtl] .dokuwiki #toc__inside ul {
-    padding: 0 1.5em 0 0;
-}
-
-[dir=rtl] #dokuwiki__detail div.img_detail dl dt {
-    float: right;
-    text-align: left;
-    clear: right;
-}
-[dir=rtl] #dokuwiki__detail div.img_detail dl dd {
-    margin-left: 0;
-    margin-right: 9.5em;
-}
-
-
-/*____________ pagetools ____________*/
-
-[dir=rtl] #dokuwiki__usertools {
-    right: auto;
-    left: 40px;
-}
-
-[dir=rtl] #dokuwiki__pagetools {
-    right: auto;
-    left: -40px;
-}
-
-[dir=rtl] #dokuwiki__pagetools ul {
-    right: auto;
-    left: 0;
-    text-align: left;
-}
-
-[dir=rtl] #dokuwiki__pagetools ul li a {
-    padding: 5px 5px 5px 40px;
-    background-position: left 0;
-}
-
-[dir=rtl] #dokuwiki__pagetools:hover ul,
-[dir=rtl] #dokuwiki__pagetools ul li a:focus {
-    box-shadow: -2px 2px 2px __text_alt__;
-}
-
-/* all available icons in sprite */
-[dir=rtl] #dokuwiki__pagetools ul li a.edit {
-    background-position: left 0;
-}
-[dir=rtl] #dokuwiki__pagetools ul li a.edit:hover,
-[dir=rtl] #dokuwiki__pagetools ul li a.edit:active,
-[dir=rtl] #dokuwiki__pagetools ul li a.edit:focus {
-    background-position: left -45px;
-}
-
-[dir=rtl] #dokuwiki__pagetools ul li a.create {
-    background-position: left -90px;
-}
-[dir=rtl] #dokuwiki__pagetools ul li a.create:hover,
-[dir=rtl] #dokuwiki__pagetools ul li a.create:active,
-[dir=rtl] #dokuwiki__pagetools ul li a.create:focus {
-    background-position: left -135px;
-}
-
-[dir=rtl] #dokuwiki__pagetools ul li a.show {
-    background-position: left -270px;
-}
-[dir=rtl] #dokuwiki__pagetools ul li a.show:hover,
-[dir=rtl] #dokuwiki__pagetools ul li a.show:active,
-[dir=rtl] #dokuwiki__pagetools ul li a.show:focus {
-    background-position: left -315px;
-}
-
-[dir=rtl] #dokuwiki__pagetools ul li a.source {
-    background-position: left -360px;
-}
-[dir=rtl] #dokuwiki__pagetools ul li a.source:hover,
-[dir=rtl] #dokuwiki__pagetools ul li a.source:active,
-[dir=rtl] #dokuwiki__pagetools ul li a.source:focus {
-    background-position: left -405px;
-}
-
-[dir=rtl] #dokuwiki__pagetools ul li a.draft {
-    background-position: left -180px;
-}
-[dir=rtl] #dokuwiki__pagetools ul li a.draft:hover,
-[dir=rtl] #dokuwiki__pagetools ul li a.draft:active,
-[dir=rtl] #dokuwiki__pagetools ul li a.draft:focus {
-    background-position: left -225px;
-}
-
-[dir=rtl] #dokuwiki__pagetools ul li a.revs {
-    background-position: left -540px;
-}
-[dir=rtl] #dokuwiki__pagetools ul li a.revs:hover,
-[dir=rtl] #dokuwiki__pagetools ul li a.revs:active,
-[dir=rtl] #dokuwiki__pagetools ul li a.revs:focus,
-.mode_revisions [dir=rtl] #dokuwiki__pagetools ul li a.revs {
-    background-position: left -585px;
-}
-
-[dir=rtl] #dokuwiki__pagetools ul li a.backlink {
-    background-position: left -630px;
-}
-[dir=rtl] #dokuwiki__pagetools ul li a.backlink:hover,
-[dir=rtl] #dokuwiki__pagetools ul li a.backlink:active,
-[dir=rtl] #dokuwiki__pagetools ul li a.backlink:focus,
-.mode_backlink [dir=rtl] #dokuwiki__pagetools ul li a.backlink {
-    background-position: left -675px;
-}
-
-[dir=rtl] #dokuwiki__pagetools ul li a.top {
-    background-position: left -810px;
-}
-[dir=rtl] #dokuwiki__pagetools ul li a.top:hover,
-[dir=rtl] #dokuwiki__pagetools ul li a.top:active,
-[dir=rtl] #dokuwiki__pagetools ul li a.top:focus {
-    background-position: left -855px;
-}
-
-[dir=rtl] #dokuwiki__pagetools ul li a.revert {
-    background-position: left -450px;
-}
-[dir=rtl] #dokuwiki__pagetools ul li a.revert:hover,
-[dir=rtl] #dokuwiki__pagetools ul li a.revert:active,
-[dir=rtl] #dokuwiki__pagetools ul li a.revert:focus,
-.mode_revert [dir=rtl] #dokuwiki__pagetools ul li a.revert {
-    background-position: left -495px;
-}
-
-[dir=rtl] #dokuwiki__pagetools ul li a.subscribe {
-    background-position: left -720px;
-}
-[dir=rtl] #dokuwiki__pagetools ul li a.subscribe:hover,
-[dir=rtl] #dokuwiki__pagetools ul li a.subscribe:active,
-[dir=rtl] #dokuwiki__pagetools ul li a.subscribe:focus,
-.mode_subscribe [dir=rtl] #dokuwiki__pagetools ul li a.subscribe {
-    background-position: left -765px;
-}
-
-[dir=rtl] #dokuwiki__pagetools ul li a.mediaManager {
-    background-position: left -900px;
-}
-[dir=rtl] #dokuwiki__pagetools ul li a.mediaManager:hover,
-[dir=rtl] #dokuwiki__pagetools ul li a.mediaManager:active,
-[dir=rtl] #dokuwiki__pagetools ul li a.mediaManager:focus {
-    background-position: left -945px;
-}
-
-[dir=rtl] #dokuwiki__pagetools ul li a.back {
-    background-position: left -990px;
-}
-[dir=rtl] #dokuwiki__pagetools ul li a.back:hover,
-[dir=rtl] #dokuwiki__pagetools ul li a.back:active,
-[dir=rtl] #dokuwiki__pagetools ul li a.back:focus {
-    background-position: left -1035px;
-}
-
-
-/*____________ content ____________*/
-
-/* section indenting
-[dir=rtl] .dokuwiki .page h1 {margin-left: 0; margin-right: 0;}
-[dir=rtl] .dokuwiki .page h2 {margin-left: 0; margin-right: .666em;}
-[dir=rtl] .dokuwiki .page h3 {margin-left: 0; margin-right: 1.776em;}
-[dir=rtl] .dokuwiki .page h4 {margin-left: 0; margin-right: 3em;}
-[dir=rtl] .dokuwiki .page h5 {margin-left: 0; margin-right: 4.5712em;}
-[dir=rtl] .dokuwiki .page div.level1 {margin-left: 0; margin-right: 0;}
-[dir=rtl] .dokuwiki .page div.level2 {margin-left: 0; margin-right: 1em;}
-[dir=rtl] .dokuwiki .page div.level3 {margin-left: 0; margin-right: 2em;}
-[dir=rtl] .dokuwiki .page div.level4 {margin-left: 0; margin-right: 3em;}
-[dir=rtl] .dokuwiki .page div.level5 {margin-left: 0; margin-right: 4em;}
-*/
-
-[dir=rtl] .dokuwiki dl.code dt,
-[dir=rtl] .dokuwiki dl.file dt {
-    margin-left: 0;
-    margin-right: 1em;
-}
-
-[dir=rtl] .JSpopup ul,
-[dir=rtl] .JSpopup ol {
-    padding-right: 0;
-}
-
-
-/*____________ mobile ____________*/
-
-@media only screen and (max-width: 768px), only screen and (max-device-width: 960px) {
-
-
-[dir=rtl] .hasSidebar #dokuwiki__content,
-[dir=rtl] .hasSidebar #dokuwiki__content > .pad {
-    margin-right: 0;
-}
-
-[dir=rtl] .dokuwiki div.toc {
-    float: none;
-    margin: 0 0 1em 0;
-    border-right-width: 0;
-}
-
-[dir=rtl] .dokuwiki #dw__recent ul,
-[dir=rtl] .dokuwiki #page__revisions ul {
-    padding-right: 0;
-}
-
-
-} /* /@media */
-
-@media only screen and (max-width: 480px), only screen and (max-device-width: 480px) {
-
-
-[dir=rtl] #dokuwiki__header ul.a11y.skip {
-    left: auto !important;
-    right: 0 !important;
-    float: left;
-    padding-right: 0;
-}
-[dir=rtl] #dokuwiki__header ul.a11y.skip li {
-    margin: 0 .35em 0 0;
-}
-
-[dir=rtl] #dokuwiki__header .headings,
-[dir=rtl] #dokuwiki__header .tools {
-    float: none;
-    text-align: right;
-    width: auto;
-}
-[dir=rtl] #dokuwiki__sitetools {
-    text-align: right;
-}
-
-[dir=rtl] #dokuwiki__sitetools form.search {
-    float: right;
-    margin: 0 0 .2em .2em;
-}
-
-[dir=rtl] #dokuwiki__header .mobileTools {
-    float: left;
-}
-
-[dir=rtl] .dokuwiki label.block {
-    text-align: right;
-}
-
-
-
-} /* /@media */
diff --git a/lib/tpl/dokuwiki/css/structure.css b/lib/tpl/dokuwiki/css/structure.css
index 9cca1aa3b..5e2eab3bc 100644
--- a/lib/tpl/dokuwiki/css/structure.css
+++ b/lib/tpl/dokuwiki/css/structure.css
@@ -23,10 +23,18 @@ body {
     #dokuwiki__header .headings {
         float: left;
     }
+    [dir=rtl] #dokuwiki__header .headings {
+        float: right;
+        text-align: right;
+    }
     #dokuwiki__header .tools {
         float: right;
         text-align: right;
     }
+    [dir=rtl] #dokuwiki__header .tools {
+        float: left;
+        text-align: left;
+    }
 
 #dokuwiki__site .wrapper {
     position: relative;
@@ -38,18 +46,33 @@ body {
         position: relative;
         display: block;
     }
+    [dir=rtl] #dokuwiki__aside {
+        float: right;
+    }
     #dokuwiki__aside > .pad {
         margin: 0 1.5em 0 0;
     }
+    [dir=rtl] #dokuwiki__aside > .pad {
+        margin: 0 0 0 1.5em;
+    }
 
     .hasSidebar #dokuwiki__content {
         float: right;
         margin-left: -__sidebar_width__;
         width: 100%;
     }
+    [dir=rtl] .hasSidebar #dokuwiki__content {
+        float: left;
+        margin-left: 0;
+        margin-right: -__sidebar_width__;
+    }
     .hasSidebar #dokuwiki__content > .pad {
         margin-left: __sidebar_width__;
     }
+    [dir=rtl] .hasSidebar #dokuwiki__content > .pad {
+        margin-left: 0;
+        margin-right: __sidebar_width__;
+    }
 
 #dokuwiki__footer {
     clear: both;
diff --git a/lib/tpl/dokuwiki/images/page-gradient.png b/lib/tpl/dokuwiki/images/page-gradient.png
new file mode 100644
index 000000000..bbe2efad4
--- /dev/null
+++ b/lib/tpl/dokuwiki/images/page-gradient.png
diff --git a/lib/tpl/dokuwiki/main.php b/lib/tpl/dokuwiki/main.php
index 57c94f174..d8e85850f 100644
--- a/lib/tpl/dokuwiki/main.php
+++ b/lib/tpl/dokuwiki/main.php
@@ -37,10 +37,13 @@ $showSidebar = $conf['sidebar'] && page_exists($conf['sidebar']) && ($ACT=='show
             <?php if($showSidebar): ?>
                 <!-- ********** ASIDE ********** -->
                 <div id="dokuwiki__aside"><div class="pad include group">
-                    <?php tpl_flush() ?>
-                    <?php tpl_includeFile('sidebarheader.html') ?>
-                    <?php tpl_include_page($conf['sidebar']) ?>
-                    <?php tpl_includeFile('sidebarfooter.html') ?>
+                    <h3 class="toggle"><?php echo hsc(ucfirst($conf['sidebar'])) ?></h3>
+                    <div class="content">
+                        <?php tpl_flush() ?>
+                        <?php tpl_includeFile('sidebarheader.html') ?>
+                        <?php tpl_include_page($conf['sidebar']) ?>
+                        <?php tpl_includeFile('sidebarfooter.html') ?>
+                    </div>
                 </div></div><!-- /aside -->
             <?php endif; ?>
 
diff --git a/lib/tpl/dokuwiki/script.js b/lib/tpl/dokuwiki/script.js
new file mode 100644
index 000000000..677e2f53b
--- /dev/null
+++ b/lib/tpl/dokuwiki/script.js
@@ -0,0 +1,75 @@
+/**
+ *  We handle several device classes based on browser width.
+ *  see http://twitter.github.com/bootstrap/scaffolding.html#responsive
+ *
+ *  - desktop:   980+
+ *  - mobile:    < 980
+ *    - tablet   481 - 979   (ostensibly for tablets in portrait mode)
+ *    - phone    <= 480
+ */
+var device_class = 'not yet known';
+var device_classes = 'desktop mobile tablet phone';
+
+function tpl_dokuwiki_mobile(){
+
+    // determine our device pattern
+    // TODO: consider moving into dokuwiki core
+    var w = document.body.clientWidth;
+    if (w > 979) {
+        if (device_class == 'desktop') return;
+        device_class = 'desktop';
+    } else if (w > 480) {
+        if (device_class.match(/tablet/)) return;
+        device_class = 'mobile tablet';
+    } else {
+        if (device_class.match(/phone/)) return;
+        device_class = 'mobile phone';
+    }
+
+    jQuery('html').removeClass(device_classes).addClass(device_class);
+
+    // handle some layout changes based on change in device
+    var $handle = jQuery('#dokuwiki__aside h3.toggle');
+    var $toc = jQuery('#dw__toc h3');
+
+    if (device_class == 'desktop') {
+        // reset for desktop mode
+        if($handle.length) {
+            $handle[0].setState(1);
+            $handle.hide();
+        }
+        if($toc.length) {
+            $toc[0].setState(1);
+        }
+    }
+    if (device_class.match(/mobile/)){
+        // toc and sidebar hiding
+        if($handle.length) {
+            $handle.show();
+            $handle[0].setState(-1);
+        }
+        if($toc.length) {
+            $toc[0].setState(-1);
+        }
+    }
+}
+
+jQuery(function(){
+    var resizeTimer;
+    dw_page.makeToggle('#dokuwiki__aside h3.toggle','#dokuwiki__aside div.content');
+
+    tpl_dokuwiki_mobile();
+    jQuery(window).bind('resize',
+        function(){
+            if (resizeTimer) clearTimeout(resizeTimer);
+            resizeTimer = setTimeout(tpl_dokuwiki_mobile,200);
+        }
+    );
+
+    // increase sidebar length to match content (desktop mode only)
+    var $sb = jQuery('.desktop #dokuwiki__aside');
+    if($sb.length) {
+        var $ct = jQuery('#dokuwiki__content div.page');
+        if($sb.height() > $ct.height()) $ct.height($sb.height());
+    }
+});
diff --git a/lib/tpl/dokuwiki/style.ini b/lib/tpl/dokuwiki/style.ini
index b8e55bcc8..08d1a4273 100644
--- a/lib/tpl/dokuwiki/style.ini
+++ b/lib/tpl/dokuwiki/style.ini
@@ -29,10 +29,9 @@ css/design.css            = screen
 css/pagetools.css         = screen
 css/content.css           = screen
 css/includes.css          = screen
-css/mobile.css            = screen
-css/rtl.css               = screen
 
-css/print.css         = print
+css/mobile.css            = all
+css/print.css             = print
 
 
 ; This section is used to configure some placeholder values used in