From 8a82dbe725f161ede5f27a1eae00c378e464407a Mon Sep 17 00:00:00 2001
From: Adam Bradley <adamdbradley@gmail.com>
Date: Tue, 12 Nov 2013 12:35:53 -0600
Subject: [PATCH] speling is hard, closes #123

---
 dist/css/ionic.css             | 40 +++++++++++++++++-----------------
 scss/_badge.scss               |  4 ++--
 scss/_bar.scss                 |  8 +++----
 scss/_button.scss              |  8 +++----
 scss/_items.scss               |  2 +-
 scss/_tabs.scss                |  8 +++----
 scss/_util.scss                | 12 +++++-----
 scss/_variables.scss           | 28 ++++++++++++------------
 test/button-bar.html           |  2 +-
 test/buttons.html              |  2 +-
 test/colors.html               |  6 ++---
 test/headers.html              |  2 +-
 test/tab-bars-icons-right.html |  2 +-
 13 files changed, 62 insertions(+), 62 deletions(-)

diff --git a/dist/css/ionic.css b/dist/css/ionic.css
index bc6ed0a814..2a9617060e 100644
--- a/dist/css/ionic.css
+++ b/dist/css/ionic.css
@@ -2608,12 +2608,12 @@ a.subdued‎ {
     color: white; }
     .bar.bar-energized .title {
       color: white; }
