From af2dfa582728d8a0e762316db326a710e626a70a Mon Sep 17 00:00:00 2001
From: connors <connor.sears@github.com>
Date: Sat, 21 Dec 2013 14:19:11 -0800
Subject: [PATCH 1/2] fixing the ios theme after recent changes.

---
 _includes/header.html   |  2 +-
 dist/ios-theme.css      | 75 ++++++++++++++++++++++++++++++--
 lib/sass/theme-ios.scss | 94 ++++++++++++++++++++++++++++++++++++++---
 3 files changed, 161 insertions(+), 10 deletions(-)

diff --git a/_includes/header.html b/_includes/header.html
index 0ae8145..9c2b79f 100644
--- a/_includes/header.html
+++ b/_includes/header.html
@@ -7,7 +7,7 @@
 <meta name="apple-mobile-web-app-capable" content="yes">
 <meta name="apple-mobile-web-app-status-bar-style" content="black">
 <link rel="stylesheet" href="dist/ratchet.css">
-<!-- <link rel="stylesheet" href="dist/ios-theme.css"> -->
+<link rel="stylesheet" href="dist/ios-theme.css">
 <link rel="stylesheet" href="assets/css/docs.css">
 <link rel="stylesheet" href="assets/css/pygments.css">
 <!--[if lt IE 9]><script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
diff --git a/dist/ios-theme.css b/dist/ios-theme.css
index 0c54f6d..0a023c9 100644
--- a/dist/ios-theme.css
+++ b/dist/ios-theme.css
@@ -34,6 +34,12 @@
   box-shadow: 0 0 -1px rgba(0, 0, 0, 0.85);
 }
 
+.tab-item.active .tab-label,
+.tab-item.active .icon, .tab-item:active .tab-label,
+.tab-item:active .icon {
+  color: #007aff;
+}
+
 .popover .bar-nav {
   border-bottom: 1px solid rgba(0, 0, 0, 0.15);
 }
@@ -239,20 +245,81 @@ textarea,
 }
 
 .segmented-controller {
+  color: #929292;
   background-color: transparent;
-  border: 1px solid #007aff;
+  border: 1px solid #929292;
 }
 .segmented-controller li {
-  border-left: 1px solid #007aff;
+  border-color: #929292;
   -webkit-transition: background-color 0.1s linear;
   transition: background-color 0.1s linear;
 }
