From 92b26dce68dfb209710cf91b086fa651c1e33d1e Mon Sep 17 00:00:00 2001
From: DmitriyB <dimasik_burdin@inbox.ru>
Date: Thu, 11 Aug 2022 18:47:36 +0500
Subject: [PATCH] fix animation for add mobile part

---
 src/components/mainScreen/mobileAddPart/mobileAddPart.css | 3 +++
 src/components/mainScreen/toolbar/buttonContainer.tsx     | 8 +++++---
 2 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/components/mainScreen/mobileAddPart/mobileAddPart.css b/src/components/mainScreen/mobileAddPart/mobileAddPart.css
index 72fe858..6bf87cd 100644
--- a/src/components/mainScreen/mobileAddPart/mobileAddPart.css
+++ b/src/components/mainScreen/mobileAddPart/mobileAddPart.css
@@ -317,17 +317,20 @@
 
 
 .show-mobile-users-enter {
+    position: absolute;
     transform: translateX(-15%);
     opacity: 0;
 }
 
 .show-mobile-users-enter-active {
+    position: relative;
     transform: translateX(0);
     opacity: 1;
     transition: .3s;
 }
 
 .show-mobile-users-exit {
+    position: absolute;
     transform: translateX(0);
     opacity: 1;
 }
diff --git a/src/components/mainScreen/toolbar/buttonContainer.tsx b/src/components/mainScreen/toolbar/buttonContainer.tsx
index 97e339d..132902f 100644
--- a/src/components/mainScreen/toolbar/buttonContainer.tsx
+++ b/src/components/mainScreen/toolbar/buttonContainer.tsx
@@ -1,4 +1,5 @@
-import React, { useState } from "react";
+import React, { useContext, useState } from "react";
+import { ContextWindowHeight } from "../../contextWindowHeight";
 import { ToolbarButton } from "./toolbarButton";
 import { BorderLine } from "./toolbarButtonContainerBorderLine";
 import { TypeToolbarButtons } from "./typeButtons";
@@ -17,6 +18,7 @@ type TProps = {
 
 export const ButtonContainer:React.FC<TProps> = React.memo((props) => { 
     const [openedAddButtons, setOpenedAddButtons] = useState<string>('');
+    const windowHeight = useContext(ContextWindowHeight);
     
     return <div className="toolbar-button-container">
         <BorderLine />
@@ -36,7 +38,7 @@ export const ButtonContainer:React.FC<TProps> = React.memo((props) => {
                         // if(openedAddButtons === button.type + index + 'areacont') {
                         //     setOpenedAddButtons('');
                         // } setOpenedAddButtons(button.type + index + 'areacont')
-                        // button.onClick()
+                        button.onClick()
                     }} 
                     type={button.type} 
                     isNotification={button?.isNotification}
@@ -46,7 +48,7 @@ export const ButtonContainer:React.FC<TProps> = React.memo((props) => {
                     isSelected={button?.isSelected}
                 />
                 {
-                    button.type.includes('user') ?
+                    button.type.includes('user') && windowHeight > 700 ?
                     <div className={`toolbar-open-add-button-container ${openedAddButtons === button.type + index + 'areacont' ? 'show' : ''}`}>
                         <ToolbarButton
                             // key={button.type + index}