diff --git a/src/App/Container.purs b/src/App/Container.purs index 59838c3..d8791f6 100644 --- a/src/App/Container.purs +++ b/src/App/Container.purs @@ -60,6 +60,7 @@ render :: forall m. MonadAff m => State -> H.ComponentHTML Action ChildSlots m render state = HH.div_ $ [ render_nav + , Bulma.modal_domain_delete "blah.netlib.re" , render_header , render_auth_form , render_newdomain_interface diff --git a/src/App/DomainListInterface.purs b/src/App/DomainListInterface.purs index a040c28..e542a40 100644 --- a/src/App/DomainListInterface.purs +++ b/src/App/DomainListInterface.purs @@ -14,6 +14,7 @@ module App.DomainListInterface where import Prelude (Unit, bind, discard, map, otherwise, pure, ($), (/=), (<<<), (<>)) +import CSSClasses as CSSClasses import Data.Array as A import Data.ArrayBuffer.Types (ArrayBuffer) import Data.Either (Either(..)) @@ -27,7 +28,6 @@ import Halogen.HTML.Events as HHE import Halogen.HTML.Properties as HP import Web.Event.Event as Event import Web.Event.Event (Event) - import Bulma as Bulma import App.LogMessage @@ -123,13 +123,13 @@ render { accepted_domains, my_domains, newDomainForm, wsUp } = [ HH.button [ HP.type_ HP.ButtonSubmit , HE.onClick \_ -> RemoveDomain domain - , HP.classes Bulma.class_button + , HP.classes CSSClasses.button ] [ HH.text "x" ] , HH.button [ HP.type_ HP.ButtonSubmit , HE.onClick \_ -> EnterDomain domain - , HP.classes Bulma.class_button + , HP.classes CSSClasses.button ] [ HH.text domain ] ] diff --git a/src/Bulma.purs b/src/Bulma.purs index 1641b6c..07fe182 100644 --- a/src/Bulma.purs +++ b/src/Bulma.purs @@ -9,6 +9,7 @@ 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 import Halogen.HTML.Core (AttrName(..)) @@ -16,54 +17,28 @@ import Halogen.HTML.Core (AttrName(..)) -- import Web.Event.Event (type_, Event, EventType(..)) --import Web.UIEvent.MouseEvent (MouseEvent) -class_columns :: Array (HH.ClassName) -class_columns = [HH.ClassName "columns" ] -class_column :: Array (HH.ClassName) -class_column = [HH.ClassName "column" ] -class_title :: Array (HH.ClassName) -class_title = [HH.ClassName "title" ] -class_subtitle :: Array (HH.ClassName) -class_subtitle = [HH.ClassName "subtitle" ] -class_is5 :: Array (HH.ClassName) -class_is5 = [HH.ClassName "is-5" ] -class_is4 :: Array (HH.ClassName) -class_is4 = [HH.ClassName "is-4" ] -class_box :: Array (HH.ClassName) -class_box = [HH.ClassName "box" ] -class_label :: Array (HH.ClassName) -class_label = [HH.ClassName "label" ] -class_control :: Array (HH.ClassName) -class_control = [HH.ClassName "control" ] -class_select :: Array (HH.ClassName) -class_select = [HH.ClassName "select" ] -class_is_primary :: Array (HH.ClassName) -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). Array (HH.ClassName) -> Array (HH.HTML w i) -> HH.HTML w i -columns classes = HH.div [ HP.classes (class_columns <> classes) ] +columns classes = HH.div [ HP.classes (C.columns <> classes) ] columns_ :: forall (w :: Type) (i :: Type). Array (HH.HTML w i) -> HH.HTML w i columns_ = columns [] column :: forall (w :: Type) (i :: Type). Array (HH.ClassName) -> Array (HH.HTML w i) -> HH.HTML w i -column classes = HH.div [ HP.classes (class_column <> classes) ] +column classes = HH.div [ HP.classes (C.column <> classes) ] column_ :: forall (w :: Type) (i :: Type). Array (HH.HTML w i) -> HH.HTML w i column_ = column [] h1 :: forall (w :: Type) (a :: Type). String -> HH.HTML w a -h1 title = HH.h1 [ HP.classes (class_title) ] [ HH.text title ] +h1 title = HH.h1 [ HP.classes (C.title) ] [ HH.text title ] h3 :: forall (w :: Type) (a :: Type). String -> HH.HTML w a -h3 title = HH.h1 [ HP.classes (class_title <> class_is5) ] [ HH.text title ] +h3 title = HH.h1 [ HP.classes (C.title <> C.is5) ] [ HH.text title ] --subtitle :: forall (w :: Type) (a :: Type). String -> HH.HTML w a ---subtitle title = HH.h2 [ HP.classes (class_subtitle <> class_is4) ] [ HH.text title ] +--subtitle title = HH.h2 [ HP.classes (C.subtitle <> C.is4) ] [ HH.text title ] -- --hdiv :: forall (w :: Type) (a :: Type). Array (HH.HTML w a) -> HH.HTML w a --hdiv = HH.div [ HP.classes [HH.ClassName "mt-5"] ] @@ -132,8 +107,8 @@ input_email action email validity box_input_email :: forall w i. (String -> i) -> String -> Boolean -> HH.HTML w i box_input_email action email validity = HH.label [ ] - [ HH.label [HP.classes class_label ] [ HH.text "Email" ] - , HH.div [HP.classes class_control ] [ input_email action email validity ] + [ HH.label [HP.classes C.label ] [ HH.text "Email" ] + , HH.div [HP.classes C.control ] [ input_email action email validity ] ] input_password :: forall w i. (String -> i) -> String -> Boolean -> HH.HTML w i @@ -149,8 +124,8 @@ input_password action password validity box_input_password :: forall w i. (String -> i) -> String -> Boolean -> HH.HTML w i box_input_password action password validity = HH.label [ ] - [ HH.label [HP.classes class_label ] [ HH.text "Password" ] - , HH.div [HP.classes class_control ] [ input_password action password validity ] + [ HH.label [HP.classes C.label ] [ HH.text "Password" ] + , HH.div [HP.classes C.control ] [ input_password action password validity ] ] @@ -171,8 +146,8 @@ box_input_password action password validity = HH.label [ ] -- --box_input_domain :: forall w i. (String -> i) -> String -> Boolean -> HH.HTML w i --box_input_domain action domain validity = HH.label [ ] --- [ HH.label [HP.classes class_label ] [ HH.text "Domain" ] --- , HH.div [HP.classes class_control ] [ input_domain action domain validity ] +-- [ HH.label [HP.classes C.label ] [ HH.text "Domain" ] +-- , HH.div [HP.classes C.control ] [ input_domain action domain validity ] -- ] -- --input_ttl :: forall w i. (String -> i) -> String -> Boolean -> HH.HTML w i @@ -187,8 +162,8 @@ box_input_password action password validity = HH.label [ ] -- --box_input_ttl :: forall w i. (String -> i) -> String -> Boolean -> HH.HTML w i --box_input_ttl action value validity = HH.label [ ] --- [ HH.label [HP.classes class_label ] [ HH.text "TTL" ] --- , HH.div [HP.classes class_control ] [ input_ttl action value validity ] +-- [ HH.label [HP.classes C.label ] [ HH.text "TTL" ] +-- , HH.div [HP.classes C.control ] [ input_ttl action value validity ] -- ] -- -- @@ -204,8 +179,8 @@ box_input_password action password validity = HH.label [ ] -- --box_input_priority :: forall w i. (String -> i) -> String -> Boolean -> HH.HTML w i --box_input_priority action value validity = HH.label [ ] --- [ HH.label [HP.classes class_label ] [ HH.text "Priority" ] --- , HH.div [HP.classes class_control ] [ input_priority action value validity ] +-- [ HH.label [HP.classes C.label ] [ HH.text "Priority" ] +-- , HH.div [HP.classes C.control ] [ input_priority action value validity ] -- ] -- -- @@ -220,8 +195,8 @@ box_input_password action password validity = HH.label [ ] -- --box_input_value :: forall w i. (String -> i) -> String -> Boolean -> HH.HTML w i --box_input_value action value validity = HH.label [ ] --- [ HH.label [HP.classes class_label ] [ HH.text "Value" ] --- , HH.div [HP.classes class_control ] [ input_value action value validity ] +-- [ HH.label [HP.classes C.label ] [ HH.text "Value" ] +-- , HH.div [HP.classes C.control ] [ input_value action value validity ] -- ] -- -- @@ -237,8 +212,8 @@ box_input_password action password validity = HH.label [ ] -- --box_input_weight :: forall w i. (String -> i) -> String -> Boolean -> HH.HTML w i --box_input_weight action weight validity = HH.label [ ] --- [ HH.label [HP.classes class_label ] [ HH.text "Weight" ] --- , HH.div [HP.classes class_control ] [ input_weight action weight validity ] +-- [ HH.label [HP.classes C.label ] [ HH.text "Weight" ] +-- , HH.div [HP.classes C.control ] [ input_weight action weight validity ] -- ] -- -- @@ -254,8 +229,8 @@ box_input_password action password validity = HH.label [ ] -- --box_input_port :: forall w i. (String -> i) -> String -> Boolean -> HH.HTML w i --box_input_port action port validity = HH.label [ ] --- [ HH.label [HP.classes class_label ] [ HH.text "Port" ] --- , HH.div [HP.classes class_control ] [ input_port action port validity ] +-- [ HH.label [HP.classes C.label ] [ HH.text "Port" ] +-- , HH.div [HP.classes C.control ] [ input_port action port validity ] -- ] -- -- @@ -317,75 +292,50 @@ render_input password placeholder action value validity cond false -> [] true -> [ HP.type_ HP.InputPassword ] -class_horizontal :: Array (HH.ClassName) -class_horizontal = [HH.ClassName "is-horizontal" ] -class_normal :: Array (HH.ClassName) -class_normal = [HH.ClassName "is-normal" ] -class_field :: Array (HH.ClassName) -class_field = [HH.ClassName "field" ] -class_field_label :: Array (HH.ClassName) -class_field_label = [HH.ClassName "field-label" ] -class_field_body :: Array (HH.ClassName) -class_field_body = [HH.ClassName "field-body" ] - field_inner ispassword title placeholder action value validity cond = div_field [ div_field_label title , div_field_content $ render_input ispassword placeholder action value validity cond ] where - div_field = HH.div [ HP.classes (class_field <> class_horizontal) ] + div_field = HH.div [ HP.classes (C.field <> C.horizontal) ] div_field_label title - = HH.div [ HP.classes (class_field_label <> class_normal) ] - [HH.label [ HP.classes class_label ] [ HH.text title ]] + = HH.div [ HP.classes (C.field_label <> C.normal) ] + [HH.label [ HP.classes C.label ] [ HH.text title ]] div_field_content content - = HH.div [HP.classes class_field_body] - [ HH.div [HP.classes class_field ] - [ HH.div [HP.classes class_control ] [ content ] + = HH.div [HP.classes C.field_body] + [ HH.div [HP.classes C.field ] + [ HH.div [HP.classes C.control ] [ content ] ] ] box_input = field_inner false box_password = field_inner true -class_has_addons :: Array (HH.ClassName) -class_has_addons = [HH.ClassName "has-addons"] +section_medium = HH.section [ HP.classes (C.section <> C.medium) ] -class_section :: Array (HH.ClassName) -class_section = [HH.ClassName "section"] -class_medium :: Array (HH.ClassName) -class_medium = [HH.ClassName "is-medium"] - -section_medium = HH.section [ HP.classes (class_section <> class_medium) ] - -field classes = HH.div [ HP.classes (class_field <> classes) ] - -class_input :: Array (HH.ClassName) -class_input = [HH.ClassName "input" ] - -class_button :: Array (HH.ClassName) -class_button = [HH.ClassName "button" ] +field classes = HH.div [ HP.classes (C.field <> classes) ] new_domain_field inputaction text selectaction accepted_domains - = field class_has_addons + = field C.has_addons [ HH.p - [ HP.classes class_control ] + [ HP.classes C.control ] [ HH.input $ [ HE.onValueInput inputaction , HP.placeholder "www" , HP.value text , HP.type_ HP.InputText - , HP.classes (class_is_primary <> class_input) + , HP.classes (C.is_primary <> C.input) ] ] , HH.p - [ HP.classes class_control ] + [ HP.classes C.control ] [ select selectaction $ map option accepted_domains ] , HH.p - [ HP.classes class_control ] + [ HP.classes C.control ] [ HH.button [ HP.type_ HP.ButtonSubmit - , HP.classes class_button + , HP.classes C.button ] [ HH.text "add a new domain!" ] ] @@ -413,8 +363,8 @@ new_domain_field inputaction text selectaction accepted_domains --box_button action value validity cond -- = HH.label [ ] --- [ HH.label [HP.classes class_label ] [ HH.text title ] --- , HH.div [HP.classes class_control ] +-- [ HH.label [HP.classes C.label ] [ HH.text title ] +-- , HH.div [HP.classes C.control ] -- [ render_input ispassword placeholder action value validity cond ] -- ] @@ -422,31 +372,22 @@ p :: forall w i. String -> HH.HTML w i p str = HH.p_ [ HH.text str ] box :: forall w i. Array (HH.HTML w i) -> HH.HTML w i -box = HH.div [HP.classes class_box] +box = HH.div [HP.classes C.box] option :: forall w i. String -> HH.HTML w i option value = HH.option_ [HH.text value] select :: forall w i. HH.Node DHI.HTMLselect w i select action options - = HH.div [ HP.classes (class_select <> class_is_primary) ] + = HH.div [ HP.classes (C.select <> C.is_primary) ] [ HH.select action options] -class_hero :: Array (HH.ClassName) -class_hero = [HH.ClassName "hero" ] -class_hero_body :: Array (HH.ClassName) -class_hero_body = [HH.ClassName "hero-body" ] -class_is_info :: Array (HH.ClassName) -class_is_info = [HH.ClassName "is-info" ] -class_is_small :: Array (HH.ClassName) -class_is_small = [HH.ClassName "is-small" ] - hero :: forall w i. String -> String -> HH.HTML w i hero title subtitle - = HH.section [ HP.classes (class_hero <> class_is_info <> class_is_small) ] - [ HH.div [ HP.classes class_hero_body ] - [ HH.p [ HP.classes class_title ] [ HH.text title ] - , HH.p [ HP.classes class_subtitle ] [ HH.text subtitle ] + = HH.section [ HP.classes (C.hero <> C.is_info <> C.is_small) ] + [ HH.div [ HP.classes C.hero_body ] + [ HH.p [ HP.classes C.title ] [ HH.text title ] + , HH.p [ HP.classes C.subtitle ] [ HH.text subtitle ] ] ] @@ -464,85 +405,96 @@ header = hero -- -- -class_container :: Array (HH.ClassName) -class_container = [HH.ClassName "container" ] - container :: forall w i. Array (HH.HTML w i) -> HH.HTML w i -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"] +container = HH.div [HP.classes (C.container <> C.is_info)] 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"] +modal_domain_delete :: forall w i. String -> HH.HTML w i +modal_domain_delete domain = + modal + [ modal_background + , modal_card [modal_header, modal_body] + , modal_foot [modal_delete_button, modal_cancel_button] + ] + where + modal = HH.div [HP.classes (C.modal <> C.is_active)] + modal_background = HH.div [HP.classes C.modal_background] [] + modal_card = HH.div [HP.classes C.modal_card] + modal_header = HH.header [HP.classes C.modal_card_head] + [ HH.p [HP.classes C.modal_card_title] [HH.text "Deleting a domain"] + --, HH.button [HP.classes C.delete, ARIA.label "close"] [] + ] + modal_body = HH.section [HP.classes C.modal_card_body] [ warning_message ] + modal_foot = HH.div [HP.classes C.modal_card_foot] + modal_delete_button = HH.button [HP.classes (C.button <> C.is_success)] [HH.text "Delete the domain."] + modal_cancel_button = HH.button [HP.classes C.button] [HH.text "Cancel"] + warning_message + = HH.p [] [ HH.text $ "You are about to delete your domain '" + <> domain + <> "'. Are you sure you want to do this? This is " + , HH.strong_ [ HH.text "irreversible" ] + , HH.text "." + ] +--
Modal title
+-- +--