Simplify navbar implementation - this will also allow seamlessly adding a third, centred nav if desired
This commit is contained in:
parent
526e105b8b
commit
92373fcfa5
3 changed files with 8 additions and 10 deletions
|
@ -97,8 +97,7 @@ instance Yesod App where
|
||||||
-- Get the breadcrumbs, as defined in the YesodBreadcrumbs instance.
|
-- Get the breadcrumbs, as defined in the YesodBreadcrumbs instance.
|
||||||
(title, parents) <- breadcrumbs
|
(title, parents) <- breadcrumbs
|
||||||
|
|
||||||
let navbarLeftMenuItems = leftMenuItems muser
|
let navbars = [leftMenuItems, rightMenuItems] <*> [muser]
|
||||||
navbarRightMenuItems = rightMenuItems muser
|
|
||||||
|
|
||||||
-- We break up the default layout into two components:
|
-- We break up the default layout into two components:
|
||||||
-- default-layout is the contents of the body tag, and
|
-- default-layout is the contents of the body tag, and
|
||||||
|
|
|
@ -15,6 +15,8 @@ body
|
||||||
padding-bottom: 1em
|
padding-bottom: 1em
|
||||||
display: flex
|
display: flex
|
||||||
justify-content: space-evenly
|
justify-content: space-evenly
|
||||||
|
#navbar
|
||||||
|
justify-content: space-between
|
||||||
.breadcrumb
|
.breadcrumb
|
||||||
background-color: #404449
|
background-color: #404449
|
||||||
border-radius: 0
|
border-radius: 0
|
||||||
|
|
|
@ -6,15 +6,12 @@
|
||||||
<span .navbar-toggler-icon>
|
<span .navbar-toggler-icon>
|
||||||
|
|
||||||
<div #navbar .collapse.navbar-collapse>
|
<div #navbar .collapse.navbar-collapse>
|
||||||
<ul .navbar-nav.mr-auto>
|
$forall bar <- navbars
|
||||||
$forall MenuItem label route <- navbarLeftMenuItems
|
<ul .navbar-nav>
|
||||||
<li .nav-item :Just route == mcurrentRoute:.active>
|
$forall MenuItem label route <- bar
|
||||||
<a .nav-link href=@{route}>#{label}
|
<li .nav-item :Just route == mcurrentRoute:.active>
|
||||||
|
<a .nav-link href=@{route}>#{label}
|
||||||
|
|
||||||
<ul .navbar-nav>
|
|
||||||
$forall MenuItem label route <- navbarRightMenuItems
|
|
||||||
<li .nav-item :Just route == mcurrentRoute:.active>
|
|
||||||
<a .nav-link href=@{route}>#{label}
|
|
||||||
$if not $ null parents
|
$if not $ null parents
|
||||||
<ul .breadcrumb>
|
<ul .breadcrumb>
|
||||||
$forall bc <- parents
|
$forall bc <- parents
|
||||||
|
|
Loading…
Reference in a new issue