From 0e29dc5df60f54a3de10f159271c12ee27a01ecd Mon Sep 17 00:00:00 2001 From: Philippe Pittoli Date: Sat, 8 Jul 2023 04:17:13 +0200 Subject: [PATCH] Navbar in a separate file. --- src/App/Container.purs | 4 ++- src/App/Nav.purs | 57 ++++++++++++++++++++++++++++++++++++++++++ src/Bulma.purs | 49 ------------------------------------ 3 files changed, 60 insertions(+), 50 deletions(-) create mode 100644 src/App/Nav.purs diff --git a/src/App/Container.purs b/src/App/Container.purs index 59838c3..f8e922d 100644 --- a/src/App/Container.purs +++ b/src/App/Container.purs @@ -4,6 +4,8 @@ import Prelude import Bulma as Bulma +import App.Nav as Nav + import Data.Maybe (Maybe(..)) import Data.Tuple (Tuple(..)) import App.AuthenticationForm as AF @@ -69,7 +71,7 @@ render state where render_nav :: forall monad. MonadAff monad => H.ComponentHTML Action ChildSlots monad - render_nav = Bulma.netlibre_navbar + render_nav = Nav.netlibre_navbar render_header :: forall monad. MonadAff monad => H.ComponentHTML Action ChildSlots monad render_header = case state.token of diff --git a/src/App/Nav.purs b/src/App/Nav.purs new file mode 100644 index 0000000..071e003 --- /dev/null +++ b/src/App/Nav.purs @@ -0,0 +1,57 @@ +module App.Nav where + +import Prelude +import CSSClasses as C +import Halogen.HTML as HH +import Halogen.HTML.Properties as HP +import Halogen.HTML.Properties.ARIA as ARIA +import Bulma as Bulma + +netlibre_navbar :: forall w i. HH.HTML w i +netlibre_navbar = + main_nav + [ nav_brand [ logo, burger_menu ] + , nav_menu + [ navbar_start + [ link_domains + , dropdown "List of something" + [ dropdown_element "something 1" + , dropdown_element "something 2" + , dropdown_element "something 3" + , dropdown_separator + , dropdown_element "something 4" + ] + ] + , navbar_end + [ navbar_item + [ HH.div [HP.classes C.buttons] + [ nav_button_strong "Register" + , nav_button_light "Login" + ] + ] + ] + ] + ] + where + main_nav = HH.nav [ HP.classes C.navbar, ARIA.label "main navigation", ARIA.role "navigation" ] + logo = HH.a [HP.classes C.navbar_item, HP.href "/"] [HH.img [HP.src "/logo.jpeg", HP.width 112, HP.height 28]] + burger_menu + = HH.a [HP.classes C.navbar_burger, ARIA.label "menu", ARIA.expanded "false", Bulma.data_target "navbarExample" ] + [ HH.span [ARIA.hidden "true"] [] + , HH.span [ARIA.hidden "true"] [] + , HH.span [ARIA.hidden "true"] [] + ] + nav_brand = HH.div [HP.classes C.navbar_brand] + nav_menu = HH.div [HP.id "navbarExample", HP.classes C.navbar_menu] + navbar_start = HH.div [HP.classes C.navbar_start] + navbar_end = HH.div [HP.classes C.navbar_end] + link_domains = HH.a [HP.classes C.navbar_item] [HH.text "My Domains"] + dropdown title dropdown_elements + = HH.div [HP.classes (C.navbar_item <> C.has_dropdown <> C.is_hoverable)] + [ dropdown_title title, HH.div [HP.classes C.navbar_dropdown] dropdown_elements ] + dropdown_title str = HH.a [HP.classes C.navbar_link] [HH.text str] + dropdown_element str = HH.a [HP.classes C.navbar_item] [HH.text str] + dropdown_separator = HH.hr [HP.classes C.navbar_divider] + nav_button_strong str = HH.a [HP.classes (C.button <> C.is_primary)] [HH.strong [] [HH.text str]] + nav_button_light str = HH.a [HP.classes (C.button <> C.is_light)] [HH.text str] + navbar_item = HH.div [HP.classes C.navbar_item] diff --git a/src/Bulma.purs b/src/Bulma.purs index cf0d95c..00e155e 100644 --- a/src/Bulma.purs +++ b/src/Bulma.purs @@ -8,7 +8,6 @@ import DOM.HTML.Indexed as DHI import Halogen.HTML.Properties as HP import Halogen.HTML.Events as HE -import Halogen.HTML.Properties.ARIA as ARIA import CSSClasses as C -- HTML PropName used with HP.prop @@ -420,51 +419,3 @@ modal_domain_delete domain = , HH.strong_ [ HH.text "irreversible" ] , HH.text "." ] - -netlibre_navbar :: forall w i. HH.HTML w i -netlibre_navbar = - main_nav - [ nav_brand [ logo, burger_menu ] - , nav_menu - [ navbar_start - [ link_domains - , dropdown "List of something" - [ dropdown_element "something 1" - , dropdown_element "something 2" - , dropdown_element "something 3" - , dropdown_separator - , dropdown_element "something 4" - ] - ] - , navbar_end - [ navbar_item - [ HH.div [HP.classes C.buttons] - [ nav_button_strong "Register" - , nav_button_light "Login" - ] - ] - ] - ] - ] - where - main_nav = HH.nav [ HP.classes C.navbar, ARIA.label "main navigation", ARIA.role "navigation" ] - logo = HH.a [HP.classes C.navbar_item, HP.href "/"] [HH.img [HP.src "/logo.jpeg", HP.width 112, HP.height 28]] - burger_menu = HH.a [HP.classes C.navbar_burger, ARIA.label "menu", ARIA.expanded "false", data_target "navbarExample" ] - [ HH.span [ARIA.hidden "true"] [] - , HH.span [ARIA.hidden "true"] [] - , HH.span [ARIA.hidden "true"] [] - ] - nav_brand = HH.div [HP.classes C.navbar_brand] - nav_menu = HH.div [HP.id "navbarExample", HP.classes C.navbar_menu] - navbar_start = HH.div [HP.classes C.navbar_start] - navbar_end = HH.div [HP.classes C.navbar_end] - link_domains = HH.a [HP.classes C.navbar_item] [HH.text "My Domains"] - dropdown title dropdown_elements - = HH.div [HP.classes (C.navbar_item <> C.has_dropdown <> C.is_hoverable)] - [ dropdown_title title, HH.div [HP.classes C.navbar_dropdown] dropdown_elements ] - dropdown_title str = HH.a [HP.classes C.navbar_link] [HH.text str] - dropdown_element str = HH.a [HP.classes C.navbar_item] [HH.text str] - dropdown_separator = HH.hr [HP.classes C.navbar_divider] - nav_button_strong str = HH.a [HP.classes (C.button <> C.is_primary)] [HH.strong [] [HH.text str]] - nav_button_light str = HH.a [HP.classes (C.button <> C.is_light)] [HH.text str] - navbar_item = HH.div [HP.classes C.navbar_item]