Rebuild ratchet
[ratchet] / dist / ratchet.css
index 13d7670..9de25c4 100644 (file)
@@ -126,11 +126,11 @@ a {
   bottom: 0;
   left: 0;
   overflow: auto;
-  background: #fff;
+  background-color: #fff;
   -webkit-transition-property: top, bottom;
           transition-property: top, bottom;
-  -webkit-transition-duration: .2s, .2s;  
-          transition-duration: .2s, .2s;  
+  -webkit-transition-duration: .2s, .2s;
+          transition-duration: .2s, .2s;
   -webkit-transition-timing-function: linear, linear;
           transition-timing-function: linear, linear;
   -webkit-overflow-scrolling: touch;
@@ -158,9 +158,7 @@ a {
 }
 .bar-header-secondary ~ .content {
   top: 88px;
-}
-
-/* General bar styles
+}/* General bar styles
 -------------------------------------------------- */
 
 [class*="bar-"] {
@@ -542,6 +540,7 @@ a {
   border-bottom-width: 0;
 }
 
+
 /* List dividers
 -------------------------------------------------- */
 
@@ -604,9 +603,7 @@ a {
 
 .list .toggle {
   margin-top: -15px; /* Half height of toggle */
-}
-
-/* Forms
+}/* Forms
 -------------------------------------------------- */
 
 /* Force form elements to inherit font styles */
@@ -640,7 +637,7 @@ input[type="color"],
   height: 40px;
   padding: 10px;
   margin-bottom: 10px;
-  background: #fff;
+  background-color: #fff;
   border: 1px solid rgba(0, 0, 0, .2);
   border-radius: 3px;
   box-shadow: 0 1px 1px rgba(255, 255, 255, .2), inset 0 1px 1px rgba(0, 0, 0, .1);
@@ -725,9 +722,7 @@ select {
   padding-left: 0;
   margin-bottom: 0;
   border-bottom: 0;
-}
-
-/* General button styles
+}/* General button styles
 -------------------------------------------------- */
 
 [class*="button"] {
@@ -847,9 +842,7 @@ select {
   padding-top: 4px;
   padding-bottom: 4px;
   margin-right: 10px;
-}
-
-/* Chevrons
+}/* Chevrons
 -------------------------------------------------- */
 
 .chevron {
@@ -878,9 +871,7 @@ select {
   top: 7px;
   -webkit-transform: rotate(-45deg);
           transform: rotate(-45deg);
-}
-
-/* General count styles
+}/* General count styles
 -------------------------------------------------- */
 
 [class*="count"] {
@@ -924,9 +915,7 @@ select {
   background-color: #e71e1e;
   background-image: -webkit-linear-gradient(top, #e71e1e 0,#c71a1a 100%);
   background-image: linear-gradient(to bottom, #e71e1e 0, #c71a1a 100%);
-}
-
-/* Segmented controllers
+}/* Segmented controllers
 -------------------------------------------------- */
 
 .segmented-controller {
@@ -987,9 +976,7 @@ select {
 
 .segmented-controller-item.active {
   display: block;
-}
-
-/* Popovers (to be used with popovers.js)
+}/* Popovers (to be used with popovers.js)
 -------------------------------------------------- */
 
 .popover {
@@ -1141,9 +1128,39 @@ select {
   border: 1px solid #000;
   border-radius: 3px;
   -webkit-overflow-scrolling: touch;
+}/* Modals
+-------------------------------------------------- */
+.modal {
+  position: fixed; 
+  top: 0;
+  background-color: #fff;
+  width: 100%;
+
+  -webkit-transform: translate3d(0, 100%, 0);
+          transform: translate3d(0, 100%, 0);
+
+  -webkit-transition: -webkit-transform .25s ease-in-out, opacity 1ms .25s;
+          transition:         transform .25s ease-in-out, opacity 1ms .25s;
+
+  opacity: 0;
+  overflow: hidden;
+  z-index: 11; 
+
+  min-height: 100%;
 }
 
-/* Slider styles (to be used with sliders.js)
+/* Modal - When active
+-------------------------------------------------- */
+.modal.active {
+  -webkit-transition: -webkit-transform .25s ease-in-out;
+          transition:         transform: .25 ease-in-out;
+
+  -webkit-transform: translate3d(0, 0, 0);
+          transform: translate3d(0, 0, 0);
+
+  opacity: 1;
+  height: 100%;
+}/* Slider styles (to be used with sliders.js)
 -------------------------------------------------- */
 
 /* Width/height of slider */
@@ -1179,9 +1196,7 @@ select {
 /* Required reset of font-size to same as standard body */
 .slider > ul > li > * {
   font-size: 14px;
-}
-
-/* Toggle styles (to be used with toggles.js)
+}/* Toggle styles (to be used with toggles.js)
 -------------------------------------------------- */
 
 .toggle {
@@ -1246,9 +1261,7 @@ select {
   color: #fff;
   text-shadow: 0 -1px rgba(0, 0, 0, 0.25);
   content: "On";
-}
-
-/* Push styles (to be used with push.js)
+}/* Push styles (to be used with push.js)
 -------------------------------------------------- */
 
 /* Fade animation */