1240: skipping hidden sidebar items (#1519)

iterative · Jul 1, 2020 · f7291d1 · f7291d1
1 parent 655f696
commit f7291d1
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 12 deletions.
diff --git a/src/components/Community/Section/index.tsx b/src/components/Community/Section/index.tsx
@@ -89,7 +89,9 @@ const Section: React.FC<ICommunitySection> = ({
       {background && <img className={styles.picture} src={background} alt="" />}
 
       {isTablet ? (
-        <Collapse isOpened={isContentVisible}>{children}</Collapse>
+        <span hidden={!isContentVisible}>
+          <Collapse isOpened={isContentVisible}>{children}</Collapse>
+        </span>
       ) : (
         children
       )}

diff --git a/src/components/Documentation/Layout/SidebarMenu/index.tsx b/src/components/Documentation/Layout/SidebarMenu/index.tsx
@@ -99,16 +99,18 @@ const SidebarMenuItem: React.FC<ISidebarMenuItemProps> = ({
     <>
       {parentElement}
       {children && (
-        <Collapse isOpened={!!isActive}>
-          {children.map(item => (
-            <SidebarMenuItem
-              key={item.path}
-              activePaths={activePaths}
-              onClick={onClick}
-              {...item}
-            />
-          ))}
-        </Collapse>
+        <span hidden={!isActive}>
+          <Collapse isOpened={!!isActive}>
+            {children.map(item => (
+              <SidebarMenuItem
+                key={item.path}
+                activePaths={activePaths}
+                onClick={onClick}
+                {...item}
+              />
+            ))}
+          </Collapse>
+        </span>
       )}
     </>
   )

diff --git a/src/components/Home/UseCases/CollapsibleText/index.tsx b/src/components/Home/UseCases/CollapsibleText/index.tsx
@@ -31,7 +31,9 @@ const CollapsibleText: React.FC<ICollapsibleTextProps> = ({
       tabIndex={0}
     >
       {header}
-      <Collapse isOpened={isOpened}>{children}</Collapse>
+      <span hidden={!isOpened}>
+        <Collapse isOpened={isOpened}>{children}</Collapse>
+      </span>
       {!isOpened && <div className={styles.moreText}>More...</div>}
     </div>
   )