Skip to content

Commit

Permalink
refactor: Style back button in model navigation bar.
Browse files Browse the repository at this point in the history
mheggelund committed Feb 14, 2024
1 parent c316cc5 commit 7109223
Showing 2 changed files with 18 additions and 3 deletions.
Original file line number Diff line number Diff line change
@@ -11,6 +11,20 @@ export const StyledSidebarContent = styled(SideBar.Content)`
}
`;

export const StyledBackButton = styled(SideBar.Link)`
> p {
color: ${theme.light.primary.resting};
font-weight: bold;
}
> svg {
fill: ${theme.light.primary.resting};
}
&:hover {
background-color: ${theme.light.ui.background.light};
}
padding: 0 0 ${spacings.MEDIUM} ${spacings.SMALL};
`;
export const StyledSidebarLink = styled(SideBar.Link)`
&.activeTab {
background: transparent;
@@ -59,6 +73,7 @@ export const StyledAccordionItem = styled(SideBar.AccordionItem)`

export {
StyledAccordionItem as AccordionItem,
StyledBackButton as Back,
StyledSidebarContent as SidebarContent,
StyledSidebarLink as SidebarLink,
};
Original file line number Diff line number Diff line change
@@ -29,7 +29,7 @@ export const ModelNavigationBar = () => {
const path2 = tab[tab.length - 2];

const backItems: SidebarLinkProps = {
label: 'Back',
label: 'Back to models',
icon: BACK,
href: '/',
active: false,
@@ -88,13 +88,13 @@ export const ModelNavigationBar = () => {
return (
<SideBar open>
<Styled.SidebarContent>
<Styled.SidebarLink
<Styled.Back
label={backItems.label}
icon={backItems.icon}
onClick={() => {
navigate('/');
}}
></Styled.SidebarLink>
></Styled.Back>
<Styled.SidebarLink
className={menuItems.href === path && 'activeTab'}
label={menuItems.label}

0 comments on commit 7109223

Please sign in to comment.