-  .bar.bar-royle {
+  .bar.bar-royal {
     background-color: #8a6de9;
     border-color: #552bdf;
     background-image: linear-gradient(0deg, #552bdf, #552bdf 50%, transparent 50%);
     color: white; }
-    .bar.bar-royle .title {
+    .bar.bar-royal .title {
       color: white; }
   .bar.bar-pure {
     background-color: white;
@@ -2827,18 +2827,18 @@ a.subdued‎ {
     box-shadow: none;
     font-size: 18px; }
 
-.bar-royle .button {
+.bar-royal .button {
   color: white;
   background-color: #8a6de9;
   border-color: #552bdf; }
-  .bar-royle .button:hover {
+  .bar-royal .button:hover {
     color: white;
     text-decoration: none; }
-  .bar-royle .button.active, .bar-royle .button:active {
+  .bar-royal .button.active, .bar-royal .button:active {
     background-color: #552bdf;
     box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.15);
     border-color: #552bdf; }
-  .bar-royle .button.button-clear {
+  .bar-royal .button.button-clear {
     color: white;
     background: none;
     box-shadow: none;
@@ -3021,7 +3021,7 @@ a.subdued‎ {
     background-image: linear-gradient(0deg, #d39511, #d39511 50%, transparent 50%);
     border-color: #d39511;
     color: white; }
-  .tabs.tabs-royle {
+  .tabs.tabs-royal {
     background-color: #8a6de9;
     background-image: linear-gradient(0deg, #552bdf, #552bdf 50%, transparent 50%);
     border-color: #552bdf;
@@ -3129,7 +3129,7 @@ a.subdued‎ {
     color: #66cc33; }
   .tab-item.active.tab-item-energized, .tab-item:active.tab-item-energized {
     color: #f0b840; }
-  .tab-item.active.tab-item-royle, .tab-item:active.tab-item-royle {
+  .tab-item.active.tab-item-royal, .tab-item:active.tab-item-royal {
     color: #8a6de9; }
   .tab-item.active.tab-item-pure, .tab-item:active.tab-item-pure {
     color: white; }
@@ -3351,11 +3351,11 @@ a.subdued‎ {
     background-color: #f0b840;
     color: white; }
 
-.item-royle.active {
+.item-royal.active {
   color: white;
   background-color: #8a6de9;
   border-color: #888888; }
-  .item-royle.active .item-content {
+  .item-royal.active .item-content {
     background-color: #8a6de9;
     color: white; }
 
@@ -3939,7 +3939,7 @@ button.item-button-right:after {
 .badge-energized {
   background-color: #f0b840; }
 
-.badge-royle {
+.badge-royal {
   background-color: #8a6de9; }
 
 .badge-pure {
@@ -4754,26 +4754,26 @@ input[type="range"] {
       color: #fff;
       box-shadow: none; }
 
-.button-royle {
+.button-royal {
   color: white;
   background-color: #8a6de9;
   border-color: #552bdf; }
-  .button-royle:hover {
+  .button-royal:hover {
     color: white;
     text-decoration: none; }
-  .button-royle.active, .button-royle:active {
+  .button-royal.active, .button-royal:active {
     background-color: #552bdf;
     box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.15);
     border-color: #552bdf; }
-  .button-royle.button-clear {
+  .button-royal.button-clear {
     color: #8a6de9;
     background: none;
     box-shadow: none; }
-  .button-royle.button-outline {
+  .button-royal.button-outline {
     background: transparent;
     border-color: #8a6de9;
     color: #8a6de9; }
-    .button-royle.button-outline.active, .button-royle.button-outline:active {
+    .button-royal.button-outline.active, .button-royal.button-outline:active {
       background-color: #8a6de9;
       color: #fff;
       box-shadow: none; }
@@ -5452,13 +5452,13 @@ a.button {
 .energized-border {
   border-color: #d39511; }
 
-.royle {
+.royal {
   color: #8a6de9; }
 
-.royle-bg {
+.royal-bg {
   background-color: #8a6de9; }
 
-.royle-border {
+.royal-border {
   border-color: #552bdf; }
 
 .pure {
diff --git a/scss/_badge.scss b/scss/_badge.scss
index c26e6dabb4..308cf8e72c 100644
--- a/scss/_badge.scss
+++ b/scss/_badge.scss
@@ -53,8 +53,8 @@
 .badge-energized {
   background-color: $energized;
 }
-.badge-royle {
-  background-color: $royle;
+.badge-royal {
+  background-color: $royal;
 }
 .badge-pure {
   background-color: $pure;
diff --git a/scss/_bar.scss b/scss/_bar.scss
index 1b2402f2c3..66c2d9dfcf 100644
--- a/scss/_bar.scss
+++ b/scss/_bar.scss
@@ -74,8 +74,8 @@
   &.bar-energized {
     @include bar-style($bar-energized-bg, $bar-energized-border, $bar-energized-text);
   }
-  &.bar-royle {
-    @include bar-style($bar-royle-bg, $bar-royle-border, $bar-royle-text);
+  &.bar-royal {
+    @include bar-style($bar-royal-bg, $bar-royal-border, $bar-royal-text);
   }
   &.bar-pure {
     @include bar-style($bar-pure-bg, $bar-pure-border, $bar-pure-text);
@@ -207,9 +207,9 @@
     @include button-clear(#fff, $bar-title-font-size);
   }
 }
-.bar-royle {
+.bar-royal {
   .button {
-    @include button-style($bar-royle-bg, $bar-royle-border, $bar-royle-active-bg, $bar-royle-active-border, $bar-royle-text);
+    @include button-style($bar-royal-bg, $bar-royal-border, $bar-royal-active-bg, $bar-royal-active-border, $bar-royal-text);
     @include button-clear(#fff, $bar-title-font-size);
   }
 }
diff --git a/scss/_button.scss b/scss/_button.scss
index 98aa5eeb78..a7adb5d8c1 100644
--- a/scss/_button.scss
+++ b/scss/_button.scss
@@ -160,10 +160,10 @@
   @include button-outline($button-energized-bg);
 }
 
-.button-royle {
-  @include button-style($button-royle-bg, $button-royle-border, $button-royle-active-bg, $button-royle-active-border, $button-royle-text);
-  @include button-clear($button-royle-bg);
-  @include button-outline($button-royle-bg);
+.button-royal {
+  @include button-style($button-royal-bg, $button-royal-border, $button-royal-active-bg, $button-royal-active-border, $button-royal-text);
+  @include button-clear($button-royal-bg);
+  @include button-outline($button-royal-bg);
 }
 
 .button-pure {
diff --git a/scss/_items.scss b/scss/_items.scss
index 2e54c1cfb5..4c6a9e8aa9 100644
--- a/scss/_items.scss
+++ b/scss/_items.scss
@@ -82,7 +82,7 @@
 .item-calm { @include item-style-active($calm, $subdued-dark, #fff); }
 .item-balanced { @include item-style-active($balanced, $subdued-dark, #fff); }
 .item-energized { @include item-style-active($energized, $subdued-dark, #fff); }
-.item-royle { @include item-style-active($royle, $subdued-dark, #fff); }
+.item-royal { @include item-style-active($royal, $subdued-dark, #fff); }
 .item-pure { @include item-style-active($pure, $subdued-dark, #fff); }
 .item-subdued-light { @include item-style-active($subdued-light, $subdued-dark, #fff); }
 .item-subdued { @include item-style-active($subdued, $subdued-dark, #fff); }
diff --git a/scss/_tabs.scss b/scss/_tabs.scss
index df1c4db5c0..26c5f6cc36 100644
--- a/scss/_tabs.scss
+++ b/scss/_tabs.scss
@@ -46,8 +46,8 @@
   &.tabs-energized {
     @include tab-style($tabs-energized-bg, $tabs-energized-border-color, $tabs-energized-text);
   }
-  &.tabs-royle {
-    @include tab-style($tabs-royle-bg, $tabs-royle-border-color, $tabs-royle-text);
+  &.tabs-royal {
+    @include tab-style($tabs-royal-bg, $tabs-royal-border-color, $tabs-royal-text);
   }
   &.tabs-pure {
     @include tab-style($tabs-pure-bg, $tabs-pure-border-color, $tabs-pure-text);
@@ -165,8 +165,8 @@
   &.tab-item-energized {
     color: $energized;
   }
-  &.tab-item-royle {
-    color: $royle;
+  &.tab-item-royal {
+    color: $royal;
   }
   &.tab-item-pure {
     color: $pure;
diff --git a/scss/_util.scss b/scss/_util.scss
index c89db98713..cc58fb11b6 100644
--- a/scss/_util.scss
+++ b/scss/_util.scss
@@ -131,14 +131,14 @@
   border-color: $button-energized-border;
 }
 
-.royle {
-  color: $royle;
+.royal {
+  color: $royal;
 }
-.royle-bg {
-  background-color: $royle;
+.royal-bg {
+  background-color: $royal;
 }
-.royle-border {
-  border-color: $button-royle-border;
+.royal-border {
+  border-color: $button-royal-border;
 }
 
 .pure {
diff --git a/scss/_variables.scss b/scss/_variables.scss
index 71aad605b6..55773fe0a1 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -15,7 +15,7 @@ $calm:                  #43cee6 !default;
 $balanced:              #66cc33 !default;
 $energized:             #f0b840 !default;
 $assertive:             #ef4e3a !default;
-$royle:                 #8a6de9 !default;
+$royal:                 #8a6de9 !default;
 
 $pure:                  #fff !default;
 $subdued-light:         #eee !default;
@@ -228,11 +228,11 @@ $button-energized-border:             darken($energized, 15%);
 $button-energized-active-bg:          darken($energized, 15%);
 $button-energized-active-border:      darken($energized, 15%);
 
-$button-royle-bg:                     $royle;
-$button-royle-text:                   #fff;
-$button-royle-border:                 darken($royle, 15%);
-$button-royle-active-bg:              darken($royle, 15%);
-$button-royle-active-border:          darken($royle, 15%);
+$button-royal-bg:                     $royal;
+$button-royal-text:                   #fff;
+$button-royal-border:                 darken($royal, 15%);
+$button-royal-active-bg:              darken($royal, 15%);
+$button-royal-active-border:          darken($royal, 15%);
 
 $button-pure-bg:                      $pure;
 $button-pure-text:                    #444;
@@ -328,11 +328,11 @@ $bar-energized-border:            $button-energized-border;
 $bar-energized-active-bg:         $button-energized-active-bg;
 $bar-energized-active-border:     $button-energized-active-border;
 
-$bar-royle-bg:                    rgba($button-royle-bg, $bar-transparency);
-$bar-royle-text:                  $button-royle-text;
-$bar-royle-border:                $button-royle-border;
-$bar-royle-active-bg:             $button-royle-active-bg;
-$bar-royle-active-border:         $button-royle-active-border;
+$bar-royal-bg:                    rgba($button-royal-bg, $bar-transparency);
+$bar-royal-text:                  $button-royal-text;
+$bar-royal-border:                $button-royal-border;
+$bar-royal-active-bg:             $button-royal-active-bg;
+$bar-royal-active-border:         $button-royal-active-border;
 
 $bar-pure-bg:                     rgba($button-pure-bg, $bar-transparency);
 $bar-pure-text:                   $button-pure-text;
@@ -409,9 +409,9 @@ $tabs-energized-bg:                $button-energized-bg;
 $tabs-energized-border-color:      $button-energized-border;
 $tabs-energized-text:              $button-energized-text;
 
-$tabs-royle-bg:                    $button-royle-bg;
-$tabs-royle-border-color:          $button-royle-border;
-$tabs-royle-text:                  $button-royle-text;
+$tabs-royal-bg:                    $button-royal-bg;
+$tabs-royal-border-color:          $button-royal-border;
+$tabs-royal-text:                  $button-royal-text;
 
 $tabs-pure-bg:                     $button-pure-bg;
 $tabs-pure-border-color:           $button-pure-border;
diff --git a/test/button-bar.html b/test/button-bar.html
index 0f5288ad18..461f62b4f4 100644
--- a/test/button-bar.html
+++ b/test/button-bar.html
@@ -88,7 +88,7 @@
       </p>
       
       <p>
-        <div class="button-bar bar-royle">
+        <div class="button-bar bar-royal">
           <a class="button">One</a>
           <a class="button">Two</a>
           <a class="button">Three</a>
diff --git a/test/buttons.html b/test/buttons.html
index c0bb8d3ebb..2bba508604 100644
--- a/test/buttons.html
+++ b/test/buttons.html
@@ -151,7 +151,7 @@
           <a class="button block button-assertive">.button-assertive</a>
           <a class="button block button-balanced">.button-balanced</a>
           <a class="button block button-energized">.button-energized</a>
-          <a class="button block button-royle">.button-royle</a>
+          <a class="button block button-royal">.button-royal</a>
           <a class="button block button-pure">.button-pure</a>
           <a class="button block button-subdued-light">.button-subdued-light</a>
           <a class="button block button-subdued">.button-subdued</a>
diff --git a/test/colors.html b/test/colors.html
index 4088f6431d..d5e624a62c 100644
--- a/test/colors.html
+++ b/test/colors.html
@@ -44,9 +44,9 @@
           energized
           <span class="color-demo energized-bg"></span>
         </li>
-        <li class="item royle">
-          royle
-          <span class="color-demo royle-bg"></span>
+        <li class="item royal">
+          royal
+          <span class="color-demo royal-bg"></span>
         </li>
         <li class="item pure dark-bg">
           pure
diff --git a/test/headers.html b/test/headers.html
index 60e2063db1..b5d4b37189 100644
--- a/test/headers.html
+++ b/test/headers.html
@@ -66,7 +66,7 @@
         </a>
       </div>
 
-      <header class="bar bar-header bar-royle">
+      <header class="bar bar-header bar-royal">
         <a class="button button-default">
           <i class="icon ion-home"></i>
         </a>
diff --git a/test/tab-bars-icons-right.html b/test/tab-bars-icons-right.html
index 7cd4a8b66b..f2d0c6e24f 100644
--- a/test/tab-bars-icons-right.html
+++ b/test/tab-bars-icons-right.html
@@ -28,7 +28,7 @@
 
     </main>
     
-    <nav id="tab-bar" class="tabs tabs-icon-right tabs-royle">
+    <nav id="tab-bar" class="tabs tabs-icon-right tabs-royal">
       <a class="tab-item" href="#">
         Fun
         <i class="icon ion-game-controller-a"></i>