started pull to refresh

dist/framework-with-theme.css

@@ -66,6 +66,18 @@ main > * {
 .show {
   display: block; }
 
+.ptr-capable {
+  -webkit-user-drag: element; }
+
+.ptr-content {
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  overflow: auto;
+  height: 0; }
+
 .button {
   position: relative;
   display: block;
@@ -129,7 +141,7 @@ main > * {
 
 /* Pad top/bottom of content so it doesn't hide behind .bar-title and .bar-tab.
    Note: For these to work, content must come after both bars in the markup */
-.bar-header ~ main {
+.bar-header ~ main, .has-header {
   top: 50px; }
 
 .has-footer {
@@ -487,3 +499,6 @@ a.list-item {
 
 a.list-item {
   color: #333333; }
+
+.ptr-content {
+  background: #eee; }

example/pull-to-refresh.html

@@ -17,10 +17,15 @@
         <h1 class="title">Pull To Refresh</h1>
       </header>
 
-      <main>
-        
+      <main class="ptr-capable">
+        <p>Pull the content down to refresh.</p>
       </main>
 
+      <section class="ptr-content has-header">
+        <div class="pulling">KEEP GOING</div>
+        <div class="refreshing">REFRESHING!</div>
+      </section>
+
     </section>
 
   </body>

scss/framework-structure.scss

@@ -9,12 +9,13 @@
   "framework/structure/alerts",
   "framework/structure/base",
 
+  "framework/structure/pull-to-refresh",
+
   "framework/structure/button",
 
   "framework/structure/bar",
   "framework/structure/tabs",
   
-  
   "framework/structure/button-group",
 
   "framework/structure/form",

scss/framework-theme-default.scss

@@ -10,4 +10,5 @@
   "framework/theme/default/button",
   "framework/theme/default/icon",
   "framework/theme/default/listview",
+  "framework/theme/default/pull-to-refresh",
   "framework/theme/default/table";

scss/framework/structure/_bar.scss

@@ -75,7 +75,7 @@
 
 /* Pad top/bottom of content so it doesn't hide behind .bar-title and .bar-tab.
    Note: For these to work, content must come after both bars in the markup */
-.bar-header ~ main {
+.bar-header ~ main, .has-header {
   top: $barHeight;
 }
 

scss/framework/structure/_pull-to-refresh.scss

@@ -0,0 +1,22 @@
+
+.ptr-capable {
+  -webkit-user-drag: element;
+}
+
+.ptr-content {
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  overflow: auto;
+  height: 0;
+}
+
+.ptr-content .pulling {
+  display: none;
+}
+
+.ptr-content .refreshing {
+  display: none;
+}

scss/framework/theme/default/_pull-to-refresh.scss

@@ -0,0 +1,4 @@
+
+.ptr-content {
+  background: #eee;
+}