x
<div style="max-width: 300px" class="Polaris-Card">
<ul data-controller="polaris-option-list" data-polaris-option-list-selected-class="Polaris-OptionList-Option--select" class="Polaris-OptionList">
<li>
<p class="Polaris-OptionList__Title">Sales Channels</p>
<ul class="Polaris-OptionList__Options">
<li tabindex="-1" class="Polaris-OptionList-Option">
<label class="Polaris-OptionList-Option__Label">
<div class="Polaris-OptionList-Option__Checkbox">
<div class="Polaris-OptionList-Checkbox">
<input type="checkbox" name="sales_channel[]" id="sales_channel_" value="online_store" aria-checked="false" class="Polaris-OptionList-Checkbox__Input" />
<div class="Polaris-OptionList-Checkbox__Backdrop"></div>
<div class="Polaris-OptionList-Checkbox__Icon">
<span class="Polaris-Icon">
<svg viewbox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" class="Polaris-Icon__Svg" focusable="false" aria-hidden="true"><path d="m7.293 14.707-3-3a.999.999 0 1 1 1.414-1.414l2.236 2.236 6.298-7.18a.999.999 0 1 1 1.518 1.3l-7 8a1 1 0 0 1-.72.35 1.017 1.017 0 0 1-.746-.292z"></path></svg>
</span>
</div>
</div>
</div>
Online Store
</label>
</li>
<li tabindex="-1" class="Polaris-OptionList-Option">
<label class="Polaris-OptionList-Option__Label">
<div class="Polaris-OptionList-Option__Checkbox">
<div class="Polaris-OptionList-Checkbox">
<input type="checkbox" name="sales_channel[]" id="sales_channel_" value="messenger" aria-checked="false" class="Polaris-OptionList-Checkbox__Input" />
<div class="Polaris-OptionList-Checkbox__Backdrop"></div>
<div class="Polaris-OptionList-Checkbox__Icon">
<span class="Polaris-Icon">
<svg viewbox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" class="Polaris-Icon__Svg" focusable="false" aria-hidden="true"><path d="m7.293 14.707-3-3a.999.999 0 1 1 1.414-1.414l2.236 2.236 6.298-7.18a.999.999 0 1 1 1.518 1.3l-7 8a1 1 0 0 1-.72.35 1.017 1.017 0 0 1-.746-.292z"></path></svg>
</span>
</div>
</div>
</div>
Messenger
</label>
</li>
<li tabindex="-1" class="Polaris-OptionList-Option">
<label class="Polaris-OptionList-Option__Label">
<div class="Polaris-OptionList-Option__Checkbox">
<div class="Polaris-OptionList-Checkbox">
<input type="checkbox" name="sales_channel[]" id="sales_channel_" value="facebook" aria-checked="false" class="Polaris-OptionList-Checkbox__Input" />
<div class="Polaris-OptionList-Checkbox__Backdrop"></div>
<div class="Polaris-OptionList-Checkbox__Icon">
<span class="Polaris-Icon">
<svg viewbox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" class="Polaris-Icon__Svg" focusable="false" aria-hidden="true"><path d="m7.293 14.707-3-3a.999.999 0 1 1 1.414-1.414l2.236 2.236 6.298-7.18a.999.999 0 1 1 1.518 1.3l-7 8a1 1 0 0 1-.72.35 1.017 1.017 0 0 1-.746-.292z"></path></svg>
</span>
</div>
</div>
</div>
Facebook
</label>
</li>
<li tabindex="-1" class="Polaris-OptionList-Option">
<label class="Polaris-OptionList-Option__Label">
<div class="Polaris-OptionList-Option__Checkbox">
<div class="Polaris-OptionList-Checkbox">
<input type="checkbox" name="sales_channel[]" id="sales_channel_" value="wholesale" aria-checked="false" class="Polaris-OptionList-Checkbox__Input" />
<div class="Polaris-OptionList-Checkbox__Backdrop"></div>
<div class="Polaris-OptionList-Checkbox__Icon">
<span class="Polaris-Icon">
<svg viewbox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" class="Polaris-Icon__Svg" focusable="false" aria-hidden="true"><path d="m7.293 14.707-3-3a.999.999 0 1 1 1.414-1.414l2.236 2.236 6.298-7.18a.999.999 0 1 1 1.518 1.3l-7 8a1 1 0 0 1-.72.35 1.017 1.017 0 0 1-.746-.292z"></path></svg>
</span>
</div>
</div>
</div>
Wholesale
</label>
</li>
<li tabindex="-1" class="Polaris-OptionList-Option">
<label class="Polaris-OptionList-Option__Label">
<div class="Polaris-OptionList-Option__Checkbox">
<div class="Polaris-OptionList-Checkbox">
<input type="checkbox" name="sales_channel[]" id="sales_channel_" value="buzzfeed" aria-checked="false" class="Polaris-OptionList-Checkbox__Input" />
<div class="Polaris-OptionList-Checkbox__Backdrop"></div>
<div class="Polaris-OptionList-Checkbox__Icon">
<span class="Polaris-Icon">
<svg viewbox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" class="Polaris-Icon__Svg" focusable="false" aria-hidden="true"><path d="m7.293 14.707-3-3a.999.999 0 1 1 1.414-1.414l2.236 2.236 6.298-7.18a.999.999 0 1 1 1.518 1.3l-7 8a1 1 0 0 1-.72.35 1.017 1.017 0 0 1-.746-.292z"></path></svg>
</span>
</div>
</div>
</div>
BuzzFeed
</label>
</li>
</ul>
</li>
</ul>
</div>
<%= polaris_card(sectioned: false, style: "max-width: 300px") do %>
<%= polaris_option_list(title: "Sales Channels", name: :sales_channel) do |list| %>
<% list.checkbox(label: "Online Store", value: "online_store") %>
<% list.checkbox(label: "Messenger", value: "messenger") %>
<% list.checkbox(label: "Facebook", value: "facebook") %>
<% list.checkbox(label: "Wholesale", value: "wholesale") %>
<% list.checkbox(label: "BuzzFeed", value: "buzzfeed") %>
<% end %>
<% end %>
No notes provided.
No params configured.