Fix/UI issue (#946)

Co-authored-by: JimmFly <yangjinfei001@gmail.com>

apps/web/src/components/help-island/index.tsx

@@ -27,7 +27,9 @@ export const HelpIsland = ({
         setShowSpread(!spread);
       }}
     >
-      <StyledAnimateWrapper spread={spread}>
+      <StyledAnimateWrapper
+        style={{ height: spread ? `${showList.length * 44}px` : 0 }}
+      >
         {showList.includes('contact') && (
           <Tooltip content={t('Contact Us')} placement="left-end">
             <StyledIconWrapper

apps/web/src/components/help-island/style.ts

@@ -51,10 +51,7 @@ export const StyledIconWrapper = styled('div')(({ theme }) => {
   };
 });
 
-export const StyledAnimateWrapper = styled('div', {
-  shouldForwardProp: prop => prop !== 'spread',
-})<{ spread: boolean }>(({ spread }) => ({
-  height: spread ? '88px' : '0',
+export const StyledAnimateWrapper = styled('div')(() => ({
   transition: 'height 0.2s cubic-bezier(0, 0, 0.55, 1.6)',
   overflow: 'hidden',
 }));