Merge pull request #421 from AppQuality/develop

fix: Use isExpanded style for panel container
AppQuality · Oct 7, 2024 · 471f7a6 · 471f7a6
2 parents bb43d83 + a40b832
commit 471f7a6
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 2 deletions.
diff --git a/src/stories/navigation/nav/nav-item/accordionItem.tsx b/src/stories/navigation/nav/nav-item/accordionItem.tsx
@@ -14,6 +14,10 @@ const NavAccordionItem = styled(Accordion)<AccordionArgs & NavItemArgs>`
   order: 1;
   margin: ${({ theme }) => theme.space.xs} 0;
   padding-left: 8.5px;
+  .panelContainer {
+    ${sidebarNavItemExpanded}
+    ${(props) => !props.isExpanded && sidebarNavItemHidden}
+  }
 `;
 
 const AccordionItemHeader = styled(Accordion.Header)<

diff --git a/src/stories/theme/utils.ts b/src/stories/theme/utils.ts
@@ -1,7 +1,7 @@
 import { getColor as zendeskGetColor } from "@zendeskgarden/react-theming";
 import { DefaultTheme, css } from "styled-components";
-import { theme as unguessTheme } from ".";
 import UAParser from "ua-parser-js";
+import { theme as unguessTheme } from ".";
 
 declare type Hue = Record<number | string, string> | string;
 declare type GetColorFunction = (hue: Hue, shade?: number, theme?: DefaultTheme, transparency?: number) => string | undefined;
@@ -39,7 +39,6 @@ export const opacityTransition = css`
 export const sidebarNavItemExpanded = css`
   visibility: visible;
   opacity: 1;
-  // transition: opacity 0.2s ease;
 `;
 export const sidebarNavItemHidden = css`
   visibility: hidden;