diff --git a/swh/web/assets/src/bundles/browse/browse-utils.js b/swh/web/assets/src/bundles/browse/browse-utils.js
index d7be7839b1f71f098d96d03f2e35aea2ee4c5e3d..3cce9854a8bfa8366497396bd2e4fc71fb2e2b82 100644
--- a/swh/web/assets/src/bundles/browse/browse-utils.js
+++ b/swh/web/assets/src/bundles/browse/browse-utils.js
@@ -5,6 +5,8 @@
  * See top-level LICENSE file for more information
  */
 
+import {BREAKPOINT_SM} from 'utils/constants';
+
 $(document).ready(() => {
 
   $('.dropdown-submenu a.dropdown-item').on('click', e => {
@@ -24,7 +26,7 @@ $(document).ready(() => {
     html: true,
     placement: function() {
       const width = $(window).width();
-      if (width < 768) {
+      if (width < BREAKPOINT_SM) {
         return 'top';
       } else {
         return 'right';
diff --git a/swh/web/assets/src/bundles/webapp/webapp-utils.js b/swh/web/assets/src/bundles/webapp/webapp-utils.js
index 50f2d5ed84487d13723e77e18e6480fc55cd73ef..340d9d3bc4eb924da25ae3f8983bbc58c349e184 100644
--- a/swh/web/assets/src/bundles/webapp/webapp-utils.js
+++ b/swh/web/assets/src/bundles/webapp/webapp-utils.js
@@ -1,6 +1,7 @@
 import objectFitImages from 'object-fit-images';
 import {Layout} from 'admin-lte';
 import {selectText} from 'utils/functions';
+import {BREAKPOINT_MD} from 'utils/constants';
 
 let collapseSidebar = false;
 let previousSidebarState = localStorage.getItem('swh-sidebar-collapsed');
@@ -23,6 +24,11 @@ Layout.prototype.fixLayoutHeight = () => {
 };
 
 $(document).on('DOMContentLoaded', () => {
+  // set state to collapsed on smaller devices
+  if ($(window).width() < BREAKPOINT_MD) {
+    collapseSidebar = true;
+  }
+
   // restore previous sidebar state (collapsed/expanded)
   if (collapseSidebar) {
     // hack to avoid animated transition for collapsing sidebar
@@ -42,7 +48,7 @@ $(document).on('DOMContentLoaded', () => {
 });
 
 $(document).on('collapsed.lte.pushmenu', event => {
-  if ($('body').width() > 980) {
+  if ($('body').width() >= BREAKPOINT_MD) {
     $('.swh-words-logo-swh').css('visibility', 'visible');
   }
 });
@@ -71,7 +77,7 @@ $(document).ready(() => {
   ensureNoFooterOverflow();
   $(window).resize(function() {
     ensureNoFooterOverflow();
-    if ($('body').hasClass('sidebar-collapse') && $('body').width() > 980) {
+    if ($('body').hasClass('sidebar-collapse') && $('body').width() >= BREAKPOINT_MD) {
       $('.swh-words-logo-swh').css('visibility', 'visible');
     }
   });
diff --git a/swh/web/assets/src/utils/constants.js b/swh/web/assets/src/utils/constants.js
new file mode 100644
index 0000000000000000000000000000000000000000..166e1dc1136512a0266483f96353b31a7d96005a
--- /dev/null
+++ b/swh/web/assets/src/utils/constants.js
@@ -0,0 +1,4 @@
+// Constants defining Bootstrap Breakpoints
+export const BREAKPOINT_SM = 768;
+export const BREAKPOINT_MD = 992;
+export const BREAKPOINT_LG = 1200;