Module: Trestle::GridHelper

Defined in:
app/helpers/trestle/grid_helper.rb

Instance Method Summary collapse

Instance Method Details

#col(columns = nil, breakpoints = {}) ⇒ Object

Renders a column <div> tag, one of the building blocks of Bootstrap’s grid system. getbootstrap.com/docs/5.3/layout/grid/

Column divs should always be rendered inside of a row div.

Examples

# Standard column - evenly fills available space
<%= col do %>...<% end %>

# Column spans 4 (out of 12) grid columns (i.e. 1/3 width) at all breakpoints
<%= col 4 do %> ...

# Column spans 6 grid columns at smallest breakpoint, 4 at md breakpoint
# and above (portrait tablet) and 3 at xl breakpoint and above (desktop)
<%= col 6, md: 4, xl: 3 do %> ...

Returns a HTML-safe String.



40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
# File 'app/helpers/trestle/grid_helper.rb', line 40

def col(columns=nil, breakpoints={})
  if columns.is_a?(Hash)
    breakpoints = columns
    columns = breakpoints.delete("xs") || breakpoints.delete(:xs)
  end

  if columns.nil? && breakpoints.empty?
    classes = "col"
  else
    classes = []
    classes << "col-#{columns}" if columns
    classes += breakpoints.map { |breakpoint, span| "col-#{breakpoint}-#{span}" }
  end

  tag.div(class: classes) { yield }
end

#divider(**attributes) ⇒ Object

Renders an <hr> (horizontal rule) HTML tag.

attributes - Hash of attributes that will be passed to the <hr> tag

Returns a HTML-safe String.



62
63
64
# File 'app/helpers/trestle/grid_helper.rb', line 62

def divider(**attributes)
  tag.hr(**attributes)
end

#row(**attributes) ⇒ Object

Renders a row <div> tag, one of the building blocks of Bootstrap’s grid system. getbootstrap.com/docs/5.3/layout/grid/

attributes - Hash of attributes that will be passed to the tag (e.g. id, data, class)

Examples

<%= row do %>
  <%= col do %>Column content<% end %>
<% end %>

<%= row class: "row-cols-2", id: "my-row" do %> ...

Returns a HTML-safe String.



17
18
19
20
# File 'app/helpers/trestle/grid_helper.rb', line 17

def row(**attributes)
  defaults = Trestle::Options.new(class: ["row"])
  tag.div(**defaults.merge(attributes)) { yield }
end