Speed up animations throughout the panel

resources/scripts/components/elements/DropdownMenu.tsx

@@ -61,7 +61,7 @@ const DropdownMenu = ({ renderToggle, children }: Props) => {
     return (
         <div>
             {renderToggle(onClickHandler)}
-            <Fade timeout={250} in={visible} unmountOnExit>
+            <Fade timeout={150} in={visible} unmountOnExit>
                 <div
                     ref={menu}
                     onClick={e => {

resources/scripts/components/elements/InputSpinner.tsx

@@ -9,7 +9,7 @@ const InputSpinner = ({ visible, children }: { visible: boolean, children: React
             appear
             unmountOnExit
             in={visible}
-            timeout={250}
+            timeout={150}
         >
             <div css={tw`absolute right-0 h-full flex items-center justify-end pr-3`}>
                 <Spinner size={'small'}/>

resources/scripts/components/elements/Modal.tsx

@@ -62,7 +62,7 @@ const Modal: React.FC<Props> = ({ visible, appear, dismissable, showSpinnerOverl
     }, [ render ]);
 
     return (
-        <Fade timeout={250} appear={appear} in={render} unmountOnExit onExited={onDismissed}>
+        <Fade timeout={150} appear={appear} in={render} unmountOnExit onExited={onDismissed}>
             <ModalMask
                 onClick={e => {
                     if (isDismissable && closeOnBackground) {
@@ -87,7 +87,7 @@ const Modal: React.FC<Props> = ({ visible, appear, dismissable, showSpinnerOverl
                         <Spinner/>
                     </div>
                     }
-                    <div css={tw`bg-neutral-800 p-6 rounded shadow-md overflow-y-scroll transition-all duration-250`}>
+                    <div css={tw`bg-neutral-800 p-6 rounded shadow-md overflow-y-scroll transition-all duration-150`}>
                         {children}
                     </div>
                 </ModalContainer>

resources/scripts/components/elements/PageContentBlock.tsx

@@ -4,7 +4,7 @@ import { CSSTransition } from 'react-transition-group';
 import tw from 'twin.macro';
 
 const PageContentBlock: React.FC<{ className?: string }> = ({ children, className }) => (
-    <CSSTransition timeout={250} classNames={'fade'} appear in>
+    <CSSTransition timeout={150} classNames={'fade'} appear in>
         <>
             <ContentContainer css={tw`my-10`} className={className}>
                 {children}

resources/scripts/components/elements/ProgressBar.tsx

@@ -61,7 +61,7 @@ export default () => {
     return (
         <div className={'w-full fixed'} style={{ height: '2px' }}>
             <CSSTransition
-                timeout={250}
+                timeout={150}
                 appear
                 in={visible}
                 unmountOnExit