f7_list_block

f7_list_block - List Block

This renders a single list block, which will contain one or more of the following:

• f7_list_divider
• f7_list_group
• f7_list_item

Usage

f7_list_block title, options, &block
f7_list_block options, &block

Supported options

As well as all the usual HTML options, you have these extra, helper specific options:

• :title - Optional, some text to be displayed before the block.
• :label - Optional, some text to be displayed just before the end of the block.
• :format - Configure the appearance. Takes one of the following.
  • :inset - An inset content block.
  • :tablet_inset - Inset on tablets only. Ignored if :inset is also specified.
• :layout - Optional, allows you specify a layout to render a page partial within. Ignored when used with a block.

Examples

Plain content block

Input

<%= f7_list_block do %>
	<!-- List stuff... -->
<% end %>

Output

<div class="list-block">
    <ul>
        <!-- List stuff... -->
    </ul>
</div>

List block + title

Input

<%= f7_list_block 'Title' do %>
    <!-- List stuff... -->
<% end %>

or

<%= f7_content_block :title => 'Title' do %>
    <!-- List stuff... -->
<% end %>

Output

<div class="list-block">
    <div class="content-block-title">The Title</div>
    <ul>
        <!-- List stuff... -->
    </ul>
</div>

Inset list block

Input

<%= f7_list_block 'The Title', :format => :inset do %>
    <!-- List stuff... -->
<% end %>

Output

<div class="list-block inset">
    <div class="content-block-title">The Title</div>
    <ul>
        <!-- List stuff... -->
    </ul>
</div>

List block with label

Input

<%= f7_list_block 'The Title', :label => 'The End' do %>
<% end %>

Output

<div class="list-block">
    <div class="content-block-title">The Title</div>
    <ul>
        <!-- List stuff... -->
    </ul>
    <div class="list-block-label">The End</div>
</div>

---

Framework7 Documentation

List Block