<div class="pb--doc-demo-row"> <%= pb_rails("selectable_card_icon", props: { icon: "chart-line", title_text: "Quarterly Report", body_text: "Export", input_id: 1, checked: true, }) %> <%= pb_rails("selectable_card_icon", props: { icon: "chart-pie", title_text: "Market Share", body_text: "Export", input_id: 2, }) %> <%= pb_rails("selectable_card_icon", props: { icon: "analytics", title_text: "Comprehensive", body_text: "Export", input_id: 3, disabled: true }) %> </div>
<div class="pb--doc-demo-row"> <%= pb_rails("selectable_card_icon", props: { icon: "hat-cowboy", title_text: "Cowboy", body_text: "Howdy partner.", input_id: 4, checked: true, checkmark: true }) %> <%= pb_rails("selectable_card_icon", props: { icon: "hat-wizard", title_text: "Wizard", body_text: "Poof, you're a sandwich.", input_id: 5, checkmark: true }) %> <%= pb_rails("selectable_card_icon", props: { icon: "hat-chef", title_text: "Chef", body_text: "Where is the lamb sauce?", input_id: 6, disabled: true, checkmark: true }) %> </div>
<div class="pb--doc-demo-row"> <%= pb_rails("selectable_card_icon", props: { icon: "car", title_text: "Car", input_id: 7, name: "select", multi: false, }) %> <%= pb_rails("selectable_card_icon", props: { icon: "bus", title_text: "Bus", input_id: 8, name: "select", multi: false, }) %> <%= pb_rails("selectable_card_icon", props: { icon: "subway", title_text: "Subway", input_id: 9, name: "select", multi: false, }) %> </div>
<div class="pb--doc-demo-row"> <%= pb_rails("selectable_card_icon", props: { icon: "chart-line", title_text: "Quarterly Report", body_text: "Export", input_id: "card-icon-id", checked: true, input_options: { class: "input-class", name: "overwriting-name", value: "overwriting-value", } }) %> </div>