Merge branch 'master' into 'live'

Release current version

See merge request !24

.gitlab-ci.yml

@@ -6,3 +6,13 @@ sprintdoc-farm:
     - live
   script:
     - fab deploy
+    
+
+cosmocode-farm:
+  environment: cosmocode-farm
+  tags:
+    - locally
+  only:
+    - live
+  script:
+    - fab deploy

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_footer.less

@@ -26,6 +26,7 @@
             z-index: 2;
             box-sizing: border-box;
             background-color: @color-site-bg;
+
         }
         p {
             font-size: @font-size-default;

css/area_main-sidebar-nav.less

@@ -16,7 +16,6 @@
     a.nav {
         font-size: @font-size-head6;
         margin: 0 0 @font-size-head6;
-
         cursor: pointer;
         font-weight: normal;
         margin-left: (@menu-margin * -1); // moves the toggles back to the left
@@ -27,7 +26,9 @@
 
         height: @icon-size + @margin-small;
         display: flex;
+        display: -ms-flexbox;
         flex-direction: row;
+        -ms-flex-direction: row;
         align-items: center;
 
         span {
@@ -108,27 +109,61 @@
     #dokuwiki__aside {
         display: none;
     }
+
     // show when toggled
-    #dokuwiki__aside.show {
+    body.show-mobile-sidebar {
+
+        #dokuwiki__aside {
             display: block;
 
             position: absolute;
-        left: 0;
+            left: 1.25rem;//left margin of content container
             z-index: 200; // above all
-
+            box-shadow: @box-shadow-right-bottom;
-
-        border-right: @ini_border 1px solid;
-        box-shadow: @box-shadow;;
-
-        max-width: 100%;
             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, @color-content-bg);
+                background: linear-gradient(left, @ini_background, @color-content-bg);
 
-        background-color: @ini_background;
+                z-index: 0;
+            }
+
+            > nav{
+                position: relative;
+                //display: block;
+                z-index: 2;
+                &:first-child{
+                    margin-top: 1.2rem;
+                }
+            }
+
+            a.nav {
+                border-radius: 0;
+                border-right-width: 0;
+                border-left-width: 0;
+            }
+            .nav-panel,
+            a.nav{
+                padding-right: .8em;
             }
         }
 
 
+    }
+
+}
 
 // FIXME check if the stuff below is still relevant
 
@@ -158,7 +193,6 @@
         }
     }
 
-
 }
 
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + */

css/area_nav-breadcrumb.less

@@ -151,7 +151,10 @@
             right: 0;
             width: auto;
             border: 0 none;
-            background: @color-site-bg;
+            background: @background_page-header;
+            background: -webkit-linear-gradient(top, @background_page-header, @color-content-bg);
+            background: linear-gradient(top, @background_page-header, @color-content-bg);
+            box-shadow: @box-shadow-bottom;
             z-index: 2000;
 
             #plugin__qc__out{

css/base.less

@@ -34,6 +34,8 @@
 @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__;
 

css/base_structure.less

@@ -245,3 +245,30 @@
         }
     }
 }
+
+@media @screen_max-xxs{
+    @mobileMargin: 4px;
+    .container{
+        margin: 0 @mobileMargin;
+    }
+    body.show-mobile-sidebar #dokuwiki__aside{
+        left: @mobileMargin;
+    }
+    #dokuwiki__usertools{
+        right: @mobileMargin;
+    }
+    #dokuwiki__footer{
+        .main-footer{
+            > *{
+                padding-left: 2rem;
+                padding-right: 2rem;
+            }
+
+        }
+    }
+    .page-footer{
+
+    }
+
+}
+

css/plugins/magic-matcher.less

@@ -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/struct.less

@@ -45,3 +45,7 @@
         margin-top: -.5rem;
     }
 }
+
+.dokuwiki .struct_inlineditor {
+    z-index: 3;
+}

detail.php

