fixed sidebar z-indexes

src/components/profile/ProfileSidebarMenu/index.tsx

@@ -7,18 +7,22 @@ interface IProps {
   path: string;
 }
 
-const ProfileSidebarMenu: FC<IProps> = ({ path }) => (
+const ProfileSidebarMenu: FC<IProps> = ({ path }) => {
-  <div className={styles.wrap}>
+  const cleaned = path.replace(/\/$/, '');
-    <Link className={styles.row} to={`${path}/settings`}>
-      <Icon icon="settings" />
-      <span>Настройки</span>
-    </Link>
 
-    <div className={styles.row}>
+  return (
-      <Icon icon="messages" />
+    <div className={styles.wrap}>
-      <span>Сообщения</span>
+      <Link className={styles.row} to={`${cleaned}/settings`}>
+        <Icon icon="settings" />
+        <span>Настройки</span>
+      </Link>
+
+      <div className={styles.row}>
+        <Icon icon="messages" />
+        <span>Сообщения</span>
+      </div>
     </div>
-  </div>
+  );
-);
+};
 
 export { ProfileSidebarMenu };

src/containers/sidebars/SidebarWrapper/index.tsx

@@ -23,6 +23,7 @@ const SidebarWrapper: FC<IProps> = ({ children, onClose }) => {
   return createPortal(
     <div className={styles.wrapper} ref={ref}>
       <div className={styles.clicker} onClick={onClose} />
+
       {children}
     </div>,
     document.body

src/containers/sidebars/SidebarWrapper/styles.module.scss

@@ -20,19 +20,11 @@
   overflow: hidden;
   animation: appear 0.25s forwards;
 
-  @include sidebar
+  @include sidebar;
-}
 
-.content {
+  & > * {
-  height: 100%;
+    z-index: 4;
-  overflow: auto;
+  }
-  display: flex;
-  align-items: center;
-  justify-content: flex-end;
-  animation: slideIn 0.5s 0.1s forwards;
-  transform: translate(100%, 0);
-  position: relative;
-  z-index: 2;
 }
 
 .clicker {