tag, one of the building blocks of Bootstrap's grid system.
# https://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.
def row(**attributes)
defaults = Trestle::Options.new(class: ["row"])
tag.div(**defaults.merge(attributes)) { yield }
end
# Renders a column
tag, one of the building blocks of Bootstrap's grid system.
# https://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.
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
# Renders an
(horizontal rule) HTML tag.
#
# attributes - Hash of attributes that will be passed to the
tag
#
# Returns a HTML-safe String.
def divider(**attributes)
tag.hr(**attributes)
end
end
end