karchnu/halogen-websocket-ipc-playzone
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Decorative navbar.

Browse Source
This commit is contained in:
Philippe Pittoli 2023-07-08 00:22:23 +02:00
parent caaefcca3e
commit ac9492b62e
2 changed files with 94 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/App/Container.purs
View File

@ -59,7 +59,8 @@ initialState _ = { token: Nothing
render :: forall m. MonadAff m => State -> H.ComponentHTML Action ChildSlots m render :: forall m. MonadAff m => State -> H.ComponentHTML Action ChildSlots m
render state render state
= HH.div_ $ = HH.div_ $
[ render_header [ render_nav
, render_header
, render_auth_form , render_auth_form
, render_newdomain_interface , render_newdomain_interface
, Bulma.columns_ [ Bulma.column_ [ render_logs ], Bulma.column_ [ render_auth_WS, render_dnsmanager_WS ] ] , Bulma.columns_ [ Bulma.column_ [ render_logs ], Bulma.column_ [ render_auth_WS, render_dnsmanager_WS ] ]
@ -67,6 +68,9 @@ render state
] ]
where where
render_nav :: forall monad. MonadAff monad => H.ComponentHTML Action ChildSlots monad
render_nav = Bulma.netlibre_navbar
render_header :: forall monad. MonadAff monad => H.ComponentHTML Action ChildSlots monad render_header :: forall monad. MonadAff monad => H.ComponentHTML Action ChildSlots monad
render_header = case state.token of render_header = case state.token of
Nothing -> Bulma.hero "net libre" "free domains" Nothing -> Bulma.hero "net libre" "free domains"

93
src/Bulma.purs
View File

@ -8,7 +8,10 @@ import DOM.HTML.Indexed as DHI
import Halogen.HTML.Properties as HP import Halogen.HTML.Properties as HP
import Halogen.HTML.Events as HE import Halogen.HTML.Events as HE
import Halogen.HTML.Properties.ARIA as ARIA
-- HTML PropName used with HP.prop -- HTML PropName used with HP.prop
import Halogen.HTML.Core (AttrName(..))
--import Halogen.HTML.Core (PropName(..)) --import Halogen.HTML.Core (PropName(..))
-- import Web.Event.Event (type_, Event, EventType(..)) -- import Web.Event.Event (type_, Event, EventType(..))
--import Web.UIEvent.MouseEvent (MouseEvent) --import Web.UIEvent.MouseEvent (MouseEvent)
@ -33,8 +36,10 @@ class_control :: Array (HH.ClassName)
class_control = [HH.ClassName "control" ] class_control = [HH.ClassName "control" ]
class_select :: Array (HH.ClassName) class_select :: Array (HH.ClassName)
class_select = [HH.ClassName "select" ] class_select = [HH.ClassName "select" ]
class_primary :: Array (HH.ClassName) class_is_primary :: Array (HH.ClassName)
class_primary = [HH.ClassName "is-primary" ] class_is_primary = [HH.ClassName "is-primary" ]
class_is_light :: Array (HH.ClassName)
class_is_light = [HH.ClassName "is-light" ]
columns :: forall (w :: Type) (i :: Type). columns :: forall (w :: Type) (i :: Type).
@ -370,7 +375,7 @@ new_domain_field inputaction text selectaction accepted_domains
, HP.placeholder "www" , HP.placeholder "www"
, HP.value text , HP.value text
, HP.type_ HP.InputText , HP.type_ HP.InputText
, HP.classes (class_primary <> class_input) , HP.classes (class_is_primary <> class_input)
] ]
] ]
, HH.p , HH.p
@ -424,7 +429,7 @@ option value = HH.option_ [HH.text value]
select :: forall w i. HH.Node DHI.HTMLselect w i select :: forall w i. HH.Node DHI.HTMLselect w i
select action options select action options
= HH.div [ HP.classes (class_select <> class_primary) ] = HH.div [ HP.classes (class_select <> class_is_primary) ]
[ HH.select action options] [ HH.select action options]
class_hero :: Array (HH.ClassName) class_hero :: Array (HH.ClassName)
@ -464,3 +469,83 @@ class_container = [HH.ClassName "container" ]
container :: forall w i. Array (HH.HTML w i) -> HH.HTML w i container :: forall w i. Array (HH.HTML w i) -> HH.HTML w i
container = HH.div [HP.classes (class_container <> class_is_info)] container = HH.div [HP.classes (class_container <> class_is_info)]
class_navbar :: Array (HH.ClassName)
class_navbar = [HH.ClassName "navbar"]
class_navbar_brand :: Array (HH.ClassName)
class_navbar_brand = [HH.ClassName "navbar-brand"]
class_navbar_burger :: Array (HH.ClassName)
class_navbar_burger = [HH.ClassName "navbar-burger"]
class_navbar_item :: Array (HH.ClassName)
class_navbar_item = [HH.ClassName "navbar-item"]
class_navbar_menu :: Array (HH.ClassName)
class_navbar_menu = [HH.ClassName "navbar-menu"]
class_navbar_start :: Array (HH.ClassName)
class_navbar_start = [HH.ClassName "navbar-start"]
class_navbar_end :: Array (HH.ClassName)
class_navbar_end = [HH.ClassName "navbar-end"]
class_navbar_link :: Array (HH.ClassName)
class_navbar_link = [HH.ClassName "navbar-link"]
class_navbar_dropdown :: Array (HH.ClassName)
class_navbar_dropdown = [HH.ClassName "navbar-dropdown"]
class_navbar_divider :: Array (HH.ClassName)
class_navbar_divider = [HH.ClassName "navbar-divider"]
data_target :: forall r i. String -> HP.IProp r i
data_target = HP.attr (AttrName "data-target")
class_has_dropdown :: Array (HH.ClassName)
class_has_dropdown = [HH.ClassName "has-dropdown"]
class_is_hoverable :: Array (HH.ClassName)
class_is_hoverable = [HH.ClassName "is-hoverable"]
class_buttons :: Array (HH.ClassName)
class_buttons = [HH.ClassName "buttons"]
--netlibre_navbar ::
netlibre_navbar =
HH.nav [HP.classes class_navbar, ARIA.label "main navigation", ARIA.role "navigation" ]
[ HH.div [HP.classes class_navbar_brand]
[ HH.a [HP.classes class_navbar_item, HP.href "/"]
[HH.img [HP.src "/logo.jpeg", HP.width 112, HP.height 28]]
, HH.a [HP.classes class_navbar_burger, ARIA.label "menu", ARIA.expanded "false", data_target "navbarBasicExample" ]
[ HH.span [ARIA.hidden "true"] []
, HH.span [ARIA.hidden "true"] []
, HH.span [ARIA.hidden "true"] []
]
]
, HH.div [HP.id "navbarBasicExample", HP.classes class_navbar_menu]
[ HH.div [HP.classes class_navbar_start]
[ HH.a [HP.classes class_navbar_item]
[HH.text "Home"]
, HH.a [HP.classes class_navbar_item]
[HH.text "My Domains"]
, HH.div [HP.classes (class_navbar_item <> class_has_dropdown <> class_is_hoverable)]
[ HH.a [HP.classes class_navbar_link]
[HH.text "List of something"]
, HH.div [HP.classes class_navbar_dropdown]
[ HH.a [HP.classes class_navbar_item]
[HH.text "something 1"]
, HH.a [HP.classes class_navbar_item]
[HH.text "something 2"]
, HH.a [HP.classes class_navbar_item]
[HH.text "something 3"]
, HH.hr [HP.classes class_navbar_divider]
, HH.a [HP.classes class_navbar_item]
[HH.text "something 4"]
]
]
]
, HH.div [HP.classes class_navbar_end]
[ HH.div [HP.classes class_navbar_item]
[ HH.div [HP.classes class_buttons]
[ HH.a [HP.classes (class_button <> class_is_primary)]
[HH.strong [] [HH.text "SIGN UP NOW"]]
, HH.a [HP.classes (class_button <> class_is_light)]
[HH.text "STUFF"]
]
]
]
]
]