hi

src/core/styles/_normalize.scss

@@ -1,12 +1,10 @@
-/*! normalize.css v3.0.2 | MIT License | github.com/necolas/normalize.css */
+/*! Ionic fork of normalize.css v3.0.2 | MIT License | github.com/necolas/normalize.css */
 
-// 1. Apply border-box so it can be inherited
-// 2. Prevent iOS text size adjust after orientation change, without disabling
+// 1. Prevent iOS text size adjust after orientation change, without disabling
 //    user zoom.
 html {
-  box-sizing: border-box;
-  -ms-text-size-adjust: 100%; // 2
-  -webkit-text-size-adjust: 100%; // 2
+  -ms-text-size-adjust: 100%; // 1
+  -webkit-text-size-adjust: 100%; // 1
 }
 *,
 *:before,
@@ -45,13 +43,13 @@ template {
 // ==========================================================================
 
 // Remove the gray background color from active links in IE 10.
-a {
+[ionic] a {
   background-color: transparent;
 }
 
 // Improve readability when focused and also mouse hovered in all browsers.
-a:active,
-a:hover {
+[ionic] a:active,
+[ionic] a:hover {
   outline: 0;
 }
 
@@ -59,29 +57,12 @@ a:hover {
 // Text-level semantics
 // ==========================================================================
 
-// Address styling not present in IE 8/9/10/11, Safari, and Chrome.
-abbr[title] {
-  border-bottom: 1px dotted;
-}
-
 // Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 b,
 strong {
   font-weight: bold;
 }
 
-// Address styling not present in Safari and Chrome.
-dfn {
-  font-style: italic;
-}
-
-// Address variable `h1` font-size and margin within `section` and `article`
-// contexts in Firefox 4+, Safari, and Chrome.
-h1 {
-  font-size: 2em;
-  margin: 0.67em 0;
-}
-
 // Address inconsistent and variable font size in all browsers.
 small {
   font-size: 80%;
@@ -109,12 +90,12 @@ sub {
 // ==========================================================================
 
 // Remove border when inside `a` element in IE 8/9/10.
-img {
+[ionic] img {
   border: 0;
 }
 
 // Correct overflow not hidden in IE 9/10/11.
-svg:not(:root) {
+[ionic] svg:not(:root) {
   overflow: hidden;
 }
 
@@ -123,12 +104,12 @@ svg:not(:root) {
 // ==========================================================================
 
 // Address margin not present in IE 8/9 and Safari.
-figure {
+[ionic] figure {
   margin: 1em 40px;
 }
 
 // Address differences between Firefox and other browsers.
-hr {
+[ionic] hr {
   -moz-box-sizing: content-box;
   box-sizing: content-box;
   height: 0;
@@ -204,10 +185,7 @@ html input[disabled] {
   cursor: default;
 }
 
-//
 // Remove inner padding and border in Firefox 4+.
-//
-
 button::-moz-focus-inner,
 input::-moz-focus-inner {
   border: 0;
@@ -220,7 +198,6 @@ input {
   line-height: normal;
 }
 
-//t you don't attempt to style these elements.
 // Firefox's implementation doesn't respect box-sizing, padding, or width.
 // 1. Address box sizing set to `content-box` in IE 8/9/10.
 // 2. Remove excess padding in IE 8/9/10.

src/core/styles/_scaffolding.scss

@@ -1,43 +1,22 @@
 
 [ionic] {
+  @include flex-display();
+  @include flex-direction(row);
+
   overflow: hidden;
   max-width: 100%;
   max-height: 100%;
   margin: 0;
   padding: 0;
   height: 100%;
-  word-wrap: break-word;
-  text-rendering: optimizeLegibility;
-  -webkit-user-drag: none;
-
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -moz-box;
-  display: -moz-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: row;
-
-  -webkit-tap-highlight-color: transparent;
-  -webkit-user-select: none;
-
-  background: red;
-  text-align: center;
-  font-size: 16px;
 
   .view {
     position: relative;
     width: 100%;
 
-    display: -webkit-box;
-    display: -webkit-flex;
-    display: -moz-box;
-    display: -moz-flex;
-    display: -ms-flexbox;
-    display: flex;
-
-    -webkit-flex-direction: column;
-    -webkit-flex: 1;
+    @include flex-display();
+    @include flex-direction(column);
+    @include flex(1);
   }
 
   .view > .container.shared-view {
@@ -48,49 +27,24 @@
   .tool-bar {
     display: block;
     min-height: 50px;
-    background: linear-gradient(45deg, #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%);
-    color: white;
   }
 
   .tool-bar-top {
-    -webkit-order: 10;
+    @include flex-order(20);
   }
 
   .tool-bar-bottom {
-    -webkit-order: 100;
+    @include flex-order(80);
   }
 
   .view > .container {
-    display: -webkit-box;
-    display: -webkit-flex;
-    display: -moz-box;
-    display: -moz-flex;
-    display: -ms-flexbox;
-    display: flex;
-
     position: relative;
-    -webkit-flex: 1;
-    -webkit-flex-direction: column;
-    -webkit-order: 50;
-
     overflow: hidden;
-  }
 
-  .nav-bar {
-    display: -webkit-box;
-    display: -webkit-flex;
-    display: -moz-box;
-    display: -moz-flex;
-    display: -ms-flexbox;
-    display: flex;
-
-    -webkit-justify-content: center;
-    -webkit-align-items: center;
-  }
-
-  .nav-bar > .nav-item {
-    -webkit-flex: 1;
-    max-width: 120px;
+    @include flex-display();
+    @include flex-order(40);
+    @include flex(1);
+    @include flex-direction(column);
   }
 
   .container > .view {
@@ -100,8 +54,7 @@
 
   .view > .container > .content {
     position: relative;
-    -webkit-flex: 1;
-    background: linear-gradient(135deg, #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%);
+    @include flex(1);
   }
 
   .scroll-content {
@@ -114,21 +67,5 @@
     -webkit-overflow-scrolling: touch;
   }
 
-  .pane {
-    max-width: 320px;
-    z-index: 99;
-  }
-
-  .view.pane > .container .content {
-    background: linear-gradient(45deg, #f0b7a1 0%,#8c3310 50%,#752201 51%,#bf6e4e 100%);
-  }
 }
 
-
-f {
-  display: block;
-  margin: 20px auto;
-  width: 200px;
-  height: 300px;
-  background: blue;
-}

src/core/styles/ionic.scss

@@ -20,5 +20,5 @@
 
 
 // Components (Conditional Includes)
-@if $include-button { @import "../components/button/button" }
-@if $include-tabbar { @import "../components/tabbar/tabbar" }
+@import "../components/button/button";
+@import "../components/tabbar/tabbar";