156 lines
3.2 KiB
Plaintext
156 lines
3.2 KiB
Plaintext
|
|
h = require 'maquette' .h
|
|
|
|
alias = (base-selector) ->
|
|
(selector, args, children) ->
|
|
if typeof(selector) == "object"
|
|
children = args
|
|
args = selector
|
|
selector = ""
|
|
|
|
h (base-selector + selector), args, children
|
|
|
|
module.exports = {
|
|
container: alias \div.container
|
|
footer: alias \footer.footer
|
|
|
|
columns: alias \div.columns
|
|
column: alias \div.column
|
|
|
|
box: (args, children) ->
|
|
h \div.box args, children
|
|
title: (level, args, label) ->
|
|
if not label
|
|
label = args
|
|
args = {}
|
|
|
|
h "div.title.is-#{level}", args, [label]
|
|
subtitle: (level, args, label) ->
|
|
if not label
|
|
label = args
|
|
args = {}
|
|
|
|
h "div.subtitle.is-#{level}", args, [label]
|
|
label: (args, label) ->
|
|
if not label
|
|
label = args
|
|
args = {}
|
|
|
|
h \label.label args, [label]
|
|
input: (args, children) ->
|
|
h \input.input args, children
|
|
textarea: (args, children) ->
|
|
h \textarea.textarea args, children
|
|
control: alias \div.control
|
|
button: alias \div.button # FIXME: Maybe \a.button?
|
|
tag: alias \div.tag
|
|
|
|
select: (selector, args, children) ->
|
|
if typeof(selector) == "object"
|
|
children = args
|
|
args = selector
|
|
selector = ""
|
|
|
|
h (\div.select + selector), {
|
|
} [
|
|
h \select {
|
|
onchange: args.onchange || ->
|
|
} children
|
|
]
|
|
|
|
# FIXME: Use only args and add args.label and args.input?
|
|
# Or maybe args.name and args.type could be used directly?
|
|
field: (selector, args, children) ->
|
|
if typeof(selector) == "object"
|
|
children = args
|
|
args = selector
|
|
selector = ""
|
|
|
|
h (\div.field + selector), args, children
|
|
|
|
form: (method, url, content) ->
|
|
h \form.form {
|
|
action: url
|
|
method: method
|
|
}, content
|
|
media: (args) ->
|
|
h \div.media [
|
|
if args.left
|
|
h \div.media-left args.left
|
|
if args.content
|
|
h \div.media-content args.content
|
|
if args.right
|
|
h \div.media-right args.right
|
|
]
|
|
level: (args) ->
|
|
h \div.level [
|
|
if args.left
|
|
h \div.level-left args.left
|
|
if args.right
|
|
h \div.level-right args.right
|
|
]
|
|
|
|
navbar: (args) ->
|
|
args or= {}
|
|
|
|
use-container = args.use-container || false
|
|
classes = args.classes || {}
|
|
|
|
inner-navbar = -> [
|
|
if args.brand
|
|
h \div.navbar-brand args.brand
|
|
if args.start || args.end
|
|
h \div.navbar-menu [
|
|
if start = args.start
|
|
h \div.navbar-start start
|
|
if end = args.end
|
|
h \div.navbar-end end
|
|
]
|
|
]
|
|
|
|
h \nav.navbar (JSON.parse JSON.stringify args), [
|
|
if use-container
|
|
h \div.container inner-navbar!
|
|
else
|
|
inner-navbar!
|
|
|
|
]
|
|
navbar-item: alias \a.navbar-item
|
|
|
|
hero: (args) ->
|
|
args or= {}
|
|
|
|
h \div.hero args, [
|
|
if head = args.head
|
|
head-args = args.head-args || {}
|
|
h \div.hero-head head-args, head
|
|
|
|
if body = args.body
|
|
body-args = args.body-args || {}
|
|
h \div.hero-body body-args, body
|
|
|
|
if footer = args.footer
|
|
footer-args = args.footer-args || {}
|
|
h \div.hero-footer footer-args, footer
|
|
]
|
|
|
|
card: (args) ->
|
|
args or= {}
|
|
|
|
h \div.card args, [
|
|
if header = args.header
|
|
h \div.card-header [
|
|
if title = header.title
|
|
h \div.card-header-title [ title ]
|
|
if icon = header.icon
|
|
h \div.card-header-icon [ icon ]
|
|
]
|
|
if content = args.content
|
|
h \div.card-content content
|
|
|
|
if footer = args.footer
|
|
h \div.card-footer footer
|
|
]
|
|
}
|
|
|