-.segmented-controller li > a {
-  color: #007aff;
+.segmented-controller li:active {
+  background-color: #ebebeb;
 }
 .segmented-controller li.selected {
+  background-color: #929292;
+}
+.segmented-controller li.selected > a {
+  color: #fff;
+}
+
+.segmented-controller-primary {
+  border: 1px solid #007aff;
+}
+.segmented-controller-primary li {
+  border-color: inherit;
+}
+.segmented-controller-primary li > a {
+  color: #007aff;
+}
+.segmented-controller-primary li:active {
+  background-color: #b3d7ff;
+}
+.segmented-controller-primary li.selected {
   background-color: #007aff;
 }
+.segmented-controller-primary li.selected > a {
+  color: #fff;
+}
+
+.segmented-controller-positive {
+  border: 1px solid #4cd964;
+}
+.segmented-controller-positive li {
+  border-color: inherit;
+}
+.segmented-controller-positive li > a {
+  color: #4cd964;
+}
+.segmented-controller-positive li:active {
+  background-color: #dff8e3;
+}
+.segmented-controller-positive li.selected {
+  background-color: #4cd964;
+}
+.segmented-controller-positive li.selected > a {
+  color: #fff;
+}
+
+.segmented-controller-negative {
+  border: 1px solid #dd524d;
+}
+.segmented-controller-negative li {
+  border-color: inherit;
+}
+.segmented-controller-negative li > a {
+  color: #dd524d;
+}
+.segmented-controller-negative li:active {
+  background-color: #fae4e3;
+}
+.segmented-controller-negative li.selected {
+  background-color: #dd524d;
+}
+.segmented-controller-negative li.selected > a {
+  color: #fff;
+}
 
 .popover {
   border-radius: 12px;
diff --git a/lib/sass/theme-ios.scss b/lib/sass/theme-ios.scss
index db9883c..8c9e737 100644
--- a/lib/sass/theme-ios.scss
+++ b/lib/sass/theme-ios.scss
@@ -63,6 +63,16 @@ $timing-fuction: cubic-bezier(.1, .5, .1, 1); // Inspired by @c2prods
   border-top: 0;
   @include box-shadow(0 0 -1px rgba(0,0,0,.85));
 }
+.tab-item {
+  // Active states for the tab bar
+  &.active,
+  &:active {
+    .tab-label,
+    .icon {
+      color: $primary-color;
+    }
+  }
+}
 
 
 // Nav bar in popovers
@@ -336,21 +346,95 @@ textarea,
 // --------------------------------------------------
 
 .segmented-controller {
+  color: $default-color;
   background-color: transparent;
-  border: 1px solid $primary-color;
+  border: 1px solid $default-color;
 
   li {
-    border-left: 1px solid $primary-color;
+    border-color: $default-color;
     @include transition(background-color .1s linear);
     
-    // Link that fills each section
+    &:active {
+      background-color: lighten($default-color, 35%);
+    }
+    &.selected {
+      background-color: $default-color;
+      
+      > a {
+        color: #fff;
+      }
+    }
+  }
+}
+
+// Other segmented controller types
+// --------------------------------------------------
+
+// Primary
+.segmented-controller-primary {
+  border: 1px solid $primary-color;
+
+  li {
+    border-color: inherit;
+    
     > a {
       color: $primary-color;
     }
-
-    // Selected segment of controller
+    &:active {
+      background-color: lighten($primary-color, 35%);
+    }
     &.selected {
       background-color: $primary-color;
+      
+      > a {
+        color: #fff;
+      }
+    }
+  }
+}
+
+// Positive
+.segmented-controller-positive {
+  border: 1px solid $positive-color;
+
+  li {
+    border-color: inherit;
+    
+    > a {
+      color: $positive-color;
+    }
+    &:active {
+      background-color: lighten($positive-color, 35%);
+    }
+    &.selected {
+      background-color: $positive-color;
+      
+      > a {
+        color: #fff;
+      }
+    }
+  }
+}
+
+// Negative
+.segmented-controller-negative {
+  border: 1px solid $negative-color;
+
+  li {
+    border-color: inherit;
+    
+    > a {
+      color: $negative-color;
+    }
+    &:active {
+      background-color: lighten($negative-color, 35%);
+    }
+    &.selected {
+      background-color: $negative-color;
+      
+      > a {
+        color: #fff;
+      }
     }
   }
 }

From fa3d99e3e291b69d22c9cf3ca935107c78badb74 Mon Sep 17 00:00:00 2001
From: connors <connor.sears@github.com>
Date: Sat, 21 Dec 2013 14:31:40 -0800
Subject: [PATCH 2/2] adding a 14px font size to toggle text.

---
 dist/ratchet.css      | 1 +
 lib/sass/toggles.scss | 1 +
 2 files changed, 2 insertions(+)

diff --git a/dist/ratchet.css b/dist/ratchet.css
index c49d264..60a26be 100644
--- a/dist/ratchet.css
+++ b/dist/ratchet.css
@@ -1070,6 +1070,7 @@ input[type="button"] {
   top: 3px;
   right: 11px;
   color: #999;
+  font-size: 14px;
   text-transform: uppercase;
   content: "Off";
 }
diff --git a/lib/sass/toggles.scss b/lib/sass/toggles.scss
index 165e34a..c87a528 100644
--- a/lib/sass/toggles.scss
+++ b/lib/sass/toggles.scss
@@ -32,6 +32,7 @@
     top: 3px;
     right: 11px;
     color: #999;
+    font-size: 14px;
     text-transform: uppercase;
     content: "Off";
   }