framework7rails 3.0.0 → 4.0.0

data/Framework7-0.9.6/kitchen-sink/deep-2.html

@@ -1,22 +0,0 @@
-
-<div class="navbar">
-  <div class="navbar-inner">
-    <div class="left sliding"><a href="index.html" class="back link">Deep Navbar</a></div>
-    <div class="center sliding">Deep 2</div>
-    <div class="right sliding"><a href="#" class="link">Deep 3</a></div>
-  </div>
-</div>
-<div class="pages navbar-through">
-  <div data-page="index" class="page">
-    <div class="page-content">
-      <div class="content-block-title">Welcome to Framework7</div>
-      <div class="content-block">
-        <div class="content-block-inner">
-          <p>Framework7 - is the free (Open Source) and ultra lightweight mobile framework for development of hybrid (Phonegap) or web apps with iOS7 native look and feel. It is intended to use in mobile websites, mobile web apps, and mobile native apps. Designed for iOS Safari, but also works great on desktop Chrome and Safari. Framework7 is created by Vladimir Kharlampidi (The iDangero.us).</p>
-          <p>Main approach of the Framework7 is to give you an instrument, easy and clear, for building iOS7 apps on HTML. Framework7 is full of freedom, it doesn't put you in a strict frames like other HTML mobile frameworks (for example like jQuery Mobile with crazy "data-role" attributes or Sencha Touch where you need to be JS pro). Framework7 doesn't try to do everything for you, no, Framework7 gives you a freedom, it has ultra simple and clean HTML layout, all basic interfaces (futher more), animations, work with views, and simple customization and styling opportunities.</p>
-          <p>And yes, Framework7 doesn't try to be compatible with all platforms, it is focused only on iOS7 to bring the best experience and simplicity.</p>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>

data/Framework7-0.9.6/kitchen-sink/deep-navbar-2.html

@@ -1,19 +0,0 @@
-
-<div class="navbar">
-  <div class="navbar-inner">
-    <div class="left sliding"><a href="index.html" class="back link">Deep Navbar</a></div>
-    <div class="center sliding">Deep 2</div>
-    <div class="right sliding"><a href="deep-navbar-3.html" class="link">Deep 3</a></div>
-  </div>
-</div>
-<div class="pages navbar-through">
-  <div data-page="deep-navbar-2" class="page">
-    <div class="page-content">
-      <div class="content-block">
-        <p><a href="deep-navbar-3.html" class="button">Go to page 3</a></p>
-        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet rhoncus odio. Suspendisse vel lectus neque. Mauris tincidunt dolor a felis vulputate, at accumsan risus convallis. Sed pulvinar malesuada enim, a consequat felis lobortis a. Morbi faucibus felis in libero lacinia blandit. Pellentesque vitae volutpat metus. In venenatis mauris massa, sed hendrerit augue pulvinar nec. Sed justo magna, lacinia vel tincidunt sed, tristique sit amet est. Nam iaculis dictum laoreet. Donec sed risus sed mauris ultricies aliquam sit amet in enim. Nullam tellus est, imperdiet et adipiscing consequat, consectetur vel nibh. Cras massa nibh, volutpat sit amet velit vel, suscipit tincidunt enim. Curabitur luctus elit id pharetra bibendum. Nulla ut dui eget nulla hendrerit commodo. Pellentesque placerat mi eget dolor rutrum, consectetur mattis mi tincidunt.</p>
-        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet rhoncus odio. Suspendisse vel lectus neque. Mauris tincidunt dolor a felis vulputate, at accumsan risus convallis. Sed pulvinar malesuada enim, a consequat felis lobortis a. Morbi faucibus felis in libero lacinia blandit. Pellentesque vitae volutpat metus. In venenatis mauris massa, sed hendrerit augue pulvinar nec. Sed justo magna, lacinia vel tincidunt sed, tristique sit amet est. Nam iaculis dictum laoreet. Donec sed risus sed mauris ultricies aliquam sit amet in enim. Nullam tellus est, imperdiet et adipiscing consequat, consectetur vel nibh. Cras massa nibh, volutpat sit amet velit vel, suscipit tincidunt enim. Curabitur luctus elit id pharetra bibendum. Nulla ut dui eget nulla hendrerit commodo. Pellentesque placerat mi eget dolor rutrum, consectetur mattis mi tincidunt.</p>
-      </div>
-    </div>
-  </div>
-</div>

