Nav-Drawer Button Position

Feature: michael-milette#19 -Changed the position of Nav-Drawer button -Added a new Chevron icon/button to close Nav-Drawer -Nav-Drawer can be closed using any of the two icons/buttons
sameer-ah · Sep 23, 2021 · 4f6396e · 4f6396e
1 parent 2f30c46
commit 4f6396e
Show file tree

Hide file tree

Showing 6 changed files with 20 additions and 6 deletions.
diff --git a/classes/output/core_renderer.php b/classes/output/core_renderer.php
@@ -111,6 +111,7 @@ public function full_header() {
         $header->searchurl = $_PAGE['searchurl'];
         $header->searchsettings = $_PAGE['searchsettings'];
         $header->sitename = $_PAGE['sitename'];
+        $header->shownavdrawer = $_PAGE['shownavdrawer'];
         $header->navdraweropen = $_PAGE['navdraweropen'];
         $header->showaccountsettings = $_PAGE['showaccountsettings'];
         $header->loggedin = $_PAGE['loggedin'];

diff --git a/style/wet-boew-moodle.css b/style/wet-boew-moodle.css
@@ -1643,3 +1643,13 @@ body.path-mod-feedback div.feedback-item-label span.d-inline-block {
     height: 2.7rem;
     font-size: 1.4rem
 }
+
+.nav-drawer-chevron-button{
+    top:0; 
+    left:250px;
+    position: absolute;
+}
+
+.nav-drawer-chevron-button:hover{
+    cursor: pointer;
+}
diff --git a/templates/footer.mustache b/templates/footer.mustache
@@ -86,6 +86,6 @@
 
         <div id="level-access-access-assistant-highlight-container" data-ae_invis="true"></div>
         {{#shownavdrawer}}
-        {{> theme_boost/nav-drawer }}
+        {{> theme_gcweb/nav-drawer }}
         {{/shownavdrawer}}
         {{{ output.standard_end_of_body_html }}}
diff --git a/templates/header.mustache b/templates/header.mustache
@@ -61,6 +61,11 @@
             <div class="container">
                 <div class="row">
                     <section class="col-sm-7 col-xs-12">
+                        {{#shownavdrawer}}
+                            <div data-region="drawer-toggle" class="d-inline-block mr-3">
+                                <button aria-expanded="{{#navdraweropen}}true{{/navdraweropen}}{{^navdraweropen}}false{{/navdraweropen}}" aria-controls="nav-drawer" type="button" class="btn mr-1 mb-3 btn-light bg-gray" data-action="toggle-drawer" data-side="left" data-preference="drawer-open-nav">{{#pix}}i/menubars{{/pix}}<span class="sr-only">{{#str}}sidepanel, core{{/str}}</span></button>
+                            </div>
+                        {{/shownavdrawer}}
                         <h2 class="wb-inv">{{{ sitename }}}</h2>
                        <a class="app-name" href="{{{ wwwroot }}}">{{{ sitename }}}</a>
                     </section>

diff --git a/templates/nav-drawer.mustache b/templates/nav-drawer.mustache
@@ -18,5 +18,8 @@
     @template theme_gcweb/nav-drawer
 }}
 <div id="nav-drawer" data-region="drawer" class="d-print-none moodle-has-zindex {{^navdraweropen}}closed{{/navdraweropen}}" aria-hidden="{{#navdraweropen}}false{{/navdraweropen}}{{^navdraweropen}}true{{/navdraweropen}}" tabindex="-1">
+    <div data-region="drawer-toggle" class="icon-size-5 nav-drawer-chevron-button" aria-expanded="{{#navdraweropen}}true{{/navdraweropen}}{{^navdraweropen}}false{{/navdraweropen}}" aria-controls="nav-drawer" data-action="toggle-drawer" data-side="left" data-preference="drawer-open-nav">
+        <i class="icon fa fa-angle-double-left"></i>    
+    </div>
     {{> theme_boost/flat_navigation }}
 </div>
diff --git a/templates/navbar.mustache b/templates/navbar.mustache
@@ -21,9 +21,4 @@
 }}
                     <div id="navbar" class="context-header-settings-menu">
                         {{{ output.settings_menu }}} {{{ pagebutton }}}
-                        {{#shownavdrawer}}
-                        <div data-region="drawer-toggle" class="d-inline-block mr-3">
-                            <button aria-expanded="{{#navdraweropen}}true{{/navdraweropen}}{{^navdraweropen}}false{{/navdraweropen}}" aria-controls="nav-drawer" type="button" class="btn nav-link float-sm-right mr-1 btn-light bg-gray" data-action="toggle-drawer" data-side="left" data-preference="drawer-open-nav">{{#pix}}i/menubars{{/pix}}<span class="sr-only">{{#str}}sidepanel, core{{/str}}</span></button>
-                        </div>
-                        {{/shownavdrawer}}
                     </div>