From 915358f151d6f718b44af982366a322e129a3203 Mon Sep 17 00:00:00 2001
From: Max Lynch <max@drifty.com>
Date: Tue, 14 Jul 2015 16:07:02 -0500
Subject: [PATCH] Cleaner slides

---
 .../components/app/test/sink/pages/slides.ts  | 25 ++++++++++++++-----
 ionic/components/slides/slides.scss           |  1 +
 2 files changed, 20 insertions(+), 6 deletions(-)

diff --git a/ionic/components/app/test/sink/pages/slides.ts b/ionic/components/app/test/sink/pages/slides.ts
index ad6a0972b0..2cc0f9c6ff 100644
--- a/ionic/components/app/test/sink/pages/slides.ts
+++ b/ionic/components/app/test/sink/pages/slides.ts
@@ -16,12 +16,12 @@ import {SinkPage} from '../sink-page';
       Slides are perfect for making image slideshows,
       swipe tutorials, or document viewers.
     </p>
-    <ion-slides style="left: -15px; right: -15px; height: 100px">
-      <ion-slide style="background-color: blue">
-        <h2>Page 1</h2>
+    <ion-slides style="height: 300px">
+      <ion-slide style="background-color: #387ef5">
+        <h2 style="color: #fff">Page 1</h2>
       </ion-slide>
-      <ion-slide style="background-color: yellow">
-        <h2>Page 2</h2>
+      <ion-slide style="background-color: rgb(245, 255, 96)">
+        <h2 style="color: #222;"">Page 2</h2>
       </ion-slide>
       <ion-slide style="background-color: pink">
         <h2>Page 3</h2>
@@ -29,13 +29,26 @@ import {SinkPage} from '../sink-page';
       <ion-slide style="background-color: red">
         <h2>Page 4</h2>
       </ion-slide>
-      <ion-slide style="background-color: cyan">
+      <ion-slide style="background-color: rgb(1, 157, 157)">
         <h2>Page 5</h2>
       </ion-slide>
       <ion-pager>
       </ion-pager>
     </ion-slides>
   </ion-content>
+  <style>
+    .slide {
+      display: flex !important;
+      align-items: center;
+      justify-content: center;
+    }
+    .slide h2 {
+      color: #fff;
+      text-transform: uppercase;
+      letter-spacing: 2px;
+      font-size: 16px;
+    }
+  </style>
   `
 })
 export class SlidePage extends SinkPage {
diff --git a/ionic/components/slides/slides.scss b/ionic/components/slides/slides.scss
index 7c20fa5c24..a0d9cc6fa8 100644
--- a/ionic/components/slides/slides.scss
+++ b/ionic/components/slides/slides.scss
@@ -1,6 +1,7 @@
 $z-index-slider-pager:            1 !default;
 
 .slides {
+  display: block;
   width: 100%;
   height: 100%;
   position: relative;