data/Framework7-0.9.6/kitchen-sink/deep-navbar-3.html

@@ -1,19 +0,0 @@
-
-<div class="navbar">
-  <div class="navbar-inner">
-    <div class="left sliding"><a href="index.html" class="back link">Deep 2</a></div>
-    <div class="center sliding">Deep 3</div>
-    <div class="right sliding"><a href="index.html" class="link">Framework7</a></div>
-  </div>
-</div>
-<div class="pages navbar-through">
-  <div data-page="deep-navbar-3" class="page">
-    <div class="page-content">
-      <div class="content-block">
-        <p><a href="index.html" class="button">Go to home page</a></p>
-        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet rhoncus odio. Suspendisse vel lectus neque. Mauris tincidunt dolor a felis vulputate, at accumsan risus convallis. Sed pulvinar malesuada enim, a consequat felis lobortis a. Morbi faucibus felis in libero lacinia blandit. Pellentesque vitae volutpat metus. In venenatis mauris massa, sed hendrerit augue pulvinar nec. Sed justo magna, lacinia vel tincidunt sed, tristique sit amet est. Nam iaculis dictum laoreet. Donec sed risus sed mauris ultricies aliquam sit amet in enim. Nullam tellus est, imperdiet et adipiscing consequat, consectetur vel nibh. Cras massa nibh, volutpat sit amet velit vel, suscipit tincidunt enim. Curabitur luctus elit id pharetra bibendum. Nulla ut dui eget nulla hendrerit commodo. Pellentesque placerat mi eget dolor rutrum, consectetur mattis mi tincidunt.</p>
-        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet rhoncus odio. Suspendisse vel lectus neque. Mauris tincidunt dolor a felis vulputate, at accumsan risus convallis. Sed pulvinar malesuada enim, a consequat felis lobortis a. Morbi faucibus felis in libero lacinia blandit. Pellentesque vitae volutpat metus. In venenatis mauris massa, sed hendrerit augue pulvinar nec. Sed justo magna, lacinia vel tincidunt sed, tristique sit amet est. Nam iaculis dictum laoreet. Donec sed risus sed mauris ultricies aliquam sit amet in enim. Nullam tellus est, imperdiet et adipiscing consequat, consectetur vel nibh. Cras massa nibh, volutpat sit amet velit vel, suscipit tincidunt enim. Curabitur luctus elit id pharetra bibendum. Nulla ut dui eget nulla hendrerit commodo. Pellentesque placerat mi eget dolor rutrum, consectetur mattis mi tincidunt.</p>
-      </div>
-    </div>
-  </div>
-</div>

data/Framework7-0.9.6/kitchen-sink/deep-navbar.html

@@ -1,18 +0,0 @@
-
-<div class="navbar">
-  <div class="navbar-inner">
-    <div class="left sliding"><a href="index.html" class="back link">Navbars</a></div>
-    <div class="center sliding">Deep Navbar</div>
-    <div class="right sliding"><a href="deep-navbar-2.html" class="link">Deep 2</a></div>
-  </div>
-</div>
-<div class="pages navbar-through">
-  <div data-page="deep-navbar" class="page">
-    <div class="page-content">
-      <div class="content-block">
-        <p>This demo demonstrates Framework7 exclusive behavior of dynamic sliding navigation bars. Just click the button below and look how navbar links will change. And don't forget to try swipe-back gesture on next pages:</p>
-        <p><a href="deep-navbar-2.html" class="button">Go to page 2</a></p>
-      </div>
-    </div>
-  </div>
-</div>

data/Framework7-0.9.6/kitchen-sink/forms-buttons.html

