First Commit

hackatonApp/www/views/app/layouts/layouts.html

@@ -0,0 +1,28 @@
+<ion-view class="layouts-view">
+  <ion-nav-buttons side="left">
+    <button menu-toggle="left" class="button button-icon icon ion-navicon"></button>
+  </ion-nav-buttons>
+  <ion-nav-title>
+    <span>Layouts</span>
+  </ion-nav-title>
+  <ion-content>
+    <div class="list layouts-functionalities">
+      <a class="item item-icon-left item-icon-right" ui-sref="app.tinder-cards">
+        <i class="icon ion-happy-outline"></i>
+        <div>
+          <span class="title">Tinder Cards</span>
+          <p class="description">Awesome Tinder Cards</p>
+        </div>
+        <i class="icon ion-arrow-right-c"></i>
+      </a>
+      <a class="item item-icon-left item-icon-right" ui-sref="app.slider">
+        <i class="icon ion-arrow-swap"></i>
+        <div>
+          <span class="title">Slider</span>
+          <p class="description">Example of sliding cards</p>
+        </div>
+        <i class="icon ion-arrow-right-c"></i>
+      </a>
+    </div>
+  </ion-content>
+</ion-view>

hackatonApp/www/views/app/layouts/slider.html

@@ -0,0 +1,19 @@
+<ion-view class="slider-view">
+  <ion-nav-title>
+    <span>Slider</span>
+  </ion-nav-title>
+  <ion-content scroll="false">
+    <ion-slide-box show-pager="true">
+      <ion-slide ng-repeat="i in [1,2,3,4,5]">
+        <div class="list card">
+          <div class="item item-image">
+            <img ng-src="http://lorempixel.com/300/200/nature?v={{i}}">
+          </div>
+          <div class="item item-body">
+            <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
+          </div>
+        </div>
+      </ion-slide>
+    </ion-slide-box>
+  </ion-content>
+</ion-view>

hackatonApp/www/views/app/layouts/tinder-cards.html

@@ -0,0 +1,34 @@
+<ion-view class="tinder-cards-view">
+  <ion-nav-title>
+    <span>Tinder Cards</span>
+  </ion-nav-title>
+  <ion-content scroll="false">
+    <td-cards>
+      <td-card id="td-card" ng-repeat="card in cards"
+      on-transition-left="transitionLeft(card)"
+      on-transition-right="transitionRight(card)"
+      on-transition-out="transitionOut(card)"
+      on-destroy="cardDestroyed($index)"
+      on-swipe-left="cardSwipedLeft($index)"
+      on-swipe-right="cardSwipedRight($index)"
+      on-partial-swipe="cardPartialSwipe(amt)">
+        <div class="image">
+          <div class="no-text overlayBox">
+            <div class="noBox boxed">
+              Nope
+            </div>
+          </div>
+          <img ng-src="{{card.image}}">
+          <div class="yes-text overlayBox">
+            <div class="yesBox boxed">
+              Yes
+            </div>
+          </div>
+        </div>
+        <div class="title">
+          {{card.name}}
+        </div>
+      </td-card>
+    </td-cards>
+  </ion-content>
+</ion-view>