Merge pull request #2791 from ethereum/dragbarfix

fixes dragbar handle

libs/remix-ui/app/src/lib/remix-app/components/dragbar/dragbar.tsx

@@ -26,15 +26,21 @@ const DragBar = (props: IRemixDragBarUi) => {
     initialWidth.current = props.refObject.current.clientWidth
     if (props.maximiseTrigger > 0) {
       const width = 0.4 * window.innerWidth
+      if (width > props.refObject.current.offsetWidth) {
         props.refObject.current.style.width = width + 'px'
+        setTimeout(() => {
           setDragBarPosX(offset + width)
+        }, 300)
+      }
     }
   }, [props.maximiseTrigger])
 
   useEffect(() => {
     if (props.maximiseTrigger > 0) {
       props.refObject.current.style.width = initialWidth.current + 'px'
+      setTimeout(() => {
         setDragBarPosX(offset + initialWidth.current)
+      }, 300)
     }
   }, [props.resetTrigger])
 
@@ -58,9 +64,12 @@ const DragBar = (props: IRemixDragBarUi) => {
       props.setHideStatus(true)
     } else {
       props.refObject.current.style.width = (data.x - offset) + 'px'
+      setTimeout(() => {
         props.setHideStatus(false)
         setDragBarPosX(offset + props.refObject.current.offsetWidth)
+      }, 300)
     }
+
   }
 
   function startDrag() {

libs/remix-ui/app/src/lib/remix-app/style/remix-app.css

@@ -32,7 +32,7 @@ pre {
   display            : flex;
   flex-direction     : row-reverse;
   width              : 320px;
-  transition         : width 1s;
+  transition         : width 0.25s;
 }
 
 .highlightcode       {