@@ -1,64 +0,0 @@
-
-<div class="navbar">
-  <div class="navbar-inner">
-    <div class="left sliding"><a href="forms.html" class="back link"><i class="icon icon-back"></i><span>Forms</span></a></div>
-    <div class="center sliding">Buttons</div>
-    <div class="right"><a href="#" class="link open-panel icon-only"><i class="icon icon-bars"></i></a></div>
-  </div>
-</div>
-<div class="pages navbar-through">
-  <div data-page="form-buttons" class="page">
-    <div class="page-content">
-      <div class="content-block-title">Usual Buttons</div>
-      <div class="content-block">
-        <div class="row">
-          <div class="col-33"><a href="#" class="button active">Active</a></div>
-          <div class="col-33"><a href="#" class="button">Button</a></div>
-          <div class="col-33"><a href="#" class="button button-round">Round</a></div>
-        </div>
-      </div>
-      <div class="content-block">
-        <div class="row">
-          <div class="col-50"><a href="#" class="button active">Active</a></div>
-          <div class="col-50"><a href="#" class="button">Button</a></div>
-        </div>
-      </div>
-      <div class="content-block">
-        <div class="buttons-row"><a href="#" class="button">Button</a><a href="#" class="button">Button</a></div>
-      </div>
-      <div class="content-block">
-        <div class="buttons-row"><a href="#" class="button button-round">Button</a><a href="#" class="button button-round">Button</a><a href="#" class="button button-round">Button</a></div>
-      </div>
-      <div class="content-block">
-        <div class="buttons-row"><a href="#" class="button">Button</a><a href="#" class="button active">Button</a><a href="#" class="button">Button</a><a href="#" class="button">Button</a></div>
-      </div>
-      <div class="content-block-title">Big Buttons</div>
-      <div class="content-block">
-        <div class="row">
-          <div class="col-50"><a href="#" class="button button-big active">Active</a></div>
-          <div class="col-50"><a href="#" class="button button-big">Button</a></div>
-        </div>
-      </div>
-      <div class="content-block-title">Themed Fill Buttons</div>
-      <div class="content-block">
-        <div class="row">
-          <div class="col-50"><a href="#" class="button button-big button-fill color-green">Submit</a></div>
-          <div class="col-50"><a href="#" class="button button-big button-fill color-red">Cancel</a></div>
-        </div>
-      </div>
-      <div class="content-block-title">List-Block Buttons</div>
-      <div class="list-block inset">
-        <ul>
-          <li><a href="#" class="list-button item-link">List Button 1</a></li>
-          <li><a href="#" class="list-button item-link">List Button 2</a></li>
-          <li><a href="#" class="list-button item-link">List Button 2</a></li>
-        </ul>
-      </div>
-      <div class="list-block inset">
-        <ul>
-          <li><a href="#" class="list-button item-link color-red">Big Red Button</a></li>
-        </ul>
-      </div>
-    </div>
-  </div>
-</div>

data/Framework7-0.9.6/kitchen-sink/forms-checkboxes.html

