Skip to content

Fixing problems with NavTab inside website #1820

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Feb 15, 2024
Merged

Fixing problems with NavTab inside website #1820

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
f7c306e
Fixing problems with NavTab inside website
Mil4n0r Feb 12, 2024
a779237
Merge branch 'master' into Mil4n0r/navtab_width-fix
Mil4n0r Feb 13, 2024
f70392e
Moved Underline
Mil4n0r Feb 15, 2024
ccdf1ad
Merge branch 'master' into Mil4n0r/navtab_width-fix
Mil4n0r Feb 15, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion lib/src/nav-tabs/NavTabs.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -90,7 +90,6 @@ const Underline = styled.div`
width: 100%;
height: 2px;
background-color: ${(props) => props.theme.dividerColor};
z-index: -1;
`;

DxcNavTabs.Tab = DxcTab;
Expand Down
2 changes: 1 addition & 1 deletion lib/src/nav-tabs/Tab.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -93,7 +93,7 @@ const TabContainer = styled.div<{ active: TabProps["active"] }>`
align-items: stretch;
border-bottom: 2px solid ${(props) => (props.active ? props.theme.selectedUnderlineColor : 'transparent')};
padding: 0.5rem;

z-index: 1;
svg {
color: ${(props) => props.theme.unselectedIconColor};
}
Expand Down
12 changes: 0 additions & 12 deletions website/screens/common/TabsPageLayout.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,6 @@ const TabsPageLayout = ({ tabs }: TabsPageLayoutProps) => {
const router = useRouter();

return (
<TabsContainer>
<DxcNavTabs>
{tabs.map((tab, index) => (
<Link key={index} href={tab.path} passHref legacyBehavior>
Expand All @@ -22,18 +21,7 @@ const TabsPageLayout = ({ tabs }: TabsPageLayoutProps) => {
</Link>
))}
</DxcNavTabs>
</TabsContainer>
);
};

const TabsContainer = styled.div`
display: grid;
grid-template-columns: minmax(0, min-content) 1fr;
overflow-x: auto;
`;

const Divider = styled.span`
border-bottom: 2px solid #bfbfbf;
`;

export default TabsPageLayout;