final derps

dist/ios-theme.css

@@ -8,7 +8,7 @@
  * =====================================================
  */
 
-.bar {
+[class*="bar-"] {
   border-bottom: 0;
   background-color: rgba(247, 247, 247, 0.98);
   -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.85);
@@ -80,6 +80,16 @@ input[type=search]:focus {
   text-align: left;
 }
 
+select,
+textarea,
+.input-group {
+  height: auto;
+}
+
+.input-group {
+  padding: 0;
+}
+
 .input-group input {
   border: 0;
   background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%' height='1'><rect fill='#c8c7cc' x='0' y='0' width='100%' height='0.5'/></svg>");
@@ -104,6 +114,7 @@ input[type=search]:focus {
 }
 
 [class*="button"] {
+  border: 1px solid #929292;
   color: #929292;
   background-color: transparent;
   -webkit-transition: background-color, opacity, color;
@@ -118,30 +129,100 @@ input[type=search]:focus {
   background-color: #929292;
 }
 
+.button-primary {
+  color: #007aff;
+  border: 1px solid #007aff;
+}
+.button-primary:active, .button-primary.active, .button-primary.button-filled {
+  background-color: #007aff;
+}
+
+.button-positive {
+  color: #4cd964;
+  border: 1px solid #4cd964;
+}
+.button-positive:active, .button-positive.active, .button-positive.button-filled {
+  background-color: #4cd964;
+}
+
+.button-negative {
+  color: #dd524d;
+  border: 1px solid #dd524d;
+}
+.button-negative:active, .button-negative.active, .button-negative.button-filled {
+  background-color: #dd524d;
+}
+
+.button-link {
+  color: #007aff;
+}
+.button-link:active, .button-link.active {
+  color: #007aff;
+}
+
 .button-link:active, .button-link.active {
   color: #007aff;
   opacity: .3;
 }
 
-.bar-nav {
+.bar-nav [class*="button"] {
+  color: #007aff;
   -webkit-transition: opacity 0.2s linear;
   transition: opacity 0.2s linear;
 }
+.bar-nav .button-prev:before,
+.bar-nav .button-prev:after,
+.bar-nav .button-next:before,
+.bar-nav .button-next:after {
+  background-color: #007aff;
+}
 
 [class*="badge"] {
   color: #929292;
 }
 [class*="badge"].badge-filled {
+  color: #929292;
+}
+
+.badge-primary {
+  color: #007aff;
+}
+.badge-primary.badge-filled {
   color: #fff;
+  background-color: #007aff;
+}
+
+.badge-positive {
+  color: #4cd964;
+}
+.badge-positive.badge-filled {
+  color: #fff;
+  background-color: #4cd964;
+}
+
+.badge-negative {
+  color: #dd524d;
+}
+.badge-negative.badge-filled {
+  color: #fff;
+  background-color: #dd524d;
 }
 
 .segmented-controller {
   background-color: transparent;
+  border: 1px solid #007aff;
 }
 .segmented-controller li {
+  border-left: 1px solid #007aff;
   -webkit-transition: background-color 0.1s linear;
   transition: background-color 0.1s linear;
 }
+.segmented-controller li > a {
+  color: #007aff;
+}
+.segmented-controller li.selected {
+  background-color: #007aff;
+}
 
 .popover {
   border-radius: 12px;
@@ -178,6 +259,7 @@ input[type=search]:focus {
   width: 35px;
 }
 .toggle.active {
+  border: 2px solid #4cd964;
   background-color: transparent;
   -webkit-box-shadow: inset 0 0 0 13px #4cd964;
   box-shadow: inset 0 0 0 13px #4cd964;
@@ -187,6 +269,9 @@ input[type=search]:focus {
   -webkit-transform: translate3d(10px, 0, 0) !important;
   transform: translate3d(10px, 0, 0) !important;
 }
+.toggle.active .toggle-handle {
+  border-color: #4cd964;
+}
 
 .content.fade {
   -webkit-transition: opacity 0.2s ease-in-out;

lib/sass/theme-ios.scss

@@ -111,9 +111,17 @@ input[type=search] {
 input[type=search]:focus {
   text-align: left;
 }
+select,
+textarea,
+.input-group {
+  height: auto;
+}
 
 // Input groups (cluster multiple inputs together into a single group)
 // -------------------------------------------------------------------
+.input-group {
+  padding: 0;
+}
 .input-group input {
   border: 0;
   @include hairline(single, #c8c7cc, 15px);
@@ -142,6 +150,7 @@ input[type=search]:focus {
 // --------------------------------------------------
 
 [class*="button"] {
+  border: 1px solid $default-color;
   color: $default-color;
   background-color: transparent;
   @include transition(background-color, opacity, color);
@@ -157,6 +166,56 @@ input[type=search]:focus {
   }
 }
 
+
+// Other button types
+// --------------------------------------------------
+
+// Primary button (Default color is blue)
+.button-primary {
+  color: $primary-color;
+  border: 1px solid $primary-color;
+
+  &:active,
+  &.active,
+  &.button-filled {
+    background-color: $primary-color;
+  }
+}
+
+// Positive button (Default color is green)
+.button-positive {
+  color: $positive-color;
+  border: 1px solid $positive-color;
+
+  &:active,
+  &.active,
+  &.button-filled {
+    background-color: $positive-color;
+  }
+}
+
+// Negative button (Default color is red)
+.button-negative {
+  color: $negative-color;
+  border: 1px solid $negative-color;
+
+  &:active,
+  &.active,
+  &.button-filled {
+    background-color: $negative-color;
+  }
+}
+
+// Link button (Buttons that look like links)
+.button-link {
+  color: $primary-color;
+
+  &:active,
+  &.active {
+    color: $primary-color;
+  }
+}
+
 // Link button (Buttons that look like links)
 .button-link {
   &:active,
@@ -170,7 +229,20 @@ input[type=search]:focus {
 // --------------------------------------------------
 
 .bar-nav {
-  @include transition(opacity .2s linear);
+  [class*="button"] {
+    color: $primary-color;
+    @include transition(opacity .2s linear);
+  }
+
+  // Directional buttons in nav bars
+  // --------------------------------------------------
+
+  .button-prev:before,
+  .button-prev:after,
+  .button-next:before,
+  .button-next:after {
+    background-color: $primary-color;
+  }
 }
 
 
@@ -181,8 +253,42 @@ input[type=search]:focus {
 [class*="badge"] {
   color: $default-color;
 
+  &.badge-filled {
+    color: $default-color;
+  }
+}
+
+
+// Badge modifiers
+// --------------------------------------------------
+
+// Main badge
+.badge-primary {
+  color: $primary-color;
+
   &.badge-filled {
     color: #fff;
+    background-color: $primary-color;
+  }
+}
+
+// Positive badge
+.badge-positive {
+  color: $positive-color;
+
+  &.badge-filled {
+    color: #fff;
+    background-color: $positive-color;
+  }
+}
+
+// Negative badge
+.badge-negative {
+  color: $negative-color;
+
+  &.badge-filled {
+    color: #fff;
+    background-color: $negative-color;
   }
 }
 
@@ -193,9 +299,21 @@ input[type=search]:focus {
 
 .segmented-controller {
   background-color: transparent;
+  border: 1px solid $primary-color;
 
   li {
+    border-left: 1px solid $primary-color;
     @include transition(background-color .1s linear);
+    
+    // Link that fills each section
+    > a {
+      color: $primary-color;
+    }
+
+    // Selected segment of controller
+    &.selected {
+      background-color: $primary-color;
+    }
   }
 }
 
@@ -243,6 +361,7 @@ input[type=search]:focus {
   }
   // Active state for toggle
   &.active {
+    border: 2px solid $positive-color;
     background-color: transparent;
     @include box-shadow(inset 0 0 0 13px $positive-color);
 
@@ -251,6 +370,10 @@ input[type=search]:focus {
     .toggle-handle:active {
       @include transform(translate3d(10px,0,0) !important); // Evil important tag is used to overwrite js.
     }
+
+    .toggle-handle {
+      border-color: $positive-color;
+    }
   }
 }