Module: Klods::Layout

Included in:
Builders
Defined in:
lib/klods/layout.rb

Instance Method Summary collapse

Instance Method Details

#center(a = nil, b = nil) ⇒ Object 



88
89
90
91
 
# File 'lib/klods/layout.rb', line 88

def center(a = nil, b = nil)
  props, children = Core.normalize_args(a, b)
  Core.build(tag: "div", base: "klods-center", props: props, children: children)
end

#cluster(a = nil, b = nil) ⇒ Object 



54
55
56
57
58
59
60
61
 
# File 'lib/klods/layout.rb', line 54

def cluster(a = nil, b = nil)
  props, children = Core.normalize_args(a, b)
  Core.build(
    tag: "div", base: "klods-cluster",
    modifiers: {gap: ->(v) { v ? "klods-cluster--gap-#{v}" : nil }},
    props: props, children: children
  )
end

#content(a = nil, b = nil) ⇒ Object 



26
27
28
29
30
31
32
33
 
# File 'lib/klods/layout.rb', line 26

def content(a = nil, b = nil)
  props, children = Core.normalize_args(a, b)
  Core.build(
    tag: "main", base: "klods-content",
    modifiers: {narrow: "klods-content--narrow"},
    props: props, children: children
  )
end

#footer(a = nil, b = nil) ⇒ Object 



35
36
37
38
 
# File 'lib/klods/layout.rb', line 35

def footer(a = nil, b = nil)
  props, children = Core.normalize_args(a, b)
  Core.build(tag: "footer", base: "klods-footer", props: props, children: children)
end

#grid(a = nil, b = nil) ⇒ Object 



75
76
77
78
79
80
81
82
83
84
85
86
 
# File 'lib/klods/layout.rb', line 75

def grid(a = nil, b = nil)
  props, children = Core.normalize_args(a, b)
  Core.build(
    tag: "div", base: "klods-grid",
    modifiers: {
      gap: ->(v) { v ? "klods-grid--gap-#{v}" : nil },
      cols: ->(v) { v ? "klods-grid--cols-#{v}" : nil },
      fit: "klods-grid--fit"
    },
    props: props, children: children
  )
end

#header(a = nil, b = nil) ⇒ Object 



16
17
18
19
 
# File 'lib/klods/layout.rb', line 16

def header(a = nil, b = nil)
  props, children = Core.normalize_args(a, b)
  Core.build(tag: "header", base: "klods-header", props: props, children: children)
end

#page(a = nil, b = nil) ⇒ Object 



3
4
5
6
7
8
9
10
11
12
13
14
 
# File 'lib/klods/layout.rb', line 3

def page(a = nil, b = nil)
  props, children = Core.normalize_args(a, b)
  Core.build(
    tag: "div", base: "klods-page",
    modifiers: {
      sidebar: "klods-page--with-sidebar",
      sidebar_position: ->(v) { (v.to_s == "trailing") ? "klods-page--sidebar-trailing" : nil },
      sticky_header: "klods-page--sticky-header"
    },
    props: props, children: children
  )
end

#row(a = nil, b = nil) ⇒ Object 



63
64
65
66
67
68
69
70
71
72
73
 
# File 'lib/klods/layout.rb', line 63

def row(a = nil, b = nil)
  props, children = Core.normalize_args(a, b)
  Core.build(
    tag: "div", base: "klods-row",
    modifiers: {
      gap: ->(v) { v ? "klods-row--gap-#{v}" : nil },
      inline: "klods-row--inline"
    },
    props: props, children: children
  )
end

#section(a = nil, b = nil) ⇒ Object 



40
41
42
43
 
# File 'lib/klods/layout.rb', line 40

def section(a = nil, b = nil)
  props, children = Core.normalize_args(a, b)
  Core.build(tag: "section", base: "klods-section", props: props, children: children)
end

#sidebar(a = nil, b = nil) ⇒ Object 



21
22
23
24
 
# File 'lib/klods/layout.rb', line 21

def sidebar(a = nil, b = nil)
  props, children = Core.normalize_args(a, b)
  Core.build(tag: "aside", base: "klods-sidebar", props: props, children: children)
end

#sidebar_toggle(attrs = nil) ⇒ Object 



102
103
104
105
106
107
108
 
# File 'lib/klods/layout.rb', line 102

def sidebar_toggle(attrs = nil)
  Core.el("button", {
    "type" => "button",
    "aria-label" => "Toggle sidebar",
    "class" => "klods-sidebar-toggle"
  }.merge((attrs || {}).transform_keys(&:to_s)))
end

#spread(a = nil, b = nil) ⇒ Object 



93
94
95
96
 
# File 'lib/klods/layout.rb', line 93

def spread(a = nil, b = nil)
  props, children = Core.normalize_args(a, b)
  Core.build(tag: "div", base: "klods-spread", props: props, children: children)
end

#stack(a = nil, b = nil) ⇒ Object 



45
46
47
48
49
50
51
52
 
# File 'lib/klods/layout.rb', line 45

def stack(a = nil, b = nil)
  props, children = Core.normalize_args(a, b)
  Core.build(
    tag: "div", base: "klods-stack",
    modifiers: {gap: ->(v) { v ? "klods-stack--gap-#{v}" : nil }},
    props: props, children: children
  )
end

#text(value) ⇒ Object 



98
99
100
 
# File 'lib/klods/layout.rb', line 98

def text(value)
  Node.new("span", {}, [value.to_s])
end