@@ -1,200 +0,0 @@
-
-<div class="navbar">
-  <div class="navbar-inner">
-    <div class="left sliding"><a href="forms.html" class="back link"><i class="icon icon-back"></i><span>Forms</span></a></div>
-    <div class="center sliding">Checkboxes And Radios</div>
-    <div class="right"><a href="#" class="link open-panel icon-only"><i class="icon icon-bars"></i></a></div>
-  </div>
-</div>
-<div class="pages navbar-through">
-  <div data-page="forms-checkboxes" class="page">
-    <div class="page-content">
-      <div class="content-block-title">Checkbox group</div>
-      <div class="list-block">
-        <ul>
-          <li>
-            <label class="label-checkbox item-content">
-              <input type="checkbox" name="ks-checkbox" value="Books" checked="checked"/>
-              <div class="item-media"><i class="icon icon-form-checkbox"></i></div>
-              <div class="item-inner">
-                <div class="item-title">Books</div>
-              </div>
-            </label>
-          </li>
-          <li>
-            <label class="label-checkbox item-content">
-              <input type="checkbox" name="ks-checkbox" value="Movies"/>
-              <div class="item-media"><i class="icon icon-form-checkbox"></i></div>
-              <div class="item-inner">
-                <div class="item-title">Movies</div>
-              </div>
-            </label>
-          </li>
-          <li>
-            <label class="label-checkbox item-content">
-              <input type="checkbox" name="ks-checkbox" value="Food"/>
-              <div class="item-media"><i class="icon icon-form-checkbox"></i></div>
-              <div class="item-inner">
-                <div class="item-title">Food</div>
-              </div>
-            </label>
-          </li>
-          <li>
-            <label class="label-checkbox item-content">
-              <input type="checkbox" name="ks-checkbox" value="Drinks"/>
-              <div class="item-media"><i class="icon icon-form-checkbox"></i></div>
-              <div class="item-inner">
-                <div class="item-title">Drinks</div>
-              </div>
-            </label>
-          </li>
-        </ul>
-      </div>
-      <div class="content-block-title">Radio buttons group</div>
-      <div class="list-block">
-        <ul>
-          <li>
-            <label class="label-radio item-content">
-              <input type="radio" name="ks-radio" value="Books" checked="checked"/>
-              <div class="item-inner">
-                <div class="item-title">Books</div>
-              </div>
-            </label>
-          </li>
-          <li>
-            <label class="label-radio item-content">
-              <input type="radio" name="ks-radio" value="Movies"/>
-              <div class="item-inner">
-                <div class="item-title">Movies</div>
-              </div>
-            </label>
-          </li>
-          <li>
-            <label class="label-radio item-content">
-              <input type="radio" name="ks-radio" value="Food"/>
-              <div class="item-inner">
-                <div class="item-title">Food</div>
-              </div>
-            </label>
-          </li>
-          <li>
-            <label class="label-radio item-content">
-              <input type="radio" name="ks-radio" value="Drinks"/>
-              <div class="item-inner">
-                <div class="item-title">Drinks</div>
-              </div>
-            </label>
-          </li>
-        </ul>
-      </div>
-      <div class="content-block-title">With Media Lists</div>
-      <div class="list-block media-list">
-        <ul>
-          <li>
-            <label class="label-checkbox item-content">
-              <input type="checkbox" name="ks-media-checkbox" value="1"/>
-              <div class="item-media"><i class="icon icon-form-checkbox"></i></div>
-              <div class="item-inner">
-                <div class="item-title-row">
-                  <div class="item-title">Facebook</div>
-                  <div class="item-after">17:14</div>
-                </div>
-                <div class="item-subtitle">New messages from John Doe</div>
-                <div class="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.</div>
-              </div>
-            </label>
-          </li>
-          <li>
-            <label class="label-checkbox item-content">
-              <input type="checkbox" name="ks-media-checkbox" value="2"/>
-              <div class="item-media"><i class="icon icon-form-checkbox"></i></div>
-              <div class="item-inner">
-                <div class="item-title-row">
-                  <div class="item-title">John Doe (via Twitter)</div>
-                  <div class="item-after">17:11</div>
-                </div>
-                <div class="item-subtitle">John Doe (@_johndoe) mentioned you on Twitter!</div>
-                <div class="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.</div>
-              </div>
-            </label>
-          </li>
-          <li>
-            <label class="label-checkbox item-content">
-              <input type="checkbox" name="ks-media-checkbox" value="3"/>
-              <div class="item-media"><i class="icon icon-form-checkbox"></i></div>
-              <div class="item-inner">
-                <div class="item-title-row">
-                  <div class="item-title">Facebook</div>
-                  <div class="item-after">16:48</div>
-                </div>
-                <div class="item-subtitle">New messages from John Doe</div>
-                <div class="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.</div>
-              </div>
-            </label>
-          </li>
-          <li>
-            <label class="label-checkbox item-content">
-              <input type="checkbox" name="ks-media-checkbox" value="4"/>
-              <div class="item-media"><i class="icon icon-form-checkbox"></i></div>
-              <div class="item-inner">
-                <div class="item-title-row">
-                  <div class="item-title">John Doe (via Twitter)</div>
-                  <div class="item-after">15:32</div>
-                </div>
-                <div class="item-subtitle">John Doe (@_johndoe) mentioned you on Twitter!</div>
-                <div class="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.</div>
-              </div>
-            </label>
-          </li>
-        </ul>
-      </div>
-      <div class="content-block-title">What is your favourite song?</div>
-      <div class="list-block media-list">
-        <ul>
-          <li>
-            <label class="label-radio item-content">
-              <input type="radio" name="ks-media-radio" value="1" checked="checked"/>
-              <div class="item-media"><img src="http://hhhhold.com/160/d/jpg?1" width="80"/></div>
-              <div class="item-inner">
-                <div class="item-title-row">
-                  <div class="item-title">Yellow Submarine</div>
-                  <div class="item-after">$15</div>
-                </div>
-                <div class="item-subtitle">Beatles</div>
-                <div class="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.</div>
-              </div>
-            </label>
-          </li>
-          <li>
-            <label class="label-radio item-content">
-              <input type="radio" name="ks-media-radio" value="2"/>
-              <div class="item-media"><img src="http://hhhhold.com/160/d/jpg?2" width="80"/></div>
-              <div class="item-inner">
-                <div class="item-title-row">
-                  <div class="item-title">Don't Stop Me Now</div>
-                  <div class="item-after">$22</div>
-                </div>
-                <div class="item-subtitle">Queen</div>
-                <div class="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.</div>
-              </div>
-            </label>
-          </li>
-          <li>
-            <label class="label-radio item-content">
-              <input type="radio" name="ks-media-radio" value="3"/>
-              <div class="item-media"><img src="http://hhhhold.com/160/d/jpg?3" width="80"/></div>
-              <div class="item-inner">
-                <div class="item-title-row">
-                  <div class="item-title">Billie Jean</div>
-                  <div class="item-after">$16</div>
-                </div>
-                <div class="item-subtitle">Michael Jackson</div>
-                <div class="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.</div>
-              </div>
-            </label>
-          </li>
-        </ul>
-      </div>
-    </div>
-  </div>
-</div>

