diff --git a/src/stories/navigation/nav/nav-item/accordionItem.tsx b/src/stories/navigation/nav/nav-item/accordionItem.tsx
index 47ce5456..2b21c52a 100644
--- 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
index 9d2e40c9..0123dd8d 100644
--- 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;