compass_radix 0.0.6 → 0.0.7

data/stylesheets/_compass_radix_responsive.scss

@@ -10,4 +10,5 @@
 // Radix Theme CSS
 // --------------------------------------------------
 @import "compass_radix/responsive_menu";
-@import "compass_radix/responsive_form";
+@import "compass_radix/responsive_form";
+@import "compass_radix/responsive_navbar";

data/stylesheets/compass_radix/_menu.scss

@@ -119,37 +119,6 @@
   }
 }
 
-
-@media (max-width: 979px) {
-  #main-menu {
-    float: none;
-    > ul.menu {
-      li {
-        display: block;
-        float: none;
-        margin-bottom: 2px;
-        a {
-          display: block;
-          padding: 9px 15px;
-          font-weight: bold;
-          color: $navbarLinkColor;
-          @include border-radius(3px);
-          &:hover {
-            color: $navbarLinkColorHover;
-            text-decoration: none;
-            background-color: $navbarLinkBackgroundHover;
-          }
-        }
-        &.open {
-          ul.menu {
-            display: none !important;
-          }
-        }
-      }
-    }
-  }
-}
-
 // Pane Menu Tree
 // --------------------------------------------------
 .pane-menu-tree {  

data/stylesheets/compass_radix/_mixin.scss

@@ -22,4 +22,56 @@
     border-color: #ddd;
     border-color: rgba(0,0,0,.15);
   }
+}
+
+@mixin btn() {
+  display: inline-block;
+  @include ctb-ie7-inline-block();
+  padding: 4px 12px;
+  margin-bottom: 0; // For input.btn
+  font-size: $baseFontSize;
+  line-height: $baseLineHeight;
+  text-align: center;
+  vertical-align: middle;
+  cursor: pointer;
+  @include ctb-buttonBackground($btnBackground, $btnBackgroundHighlight, $grayDark, 0 1px 1px rgba(255,255,255,.75));
+  border: 1px solid $btnBorder;
+  *border: 0; // Remove the border to prevent IE7's black border on input:focus
+  border-bottom-color: darken($btnBorder, 10%);
+  @include ctb-border-radius($baseBorderRadius);
+  @include ctb-ie7-restore-left-whitespace(); // Give IE7 some love
+  @include ctb-box-shadow(#{inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05)});
+
+  // Hover state
+  &:hover {
+    color: $grayDark;
+    text-decoration: none;
+    background-position: 0 -15px;
+
+    // transition is only when going to hover, otherwise the background
+    // behind the gradient (there for IE<=9 fallback) gets mismatched
+    @include ctb-transition(background-position .1s linear);
+  }
+
+  // Focus state for keyboard and accessibility
+  &:focus {
+    @include ctb-tab-focus();
+  }
+
+  // Active state
+  &.active,
+  &:active {
+    background-image: none;
+    outline: 0;
+    @include ctb-box-shadow(#{inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05)});
+  }
+
+  // Disabled state
+  &.disabled,
+  &[disabled] {
+    cursor: default;
+    background-image: none;
+    @include ctb-opacity(65);
+    @include ctb-box-shadow(none);
+  }
 }

data/stylesheets/compass_radix/_navbar.scss

@@ -202,98 +202,4 @@
   .navbar-tray {
     top: 0 !important;
   }
-}
-
-// Tablet
-@media (min-width: 768px) and (max-width: 979px) {
-  #navbar {
-    .navbar-bar {
-      .section {
-        ul.menu {
-          li {
-            a {
-              padding: 8px 15px 9px !important;
-              margin: 0;
-              text-align: center;
-              text-indent: 0;
-              width: auto !important;
-              height: auto !important;
-              i {
-                font-size: 1.8em;
-                width: 0.9em;
-                height: 0.9em;
-                line-height: 100%;
-                margin: 0;
-                text-align: center;
-                text-indent: 0;
-                vertical-align: middle;
-              }
-              span {
-                span {
-                  display: none;
-                }
-              }
-            }
-          }
-        }
-      }
-    }
-  }
-  .menu-tray-open {
-    .navbar-bar {
-      a {
-        display: none !important;
-        &.toggle-tray {
-          display: block !important;
-        }
-      }
-    }
-  }
-}
-
-// Mobile
-@media (max-width: 767px) {
-  #navbar {
-    .navbar-bar {
-      .section {
-        ul.menu {
-          li {
-            a {
-              padding: 8px 15px 9px !important;
-              margin: 0;
-              text-align: center;
-              text-indent: 0 !important;
-              width: auto !important;
-              height: auto !important;
-              i {
-                font-size: 1.8em;
-                width: 0.9em;
-                height: 0.9em;
-                line-height: 100%;
-                margin: 0;
-                text-align: center;
-                text-indent: 0;
-                vertical-align: middle;
-              }
-              span {
-                span {
-                  display: none;
-                }
-              }
-            }
-          }
-        }
-      }
-    }
-  }
-  .menu-tray-open {
-    .navbar-bar {
-      a {
-        display: none !important;
-        &.toggle-tray {
-          display: block !important;
-        }
-      }
-    }
-  }
 }

data/stylesheets/compass_radix/_responsive_navbar.scss

@@ -0,0 +1,97 @@
+// 
+// Styles for Navbar module
+// --------------------------------------------------
+
+// Tablet
+@media (min-width: 768px) and (max-width: 979px) {
+  #navbar {
+    .navbar-bar {
+      .section {
+        ul.menu {
+          li {
+            a {
+              padding: 8px 15px 9px !important;
+              margin: 0;
+              text-align: center;
+              text-indent: 0;
+              width: auto !important;
+              height: auto !important;
+              i {
+                font-size: 1.8em;
+                width: 0.9em;
+                height: 0.9em;
+                line-height: 100%;
+                margin: 0;
+                text-align: center;
+                text-indent: 0;
+                vertical-align: middle;
+              }
+              span {
+                span {
+                  display: none;
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+  .menu-tray-open {
+    .navbar-bar {
+      a {
+        display: none !important;
+        &.toggle-tray {
+          display: block !important;
+        }
+      }
+    }
+  }
+}
+
+// Mobile
+@media (max-width: 767px) {
+  #navbar {
+    .navbar-bar {
+      .section {
+        ul.menu {
+          li {
+            a {
+              padding: 8px 15px 9px !important;
+              margin: 0;
+              text-align: center;
+              text-indent: 0 !important;
+              width: auto !important;
+              height: auto !important;
+              i {
+                font-size: 1.8em;
+                width: 0.9em;
+                height: 0.9em;
+                line-height: 100%;
+                margin: 0;
+                text-align: center;
+                text-indent: 0;
+                vertical-align: middle;
+              }
+              span {
+                span {
+                  display: none;
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+  .menu-tray-open {
+    .navbar-bar {
+      a {
+        display: none !important;
+        &.toggle-tray {
+          display: block !important;
+        }
+      }
+    }
+  }
+}

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: compass_radix
 version: !ruby/object:Gem::Version
-  version: 0.0.6
+  version: 0.0.7
   prerelease: 
 platform: ruby
 authors:
@@ -66,6 +66,7 @@ files:
 - stylesheets/compass_radix/_panel.scss
 - stylesheets/compass_radix/_responsive_form.scss
 - stylesheets/compass_radix/_responsive_menu.scss
+- stylesheets/compass_radix/_responsive_navbar.scss
 - stylesheets/compass_radix/_structure.scss
 - stylesheets/compass_radix/_user.scss
 - stylesheets/compass_radix/_variable.scss