data/Framework7-0.9.6/kitchen-sink/forms-elements.html

@@ -1,359 +0,0 @@
-
-<div class="navbar">
-  <div class="navbar-inner">
-    <div class="left sliding"><a href="forms.html" class="back link"><i class="icon icon-back"></i><span>Forms</span></a></div>
-    <div class="center sliding">Form Elements</div>
-    <div class="right"><a href="#" class="link open-panel icon-only"><i class="icon icon-bars"></i></a></div>
-  </div>
-</div>
-<div class="pages navbar-through">
-  <div data-page="form-elements" class="page">
-    <div class="page-content">
-      <div class="content-block-title">Full Layout</div>
-      <div class="list-block">
-        <ul>
-          <li>
-            <div class="item-content">
-              <div class="item-media"><i class="icon icon-form-name"></i></div>
-              <div class="item-inner">
-                <div class="item-title label">Name</div>
-                <div class="item-input">
-                  <input type="text" placeholder="Your name"/>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-media"><i class="icon icon-form-email"></i></div>
-              <div class="item-inner">
-                <div class="item-title label">E-mail</div>
-                <div class="item-input">
-                  <input type="email" placeholder="E-mail"/>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-media"><i class="icon icon-form-url"></i></div>
-              <div class="item-inner">
-                <div class="item-title label">URL</div>
-                <div class="item-input">
-                  <input type="url" placeholder="URL"/>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-media"><i class="icon icon-form-password"></i></div>
-              <div class="item-inner">
-                <div class="item-title label">Password</div>
-                <div class="item-input">
-                  <input type="password" placeholder="Password"/>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-media"><i class="icon icon-form-tel"></i></div>
-              <div class="item-inner">
-                <div class="item-title label">Phone</div>
-                <div class="item-input">
-                  <input type="tel" placeholder="Phone"/>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-media"><i class="icon icon-form-gender"></i></div>
-              <div class="item-inner">
-                <div class="item-title label">Gender</div>
-                <div class="item-input">
-                  <select>
-                    <option>Male</option>
-                    <option>Female</option>
-                  </select>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-media"><i class="icon icon-form-calendar"></i></div>
-              <div class="item-inner">
-                <div class="item-title label">Birth date</div>
-                <div class="item-input">
-                  <input type="date" placeholder="Birth day" value="2014-04-30"/>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-media"><i class="icon icon-form-calendar"></i></div>
-              <div class="item-inner">
-                <div class="item-title label">Date time</div>
-                <div class="item-input">
-                  <input type="datetime-local" placeholder="Birth day"/>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-media"><i class="icon icon-form-toggle"></i></div>
-              <div class="item-inner">
-                <div class="item-title label">Switch</div>
-                <div class="item-input">
-                  <label class="label-switch">
-                    <input type="checkbox"/>
-                    <div class="checkbox"></div>
-                  </label>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-media"><i class="icon icon-form-settings"></i></div>
-              <div class="item-inner">
-                <div class="item-title label">Slider</div>
-                <div class="item-input">
-                  <div class="range-slider">
-                    <input type="range" min="0" max="100" value="50" step="0.1"/>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li class="align-top">
-            <div class="item-content">
-              <div class="item-media"><i class="icon icon-form-comment"></i></div>
-              <div class="item-inner">
-                <div class="item-title label">Textarea</div>
-                <div class="item-input">
-                  <textarea></textarea>
-                </div>
-              </div>
-            </div>
-          </li>
-        </ul>
-      </div>
-      <div class="content-block-title">Icons and inputs</div>
-      <div class="list-block">
-        <ul>
-          <li>
-            <div class="item-content">
-              <div class="item-media"><i class="icon icon-form-name"></i></div>
-              <div class="item-inner">
-                <div class="item-input">
-                  <input type="text" placeholder="Your name"/>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-media"><i class="icon icon-form-email"></i></div>
-              <div class="item-inner">
-                <div class="item-input">
-                  <input type="email" placeholder="E-mail"/>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-media"><i class="icon icon-form-gender"></i></div>
-              <div class="item-inner">
-                <div class="item-input">
-                  <select>
-                    <option>Male</option>
-                    <option>Female</option>
-                  </select>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-media"><i class="icon icon-form-calendar"></i></div>
-              <div class="item-inner">
-                <div class="item-input">
-                  <input type="date" placeholder="Birth day" value="2014-04-30"/>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-media"><i class="icon icon-form-toggle"></i></div>
-              <div class="item-inner">
-                <div class="item-input">
-                  <label class="label-switch">
-                    <input type="checkbox"/>
-                    <div class="checkbox"></div>
-                  </label>
-                </div>
-              </div>
-            </div>
-          </li>
-        </ul>
-      </div>
-      <div class="content-block-title">Labels and inputs</div>
-      <div class="list-block">
-        <ul>
-          <li>
-            <div class="item-content">
-              <div class="item-inner">
-                <div class="item-title label">Name</div>
-                <div class="item-input">
-                  <input type="text" placeholder="Your name"/>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-inner">
-                <div class="item-title label">E-mail</div>
-                <div class="item-input">
-                  <input type="email" placeholder="E-mail"/>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-inner">
-                <div class="item-title label">Gender</div>
-                <div class="item-input">
-                  <select>
-                    <option>Male</option>
-                    <option>Female</option>
-                  </select>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-inner">
-                <div class="item-title label">Birth date</div>
-                <div class="item-input">
-                  <input type="date" placeholder="Birth day" value="2014-04-30"/>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-inner">
-                <div class="item-title label">Switch</div>
-                <div class="item-input">
-                  <label class="label-switch">
-                    <input type="checkbox"/>
-                    <div class="checkbox"></div>
-                  </label>
-                </div>
-              </div>
-            </div>
-          </li>
-        </ul>
-      </div>
-      <div class="content-block-title">Just inputs</div>
-      <div class="list-block">
-        <ul>
-          <li>
-            <div class="item-content">
-              <div class="item-inner">
-                <div class="item-input">
-                  <input type="text" placeholder="Your name"/>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-inner">
-                <div class="item-input">
-                  <input type="email" placeholder="E-mail"/>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-inner">
-                <div class="item-input">
-                  <select>
-                    <option>Male</option>
-                    <option>Female</option>
-                  </select>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-inner">
-                <div class="item-input">
-                  <input type="date" placeholder="Birth day" value="2014-04-30"/>
-                </div>
-              </div>
-            </div>
-          </li>
-        </ul>
-      </div>
-      <div class="content-block-title">Inset, just inputs</div>
-      <div class="list-block inset">
-        <ul>
-          <ul></ul>
-          <li>
-            <div class="item-content">
-              <div class="item-inner">
-                <div class="item-input">
-                  <input type="text" placeholder="Your name"/>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-inner">
-                <div class="item-input">
-                  <input type="email" placeholder="E-mail"/>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-inner">
-                <div class="item-input">
-                  <select>
-                    <option>Male</option>
-                    <option>Female</option>
-                  </select>
-                </div>
-              </div>
-            </div>
-          </li>
-          <li>
-            <div class="item-content">
-              <div class="item-inner">
-                <div class="item-input">
-                  <input type="date" placeholder="Birth day" value="2014-04-30"/>
-                </div>
-              </div>
-            </div>
-          </li>
-        </ul>
-      </div>
-    </div>
-  </div>
-</div>