Module: Klods::Layout

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

Instance Method Summary collapse

Instance Method Details

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



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

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

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



61
62
63
64
65
66
67
68
69
 
# File 'lib/klods/layout.rb', line 61

def cluster(a = nil, b = nil, &block)
  props, children = Core.normalize_args(a, b)
  children = klods_capture(&block) if block
  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, &block) ⇒ Object 



29
30
31
32
33
34
35
36
37
 
# File 'lib/klods/layout.rb', line 29

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

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



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

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

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



84
85
86
87
88
89
90
91
92
93
94
95
96
 
# File 'lib/klods/layout.rb', line 84

def grid(a = nil, b = nil, &block)
  props, children = Core.normalize_args(a, b)
  children = klods_capture(&block) if block
  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, &block) ⇒ Object 



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

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

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



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

def page(a = nil, b = nil, &block)
  props, children = Core.normalize_args(a, b)
  children = klods_capture(&block) if block
  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, &block) ⇒ Object 



71
72
73
74
75
76
77
78
79
80
81
82
 
# File 'lib/klods/layout.rb', line 71

def row(a = nil, b = nil, &block)
  props, children = Core.normalize_args(a, b)
  children = klods_capture(&block) if block
  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, &block) ⇒ Object 



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

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

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



23
24
25
26
27
 
# File 'lib/klods/layout.rb', line 23

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

#sidebar_toggle(attrs = nil) ⇒ Object 



114
115
116
117
118
119
120
 
# File 'lib/klods/layout.rb', line 114

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, &block) ⇒ Object 



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

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

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



51
52
53
54
55
56
57
58
59
 
# File 'lib/klods/layout.rb', line 51

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

#text(value) ⇒ Object 



110
111
112
 
# File 'lib/klods/layout.rb', line 110

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