diff --git a/src/routes/Library/Library.js b/src/routes/Library/Library.js
index 0503689c2..320af81dc 100644
--- a/src/routes/Library/Library.js
+++ b/src/routes/Library/Library.js
@@ -1,7 +1,7 @@
 const React = require('react');
 const PropTypes = require('prop-types');
 const classnames = require('classnames');
-const { Button, Multiselect, MainNavBar, MetaItem, useProfile } = require('stremio/common');
+const { Button, Multiselect, MainNavBars, MetaItem, useProfile } = require('stremio/common');
 const useLibrary = require('./useLibrary');
 const useSelectableInputs = require('./useSelectableInputs');
 const useItemOptions = require('./useItemOptions');
@@ -13,8 +13,7 @@ const Library = ({ urlParams }) => {
     const [typeSelect, sortPropSelect] = useSelectableInputs(library);
     const [options, optionOnSelect] = useItemOptions();
     return (
-        <div className={styles['library-container']}>
-            <MainNavBar className={styles['nav-bar']} route={'library'} />
+        <MainNavBars className={styles['library-container']} route={'library'}>
             <div className={styles['library-content']}>
                 {
                     profile.auth !== null && library.type_names.length > 0 ?
@@ -62,7 +61,7 @@ const Library = ({ urlParams }) => {
                                     </div>
                 }
             </div>
-        </div>
+        </MainNavBars>
     );
 };
 
diff --git a/src/routes/Library/styles.less b/src/routes/Library/styles.less
index b9c5f347b..a577f61f0 100644
--- a/src/routes/Library/styles.less
+++ b/src/routes/Library/styles.less
@@ -5,20 +5,13 @@
 }
 
 .library-container {
-    display: flex;
-    flex-direction: column;
     width: 100%;
     height: 100%;
     background-color: var(--color-background);
 
-    .nav-bar {
-        flex: none;
-        align-self: stretch;
-    }
-
     .library-content {
-        flex: 1;
-        align-self: stretch;
+        width: 100%;
+        height: 100%;
         display: flex;
         flex-direction: column;