Bulma.Elements
Bulma elements
box : List (Attribute msg) -> List (Html msg) -> Html msg
button : List (Attribute msg) -> List (Html msg) -> Html msg
content : List (Attribute msg) -> List (Html msg) -> Html msg
delete : List (Attribute msg) -> Html msg
deleteButton : List (Attribute msg) -> Html msg
icon : List (Attribute msg) -> String -> Html msg
notification : List (Attribute msg) -> List (Html msg) -> Html msg
subtitle : Int -> String -> Html msg
table : List (Attribute msg) -> List (Html msg) -> Html msg
tag : List (Attribute msg) -> List (Html msg) -> Html msg
title : Int -> String -> Html msg
module Bulma.Elements
exposing
( box
, button
, content
, delete
, deleteButton
, icon
, notification
, subtitle
, table
, tag
, title
)
{-| [Bulma elements](http://bulma.io/documentation/elements/box/)
@docs box, button, content, delete, deleteButton, icon, notification, subtitle, table, tag, title
-}
import Bulma.Util exposing (bulmaNode)
import Html exposing (Html, Attribute, div, span, text)
import Html.Attributes exposing (class)
{-| [`<div class="box">`](http://bulma.io/documentation/elements/box/)
-}
box : List (Attribute msg) -> List (Html msg) -> Html msg
box =
bulmaNode div "box"
{-| [`<a class="button">`](http://bulma.io/documentation/elements/button/)
-}
button : List (Attribute msg) -> List (Html msg) -> Html msg
button =
bulmaNode Html.a "button"
{-| [`<div class="content">`](http://bulma.io/documentation/elements/content/)
-}
content : List (Attribute msg) -> List (Html msg) -> Html msg
content =
bulmaNode div "content"
{-| [`<a class="delete">`](http://bulma.io/documentation/elements/delete/)
-}
delete : List (Attribute msg) -> Html msg
delete attributes =
Html.a (class "delete" :: attributes) []
{-| [`<button class="delete">`](http://bulma.io/documentation/elements/delete/)
-}
deleteButton : List (Attribute msg) -> Html msg
deleteButton attributes =
Html.button (class "delete" :: attributes) []
{-| [`<span class="icon" attributes...><i class="fa fa-icon"></i></span>`](http://bulma.io/documentation/elements/icon/)
-}
icon : List (Attribute msg) -> String -> Html msg
icon attributes iconName =
span (class "icon" :: attributes)
[ Html.i [ class ("fa fa-" ++ iconName) ] [] ]
{-| [`<div class="notification">`](http://bulma.io/documentation/elements/notification/)
-}
notification : List (Attribute msg) -> List (Html msg) -> Html msg
notification =
bulmaNode div "notification"
{-| [`<h{size} class="subtitle is-{size}>{txt}</h{size}>"`](http://bulma.io/documentation/elements/title/)
-}
subtitle : Int -> String -> Html msg
subtitle size txt =
let
sizestr : String
sizestr =
size |> toString
in
Html.node
("h" ++ sizestr)
[ class ("subtitle is-" ++ sizestr) ]
[ text txt ]
{-| [`<table class="table">`](http://bulma.io/documentation/elements/table/)
-}
table : List (Attribute msg) -> List (Html msg) -> Html msg
table =
bulmaNode Html.table "table"
{-| [`<span class="tag">`](http://bulma.io/documentation/elements/tag/)
-}
tag : List (Attribute msg) -> List (Html msg) -> Html msg
tag =
bulmaNode span "tag"
{-| [`<h{size} class="title is-{size}>{txt}</h{size}>"`](http://bulma.io/documentation/elements/title/)
-}
title : Int -> String -> Html msg
title size str =
let
sizestr : String
sizestr =
size |> toString
in
Html.node ("h" ++ sizestr)
[ class ("title is-" ++ sizestr) ]
[ text str ]