@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <?php
 /**
  * DokuWiki Image Detail Page
@@ -11,7 +12,7 @@
 if (!defined('DOKU_INC')) die();
 header('X-UA-Compatible: IE=edge,chrome=1');
 
-?><!DOCTYPE html>
+?>
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $conf['lang']?>"
  lang="<?php echo $conf['lang']?>" dir="<?php echo $lang['direction'] ?>" class="no-js">
 <head>
@@ -28,7 +29,6 @@ header('X-UA-Compatible: IE=edge,chrome=1');
 </head>
 
 <body>
-    <!--[if lte IE 8 ]><div id="IE8"><![endif]-->
     <div id="dokuwiki__detail" class="<?php echo tpl_classes(); ?>">
         <?php html_msgarea() ?>
 
@@ -89,6 +89,5 @@ header('X-UA-Compatible: IE=edge,chrome=1');
 
         <?php endif; ?>
     </div>
-    <!--[if lte IE 8 ]></div><![endif]-->
 </body>
 </html>

js/breadcrumb.js

@@ -2,14 +2,14 @@
  * Sets up the breadcrumb behaviour (adds do / ACT status information)
  */
 jQuery(function () {
-    const $breadcrumb = jQuery('.breadcrumbs');
+    var $breadcrumb = jQuery('.breadcrumbs');
     if (!$breadcrumb.length) return;
 
     /**
      * add ACT status to breadcrumb (if not show)
      *
      */
-    const mode = $breadcrumb.attr('data-do');
+    var mode = $breadcrumb.attr('data-do');
     if(mode && mode.indexOf('show') !== 0){
         var markup = '<bdi lang="en"><span class="curid"> : <strong>' + mode + '</strong></span></bdi>';
         $breadcrumb.find('p').append(markup);

js/meta-box.js

@@ -1,5 +1,5 @@
 jQuery(function () {
-    const $metaBox = jQuery('#spr__meta-box');
+    var $metaBox = jQuery('#spr__meta-box');
     if (!$metaBox.length) return;
 
     /**
@@ -10,8 +10,8 @@ jQuery(function () {
      */
     $metaBox.on('click', '.meta-tabs a', function (e) {
         e.preventDefault();
-        const $tab = jQuery(this);
+        var $tab = jQuery(this),
-        const isopen = $tab.attr('aria-expanded') === 'true';
+            isopen = $tab.attr('aria-expanded') === 'true';
 
         // disable all existing tabs
         $metaBox.find('.meta-tabs li')

js/sidebar.js

@@ -2,42 +2,42 @@
  * Sets up the sidebar behaviour
  */
 jQuery(function () {
-    const $nav = jQuery('#dokuwiki__aside');
+    var $nav = jQuery('#dokuwiki__aside');
     if (!$nav.length) return;
 
         /**
          * closes sidebar
          */
-    const setWideContent = function () {
+    var setWideContent = function () {
             $nav.find('div.nav-panel').hide(); // close all panels
             jQuery('body').addClass('wide-content');
-    };
+        },
 
         /**
          * opens the sidebar
          */
-    const setDefaultContent = function () {
+        setDefaultContent = function () {
             jQuery('body').removeClass('wide-content');
 
-    };
+        },
 
         /**
          * Accessibility helper, focuses the first link witih the given element
          *
          * @param {jQuery} $elem
          */
-    const focusFirstSubLink = function ($elem) {
+        focusFirstSubLink = function ($elem) {
             $elem.find('a').first().focus();
-    };
+        },
 
         /**
          * Toggle a navigation panel
          *
          * @param {jQuery} $toggler The h6 toggler
          */
-    const toggleNav = function ($toggler) {
+         toggleNav = function ($toggler) {
-        const $panel = $toggler.next('div.nav-panel');
+            var $panel = $toggler.next('div.nav-panel');
-        const isOpen = $panel.is(':visible');
+            var isOpen = $panel.is(':visible');
             // open sidebar on interaction
             setDefaultContent();
             // toggle the panel, focus first link after opening
@@ -46,35 +46,36 @@ jQuery(function () {
                     focusFirstSubLink($panel);
                 }
             });
-    };
+        },
 
         /**
          * Initialize the content navigation
          *
          * It mangles the sidebar content and handles inline Icon configuration
          */
-    const initContentNav = function () {
+        initContentNav = function () {
-        const $main = $nav.find('nav.nav-main');
+            var $main = $nav.find('nav.nav-main');
             if (!$main.length) return;
 
-        const ELEMENT = 'h1,h2,h3,h4,h5'; // FIXME move to config
+            var ELEMENT = 'h1,h2,h3,h4,h5'; // FIXME move to config
-        const $elements = $main.find(ELEMENT);
+            var $elements = $main.find(ELEMENT);
             $elements.each(function () {
-            const $me = jQuery(this);
+                var $me = jQuery(this),
 
                 // prepare text and the optional icon
-            const data = $me.text().split('@', 2);
+                    data = $me.text().split('@', 2),
-            const text = data[0].trim();
+                    text = data[0].trim();
-            const $icon = jQuery('<span class="ico">')
+
+                var $icon = jQuery('<span class="ico">')
                     .text(text.substr(0, 1).toUpperCase() + text.substr(1, 1).toLowerCase())
                     .wrapInner('<strong>');
                 if (data[1]) {
-                const src = data[1].trim();
+                    var src = data[1].trim();
                     $icon.load(DOKU_BASE + 'lib/tpl/sprintdoc/svg.php?svg=' + src + '&e=1'); // directly embed
                 }
 
                 // make the new toggler
-            const $toggler = jQuery('<a>')
+                var $toggler = jQuery('<a>')
                         .addClass('nav')
                         .attr('href', '#')
                         .attr('role', 'heading')
@@ -85,11 +86,11 @@ jQuery(function () {
                     ;
 
                 // wrap all following siblings til the next element in a wrapper
-            const $wrap = jQuery('<div>')
+                var $wrap = jQuery('<div>')
                     .addClass('nav-panel');
-            const $sibs = $me.nextAll();
+                var $sibs = $me.nextAll();
-            for (let i = 0; i < $sibs.length; i++) {
+                for (var i = 0; i < $sibs.length; i++) {
-                const $sib = jQuery($sibs[i]);
+                    var $sib = jQuery($sibs[i]);
                     if ($sib.is(ELEMENT)) break;
                     $sib.detach().appendTo($wrap);
                 }
@@ -98,36 +99,36 @@ jQuery(function () {
                 // replace element with toggler
                 $me.replaceWith($toggler);
             });
-    };
+        },
 
         /**
          * Initialize the open/close toggling of menu entries
          */
-    const initMenuHandling = function () {
+        initMenuHandling = function () {
             $nav.on('click', 'a.nav', function (e) {
                 toggleNav(jQuery(this));
                 e.preventDefault();
             });
-    };
+        },
 
         /**
          * Make sure the content area is always as high as the sidebar
          */
-    const initContentMinHeight = function () {
+        initContentMinHeight = function () {
-        const $sidebar = jQuery('.page-wrapper').find('> .tools').find('.col-xs-12');
+            var $sidebar = jQuery('.page-wrapper').find('> .tools').find('.col-xs-12');
             if ($sidebar.length == 1) {
-            const num = parseFloat($sidebar.height());
+                var num = parseFloat($sidebar.height());
                 if (!isNaN(num)) {
                     jQuery('#dokuwiki__content').css('minHeight', num + 100);
                 }
             }
-    };
+        },
 
         /**
          * Initialize the sidebar handle behaviour
          */
-    const initSidebarToggling = function () {
+        initSidebarToggling = function () {
-        const $toggler = jQuery('.togglelink.page_main-content').find('a');
+            var $toggler = jQuery('.togglelink.page_main-content').find('a');
             $toggler.click(function (e) {
                 e.preventDefault();
                 if (jQuery('body').hasClass('wide-content')) {
@@ -136,27 +137,28 @@ jQuery(function () {
                     setWideContent();
                 }
             });
-    };
+        },
 
         /**
          * Show sidebar when accessing the search
          */
-    const initSearchToggling = function () {
+        initSearchToggling = function () {
             jQuery('.toggleSearch').find('a').click(function (e) {
                 setDefaultContent();
                 e.preventDefault();
                 jQuery('#qsearch__in').focus();
             });
 
-    };
+        },
 
         /**
          * Open and close the sidebar in mobile view
          */
-    const initMobileToggling = function () {
+        initMobileToggling = function () {
             jQuery('.menu-togglelink').find('a').click(function (e) {
                 e.preventDefault();
-            jQuery('#dokuwiki__aside').toggleClass('show');
+                var $body = jQuery('body');
+                $body.toggleClass('show-mobile-sidebar');
             });
         };
 

lang/en/lang.php

@@ -30,6 +30,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';
 

main.php

@@ -9,27 +9,17 @@
  * @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');
-
-
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
-/* conditional comments for IE8 / IE9 browser detection if needed */
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
 ?>
-<!--[if lt IE 9]> <html class="no-js lt-ie10 lt-ie9" lang="<?php echo $conf['lang'] ?>" dir="<?php echo $lang['direction'] ?>"> <![endif]-->
+<html class="edge no-js" lang="<?php echo $conf['lang'] ?>" dir="<?php echo $lang['direction'] ?>">
-<!--[if IE 9]> <html class="no-js lt-ie10 ie-9" lang="<?php echo $conf['lang'] ?>" dir="<?php echo $lang['direction'] ?>"> <![endif]-->
-<!--[if gt IE 9]><!--> <html class="edge no-js" lang="<?php echo $conf['lang'] ?>" dir="<?php echo $lang['direction'] ?>"> <!--<![endif]-->
 <head>
-
 <?php
-
-
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* meta and link relations */
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
@@ -40,18 +30,6 @@ $showFooter = $hasFooter && ($ACT === 'show');
 <?php
 
 
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
-/* conditional comments for HTML5 / media queries support in IE8 */
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
-?>
-<!--[if lt IE 9]>
-    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
-    <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
-<![endif]-->
-
-<?php
-
-
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* page title */
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
@@ -298,19 +276,13 @@ $classWideContent = ($ACT === "show") ? "": "wide-content ";
                                 tpl_content(false); /* the main content */
                             ?>
                             <div class="clearer"></div>
-                            <?php if($showFooter):
+                            <?php
-
+                            if($ACT == 'show') echo Template::getInstance()->getInclude(
-
+                                'footer',
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
+                                '<div class="wikipagefooter"><hr>',
-/* Page Include Hook: pagefooter.txt */
+                                '<div class="clearer"></div></div>'
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
+                            );
                             ?>
-                                <div class="wikipagefooter">
-                                    <hr>
-                                    <?php tpl_include_page('pagefooter', true, true) ?>
-                                    <div class="clearer"></div>
-                                </div>
-                            <?php endif; ?>
                         </div><!-- .main-content -->
 
 
@@ -363,7 +335,7 @@ $classWideContent = ($ACT === "show") ? "": "wide-content ";
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
 /* copyright */
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
-                            tpl_license('');
+                            tpl_license($img = false, $imgonly = false, $return = false, $wrap = false);
                             ?>
                         </p>
                     </div>

mediamanager.php

@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <?php
 /**
  * DokuWiki Media Manager Popup
@@ -10,13 +11,8 @@
 if (!defined('DOKU_INC')) die();
 header('X-UA-Compatible: IE=edge,chrome=1');
 
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
-/* conditional comments for IE8 / IE9 browser detection if needed */
-/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
 ?>
-<!--[if lt IE 9]> <html class="no-js lt-ie10 lt-ie9" lang="<?php echo $conf['lang'] ?>" dir="<?php echo $lang['direction'] ?>"> <![endif]-->
+<html class="edge no-js" lang="<?php echo $conf['lang'] ?>" dir="<?php echo $lang['direction'] ?>">
-<!--[if IE 9]> <html class="no-js lt-ie10 ie-9" lang="<?php echo $conf['lang'] ?>" dir="<?php echo $lang['direction'] ?>"> <![endif]-->
-<!--[if gt IE 9]><!--> <html class="edge no-js" lang="<?php echo $conf['lang'] ?>" dir="<?php echo $lang['direction'] ?>"> <!--<![endif]-->
 <head>
     <?php
 
@@ -29,20 +25,6 @@ header('X-UA-Compatible: IE=edge,chrome=1');
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <?php tpl_metaheaders() ?>
     <?php
-
-
-    /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
-    /* conditional comments for HTML5 / media queries support in IE8 */
-    /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
-    ?>
-    <!--[if lt IE 9]>
-    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
-    <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
-    <![endif]-->
-
-    <?php
-
-
     /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
     /* page title */
     /* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */

script.js

@@ -6,3 +6,4 @@
 /* DOKUWIKI:include js/meta-box.js */
 /* DOKUWIKI:include js/sidebar.js */
 /* DOKUWIKI:include js/breadcrumb.js */
+

style.ini

@@ -160,6 +160,8 @@ __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"

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>';
             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>';