framework7.angular

.page(data-page="forms-checkboxes") .navbar .navbar-inner .left a(href="forms.html").back.link.icon-only i.icon.icon-back .center Checkboxes And Radios .right a(href="#").link.open-panel.icon-only i.icon.icon-bars .page-content .content-block-title Checkbox group .list-block ul li label.label-checkbox.item-content input(type="checkbox", name="ks-checkbox", value="Books", checked=true) .item-media i.icon.icon-form-checkbox .item-inner .item-title Books li label.label-checkbox.item-content input(type="checkbox", name="ks-checkbox", value="Movies") .item-media i.icon.icon-form-checkbox .item-inner .item-title Movies li label.label-checkbox.item-content input(type="checkbox", name="ks-checkbox", value="Food") .item-media i.icon.icon-form-checkbox .item-inner .item-title Food li label.label-checkbox.item-content input(type="checkbox", name="ks-checkbox", value="Drinks") .item-media i.icon.icon-form-checkbox .item-inner .item-title Drinks .content-block-title Radio buttons group .list-block ul li label.label-radio.item-content input(type="radio", name="ks-radio", value="Books", checked=true) .item-media i.icon.icon-form-radio .item-inner .item-title Books li label.label-radio.item-content input(type="radio", name="ks-radio", value="Movies") .item-media i.icon.icon-form-radio .item-inner .item-title Movies li label.label-radio.item-content input(type="radio", name="ks-radio", value="Food") .item-media i.icon.icon-form-radio .item-inner .item-title Food li label.label-radio.item-content input(type="radio", name="ks-radio", value="Drinks") .item-media i.icon.icon-form-radio .item-inner .item-title Drinks .content-block-title With Media Lists .list-block.media-list ul li label.label-checkbox.item-content input(type="checkbox", name="ks-media-checkbox", value="1") .item-media i.icon.icon-form-checkbox .item-inner .item-title-row .item-title Facebook .item-after 17:14 .item-subtitle New messages from John Doe .item-text Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sagittis tellus ut turpis condimentum, ut dignissim lacus tincidunt. Cras dolor metus, ultrices condimentum sodales sit amet, pharetra sodales eros. Phasellus vel felis tellus. Mauris rutrum ligula nec dapibus feugiat. In vel dui laoreet, commodo augue id, pulvinar lacus. li label.label-checkbox.item-content input(type="checkbox", name="ks-media-checkbox", value="2") .item-media i.icon.icon-form-checkbox .item-inner .item-title-row .item-title John Doe (via Twitter) .item-after 17:11 .item-subtitle John Doe (@_johndoe) mentioned you on Twitter! .item-text Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sagittis tellus ut turpis condimentum, ut dignissim lacus tincidunt. Cras dolor metus, ultrices condimentum sodales sit amet, pharetra sodales eros. Phasellus vel felis tellus. Mauris rutrum ligula nec dapibus feugiat. In vel dui laoreet, commodo augue id, pulvinar lacus. li label.label-checkbox.item-content input(type="checkbox", name="ks-media-checkbox", value="3") .item-media i.icon.icon-form-checkbox .item-inner .item-title-row .item-title Facebook .item-after 16:48 .item-subtitle New messages from John Doe .item-text Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sagittis tellus ut turpis condimentum, ut dignissim lacus tincidunt. Cras dolor metus, ultrices condimentum sodales sit amet, pharetra sodales eros. Phasellus vel felis tellus. Mauris rutrum ligula nec dapibus feugiat. In vel dui laoreet, commodo augue id, pulvinar lacus. li label.label-checkbox.item-content input(type="checkbox", name="ks-media-checkbox", value="4") .item-media i.icon.icon-form-checkbox .item-inner .item-title-row .item-title John Doe (via Twitter) .item-after 15:32 .item-subtitle John Doe (@_johndoe) mentioned you on Twitter! .item-text Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sagittis tellus ut turpis condimentum, ut dignissim lacus tincidunt. Cras dolor metus, ultrices condimentum sodales sit amet, pharetra sodales eros. Phasellus vel felis tellus. Mauris rutrum ligula nec dapibus feugiat. In vel dui laoreet, commodo augue id, pulvinar lacus. .content-block-title What is your favourite song? .list-block.media-list ul li label.label-radio.item-content input(type="radio", name="ks-media-radio", value="1", checked=true) .item-media img(src="http://lorempixel.com/160/160/fashion/1", width="80") .item-inner .item-title-row .item-title Yellow Submarine .item-after $15 .item-subtitle Beatles .item-text Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sagittis tellus ut turpis condimentum, ut dignissim lacus tincidunt. Cras dolor metus, ultrices condimentum sodales sit amet, pharetra sodales eros. Phasellus vel felis tellus. Mauris rutrum ligula nec dapibus feugiat. In vel dui laoreet, commodo augue id, pulvinar lacus. .item-after i.icon-form-radio li label.label-radio.item-content input(type="radio", name="ks-media-radio", value="2") .item-media img(src="http://lorempixel.com/160/160/fashion/2", width="80") .item-inner .item-title-row .item-title Don't Stop Me Now .item-after $22 .item-subtitle Queen .item-text Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sagittis tellus ut turpis condimentum, ut dignissim lacus tincidunt. Cras dolor metus, ultrices condimentum sodales sit amet, pharetra sodales eros. Phasellus vel felis tellus. Mauris rutrum ligula nec dapibus feugiat. In vel dui laoreet, commodo augue id, pulvinar lacus. .item-after i.icon-form-radio li label.label-radio.item-content input(type="radio", name="ks-media-radio", value="3") .item-media img(src="http://lorempixel.com/160/160/fashion/3", width="80") .item-inner .item-title-row .item-title Billie Jean .item-after $16 .item-subtitle Michael Jackson .item-text Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sagittis tellus ut turpis condimentum, ut dignissim lacus tincidunt. Cras dolor metus, ultrices condimentum sodales sit amet, pharetra sodales eros. Phasellus vel felis tellus. Mauris rutrum ligula nec dapibus feugiat. In vel dui laoreet, commodo augue id, pulvinar lacus. .item-after i.icon-form-radio