diff --git a/frontend/src/metabase/nav/components/AppBar/AppBarLarge.styled.tsx b/frontend/src/metabase/nav/components/AppBar/AppBarLarge.styled.tsx index 7525ae552455408aca70768e5096386c454cba26..23b4aa5a3f05a5b7150a8b4658d730f8a5772ba1 100644 --- a/frontend/src/metabase/nav/components/AppBar/AppBarLarge.styled.tsx +++ b/frontend/src/metabase/nav/components/AppBar/AppBarLarge.styled.tsx @@ -49,16 +49,16 @@ export const AppBarRightContainer = styled.div` `; export interface AppBarInfoContainerProps { - isNavBarOpen?: boolean; + isVisible?: boolean; } export const AppBarInfoContainer = styled.div<AppBarInfoContainerProps>` display: flex; min-width: 0; - opacity: ${props => (props.isNavBarOpen ? 0 : 1)}; - visibility: ${props => (props.isNavBarOpen ? "hidden" : "visible")}; + opacity: ${props => (props.isVisible ? 1 : 0)}; + visibility: ${props => (props.isVisible ? "visible" : "hidden")}; transition: ${props => - props.isNavBarOpen ? `opacity 0.5s, visibility 0s` : `opacity 0.5s`}; + props.isVisible ? `opacity 0.5s` : `opacity 0.5s, visibility 0s`}; `; export const AppBarProfileLinkContainer = styled.div` diff --git a/frontend/src/metabase/nav/components/AppBar/AppBarLarge.tsx b/frontend/src/metabase/nav/components/AppBar/AppBarLarge.tsx index 706507e7b500e4a4688f02b170d40f29c2d64fca..fae79bedc836afa43041b9e3a5d67a31f7492840 100644 --- a/frontend/src/metabase/nav/components/AppBar/AppBarLarge.tsx +++ b/frontend/src/metabase/nav/components/AppBar/AppBarLarge.tsx @@ -49,7 +49,9 @@ const AppBarLarge = ({ isToggleVisible={isNavBarVisible} onToggleClick={onToggleNavbar} /> - <AppBarInfoContainer isNavBarOpen={isNavBarOpen}> + <AppBarInfoContainer + isVisible={!isNavBarOpen || isQuestionLineageVisible} + > {isQuestionLineageVisible ? ( <QuestionLineage /> ) : isCollectionPathVisible ? (