reorder mobile bottom nav to be more intuitive

components/nav/mobile/footer.js

@@ -52,11 +52,11 @@ export default function BottomBar ({ sub }) {
       <div className={classNames(styles.footer, styles.footerPadding)}>
         <Navbar className='container px-0'>
           <Nav className={styles.footerNav}>
-            <Offcanvas me={me} {...props} />
-            <SearchItem {...props} />
             <Brand />
-            <NavNotifications />
+            <SearchItem {...props} />
             <PostItem {...props} className='btn-sm' />
+            <NavNotifications />
+            <Offcanvas me={me} {...props} />
           </Nav>
         </Navbar>
       </div>

components/nav/mobile/offcanvas.js

@@ -28,7 +28,7 @@ export default function OffCanvas ({ me, dropNavKey }) {
     <>
       <MeImage onClick={handleShow} />
 
-      <Offcanvas style={{ maxWidth: '250px', zIndex: '10000' }} show={show} onHide={handleClose} placement='start'>
+      <Offcanvas style={{ maxWidth: '250px', zIndex: '10000' }} show={show} onHide={handleClose} placement='end'>
         <Offcanvas.Header closeButton>
           <Offcanvas.Title><NavWalletSummary /></Offcanvas.Title>
         </Offcanvas.Header>