Skip to content

Commit

Permalink
SWED-2230 revert website topbar back to initial with experimental
Browse files Browse the repository at this point in the history
  • Loading branch information
goldenraphti committed Sep 13, 2023
1 parent 08b8426 commit dde4d97
Showing 2 changed files with 62 additions and 48 deletions.
88 changes: 54 additions & 34 deletions src/App/AppHeader/index.js
Original file line number Diff line number Diff line change
@@ -19,41 +19,61 @@ const basename = process.env.basename;
const AppHeader = () => (
<header
id="dg-topbar"
className="topbar topbar-max-md-sticky d-md-flex d-lg-none designguide-header"
className="topbar d-md-flex d-lg-none designguide-header experimental"
>
<button
type="button"
className="topbar-btn"
aria-label="Open menu"
aria-haspopup="menu"
aria-expanded="false"
aria-controls="topbar-nav"
>
<i className="material-icons topbar-btn-icon">menu</i>
</button>
<button type="button" className="topbar-close" aria-label="Close menu">
<i className="material-icons topbar-btn-icon">close</i>
</button>
<a href="/" className="topbar-logo">
{"\n"}
<img
src={`${basename}img/logo/${brand}-logo-v.svg`}
alt={`${brand}-logo`}
className="logotype-vertical logotype-xs"
/>{" "}
{"\n"}
</a>
<SearchBox mobile className={"search-expander"} />
<nav className="topbar-nav">
<div className="topbar-link-container">
<SelectPanel
id="doc-topbar-sidebar"
topbarId="dg-topbar"
topbarSidebar={true}
routes={routes}
/>
</div>
</nav>
<div className="nav-container">
<a href="/" className="topbar-logo">
{"\n"}
<img
src={`${basename}img/logo/${brand}-logo-h.svg`}
alt={`${brand}-logo`}
className="logotype-vertical logotype-xs"
/>{" "}
{"\n"}
</a>
<nav className="topbar-nav">
<div className="topbar-link-container">
<div className="topbar-modal-header">
<button
type="button"
className="topbar-close btn btn-icon btn-xs"
aria-label="Close menu"
title="Close menu"
>
<i className="material-icons-outlined" aria-hidden="true">
close
</i>
</button>
</div>
<div className="topbar-modal-body">
<SelectPanel
id="doc-topbar-sidebar"
topbarId="dg-topbar"
topbarSidebar={true}
routes={routes}
/>
</div>
<div className="topbar-modal-footer">
<button className="btn btn-secondary btn-sm" type="button">
<i className="material-icons-outlined" aria-hidden="true">
exit_to_app
</i>
<span>Log out</span>
</button>
</div>
</div>
</nav>
<button
type="button"
className="topbar-btn"
aria-label="Open menu"
aria-haspopup="menu"
aria-expanded="false"
aria-controls="topbar-nav"
>
<i className="material-icons topbar-btn-icon">menu</i>
</button>
</div>
</header>
);

22 changes: 8 additions & 14 deletions src/App/utils/SelectPanel/index.js
Original file line number Diff line number Diff line change
@@ -93,20 +93,14 @@ const SelectPanel = ({ id, routes, topbarId, topbarSidebar }) => {
<>
{topbarId ? (
// mobile & tablet hamburger menu sidebar
<div id={id} className="sidebar dg-sidebar">
<nav className="sidebar-nav">
<ul className="main-nav-ul">
{routes.map((route, i) => (
<MobileNavGroup
sidebarId={id}
key={`nav_group_${i}`}
route={route}
index={i}
/>
))}
</ul>
</nav>
</div>
routes.map((route, i) => (
<MobileNavGroup
sidebarId={id}
key={`nav_group_${i}`}
route={route}
index={i}
/>
))
) : (
// desktop
<div id={id} className="sidebar">

0 comments on commit dde4d97

Please sign in to comment.