frio mobile: disable page scroll when aside is shown

diff --git a/view/theme/frio/css/style.css b/view/theme/frio/css/style.css
index 937e55042a73c86c0f1f6894cb7f456621496d8f..e787384eda6448b7a9d5fc11712467a3d427126e 100644 (file)
--- a/view/theme/frio/css/style.css
+++ b/view/theme/frio/css/style.css
@@ -127,6 +127,8 @@ code {
         opacity: 1;
     }
 
+    /* prevent page scroll when the aside is opened **/
+    body.aside-out { overflow: hidden; }
 }
 /*
 * standard page elements

diff --git a/view/theme/frio/js/theme.js b/view/theme/frio/js/theme.js
index a335fffbdb1d506bdef98ef4b3bcdd2c1c7b564c..047cce16b089f672c6d03ae6dfd70c16c1766fd2 100644 (file)
--- a/view/theme/frio/js/theme.js
+++ b/view/theme/frio/js/theme.js
@@ -338,6 +338,21 @@ $(document).ready(function(){
                        $(document.body).trigger("sticky_kit:recalc");
                });
        }
+
+       /*
+        * Add or remove "aside-out" class to body tag
+        * when the mobile aside is shown or hidden.
+        * The class is used in css to disable scroll in page when the aside
+        * is shown.
+        */
+       $("aside")
+               .on("shown.bs.offcanvas", function() {
+                       $("body").addClass("aside-out");
+               })
+               .on("hidden.bs.offcanvas", function() {
+                       $("body").removeClass("aside-out");
+               });
+
 });
 
 function openClose(theID) {