nitro_sg 3.0.0 → 3.0.1

data/sass-mixins/nitro-ui/navigation/navbar/_dropdowns-buttons.scss

@@ -0,0 +1,29 @@
+// Dropdown menus
+
+// Menu position and menu carets
+.navbar-nav > li > .dropdown-menu {
+  margin-top: 0;
+  @include border-top-radius(0);
+}
+// Menu position and menu caret support for dropups via extra dropup class
+.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu {
+  margin-bottom: 0;
+  @include border-top-radius($navbar-border-radius);
+  @include border-bottom-radius(0);
+}
+
+
+// Buttons in navbars
+//
+// Vertically center a button within a navbar (when *not* in a form).
+
+.navbar-btn {
+  @include navbar-vertical-align($input-height-base);
+
+  &.btn-sm {
+    @include navbar-vertical-align($input-height-small);
+  }
+  &.btn-xs {
+    @include navbar-vertical-align(22);
+  }
+}

data/sass-mixins/nitro-ui/navigation/navbar/_floats.scss

@@ -0,0 +1,21 @@
+// Component alignment
+//
+// Repurpose the pull utilities as their own navbar utilities to avoid specificity
+// issues with parents and chaining. Only do this when the navbar is uncollapsed
+// though so that navbar contents properly stack and align in mobile.
+//
+// Declared after the navbar components to ensure more specificity on the margins.
+
+@media (min-width: $grid-float-breakpoint) {
+  .navbar-left {
+    float: left !important;
+  }
+  .navbar-right {
+    float: right !important;
+    margin-right: -$navbar-padding-horizontal;
+
+    ~ .navbar-right {
+      margin-right: 0;
+    }
+  }
+}

data/sass-mixins/nitro-ui/navigation/navbar/_flush.scss

@@ -0,0 +1,14 @@
+
+
+.navbar {
+  &-flush-top {
+    border-top-right-radius: 0;
+    border-top-left-radius: 0;
+    margin-top: 0;
+  }
+  &-flush-bottom {
+    border-bottom-right-radius: 0;
+    border-bottom-left-radius: 0;
+    margin-bottom: 0;
+  }
+}

data/sass-mixins/nitro-ui/navigation/navbar/_forms.scss

@@ -0,0 +1,41 @@
+// Navbar form
+//
+// Extension of the `.form-inline` with some extra flavor for optimum display in
+// our navbars.
+
+.navbar-form {
+  margin-left: -$navbar-padding-horizontal;
+  margin-right: -$navbar-padding-horizontal;
+  padding: 10px $navbar-padding-horizontal;
+  border-top: 1px solid transparent;
+  border-bottom: 1px solid transparent;
+  $shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1);
+  @include box-shadow($shadow);
+
+  // Mixin behavior for optimum display
+  @include form-inline;
+
+  .form-group {
+    @media (max-width: $grid-float-breakpoint-max) {
+      margin-bottom: 5px;
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+    }
+  }
+
+  // Vertically center in expanded, horizontal navbar
+  @include navbar-vertical-align($input-height-base);
+
+  // Undo 100% width for pull classes
+  @media (min-width: $grid-float-breakpoint) {
+    width: auto;
+    border: 0;
+    margin-left: 0;
+    margin-right: 0;
+    padding-top: 0;
+    padding-bottom: 0;
+    @include box-shadow(none);
+  }
+}

data/sass-mixins/nitro-ui/navigation/navbar/_header.scss

@@ -0,0 +1,31 @@
+// Navbar heading
+//
+// Groups `.navbar-brand` and `.navbar-toggle` into a single component for easy
+// styling of responsive aspects.
+
+.navbar-header {
+  @include clearfix;
+
+  @media (min-width: $grid-float-breakpoint) {
+    float: left;
+  }
+}
+
+
+// Both navbar header and collapse
+//
+// When a container is present, change the behavior of the header and collapse.
+
+.container,
+.container-fluid {
+  > .navbar-header,
+  > .navbar-collapse {
+    margin-right: -$navbar-padding-horizontal;
+    margin-left:  -$navbar-padding-horizontal;
+
+    @media (min-width: $grid-float-breakpoint) {
+      margin-right: 0;
+      margin-left:  0;
+    }
+  }
+}

data/sass-mixins/nitro-ui/navigation/navbar/_inverse-navbar.scss

@@ -0,0 +1,32 @@
+//=== Inverted navbar
+// Reset inverted navbar basics
+$navbar-inverse-bg:                         $ink;
+$navbar-inverse-border:                     darken($navbar-inverse-bg, 10%) !default;
+
+// Inverted navbar links
+$navbar-inverse-link-color:                 lighten($gray-light, 15%) !default;
+$navbar-inverse-link-hover-color:           #fff !default;
+$navbar-inverse-link-hover-bg:              transparent !default;
+$navbar-inverse-link-active-color:          $navbar-inverse-link-hover-color !default;
+$navbar-inverse-link-active-bg:             darken($navbar-inverse-bg, 10%) !default;
+$navbar-inverse-link-disabled-color:        #444 !default;
+$navbar-inverse-link-disabled-bg:           transparent !default;
+
+// Inverted navbar brand label
+$navbar-inverse-brand-color:                $navbar-inverse-link-color !default;
+$navbar-inverse-brand-hover-color:          #fff !default;
+$navbar-inverse-brand-hover-bg:             transparent !default;
+
+// Inverted navbar toggle
+$navbar-inverse-toggle-hover-bg:            #333 !default;
+$navbar-inverse-toggle-icon-bar-bg:         #fff !default;
+$navbar-inverse-toggle-border-color:        #333 !default;
+
+
+
+
+// Inverse navbar
+
+.navbar-inverse {
+  @include navbar-color($ink, tint($ink, 10%), $power-blue);
+}

data/sass-mixins/nitro-ui/navigation/navbar/_light-navbar.scss

@@ -0,0 +1,36 @@
+//=== Inverted navbar
+// Reset inverted navbar basics
+$navbar-light-color:                      $power-blue;
+$navbar-light-bg:                         #222 !default;
+$navbar-light-border:                     darken($navbar-light-bg, 10%) !default;
+
+// Inverted navbar links
+$navbar-light-link-color:                 lighten($gray-light, 15%) !default;
+$navbar-light-link-hover-color:           #fff !default;
+$navbar-light-link-hover-bg:              transparent !default;
+$navbar-light-link-active-color:          $navbar-light-link-hover-color !default;
+$navbar-light-link-active-bg:             darken($navbar-light-bg, 10%) !default;
+$navbar-light-link-disabled-color:        #444 !default;
+$navbar-light-link-disabled-bg:           transparent !default;
+
+// Inverted navbar brand label
+$navbar-light-brand-color:                $navbar-light-link-color !default;
+$navbar-light-brand-hover-color:          #fff !default;
+$navbar-light-brand-hover-bg:             transparent !default;
+
+// Inverted navbar toggle
+$navbar-light-toggle-hover-bg:            #333 !default;
+$navbar-light-toggle-icon-bar-bg:         #fff !default;
+$navbar-light-toggle-border-color:        #333 !default;
+
+
+
+
+// Inverse navbar
+
+// $blue-navbar-gradient: @include gradient-vertical($start-color: $btn-color, $end-color: darken($btn-color, 12%));
+// background:         linear-gradient(to bottom, #333 0%,#EEE 100%);
+.navbar-blue {
+  @include navbar-color($power-blue, $white-opacity-1, $ink);
+  background: linear-gradient(to bottom, $power-blue 20%, mix($power-royal, $power-blue, 50%) 100%);
+}

data/sass-mixins/nitro-ui/navigation/navbar/_links.scss

@@ -0,0 +1,52 @@
+// Navbar nav links
+//
+// Builds on top of the `.nav` components with its own modifier class to make
+// the nav the full height of the horizontal nav (above 768px).
+
+.navbar-nav {
+  margin: ($navbar-padding-vertical / 2) (-$navbar-padding-horizontal);
+
+  > li > a {
+    padding-top:    10px;
+    padding-bottom: 10px;
+    line-height: $line-height-computed;
+  }
+
+  @media (max-width: $grid-float-breakpoint-max) {
+    // Dropdowns get custom display when collapsed
+    .open .dropdown-menu {
+      position: static;
+      float: none;
+      width: auto;
+      margin-top: 0;
+      background-color: transparent;
+      border: 0;
+      box-shadow: none;
+      > li > a,
+      .dropdown-header {
+        padding: 5px 15px 5px 25px;
+      }
+      > li > a {
+        line-height: $line-height-computed;
+        &:hover,
+        &:focus {
+          background-image: none;
+        }
+      }
+    }
+  }
+
+  // Uncollapse the nav
+  @media (min-width: $grid-float-breakpoint) {
+    float: left;
+    margin: 0;
+
+    > li {
+      float: left;
+      > a {
+        padding-top:    $navbar-padding-vertical;
+        padding-bottom: $navbar-padding-vertical;
+      }
+    }
+  }
+}

data/sass-mixins/nitro-ui/navigation/navbar/_mixins.scss

@@ -0,0 +1,161 @@
+// Navbar vertical align
+//
+// Vertically center elements in the navbar.
+// Example: an element has a height of 30px, so write out `.navbar-vertical-align(30px);` to calculate the appropriate top margin.
+
+@mixin navbar-vertical-align($element-height) {
+  margin-top: (($navbar-height - $element-height) / 2);
+  margin-bottom: (($navbar-height - $element-height) / 2);
+}
+
+
+@mixin navbar-color($navbar-color, $navbar-border, $navbar-accent) {
+
+  $navbar-text-color: null;
+  $navbar-link-color: null;
+
+  @if lightness($navbar-color) > 75% {
+    $navbar-text-color: shade($navbar-color, 80%);
+    $navbar-link-color: rgba($navbar-text-color, $opacity-6);
+  } @else {
+    $navbar-text-color: tint($navbar-color, 95%);
+    $navbar-link-color: rgba($navbar-text-color, $opacity-8);
+  }
+
+  background-color: $navbar-color;
+  border-color: $navbar-border;
+
+  .navbar-brand {
+    color: $navbar-text-color;
+    &:hover,
+    &:focus {
+      color: $navbar-accent
+      // background-color: $navbar-default-brand-hover-bg;
+    }
+  }
+
+  .navbar-text {
+    color: rgba($navbar-text-color, $opacity-7);
+  }
+
+  .navbar-nav {
+    > li > a {
+      color: $navbar-link-color;
+      background-color: transparent;
+      border-bottom: 4px solid transparent;
+      font-weight: $bold;
+      @include smooth-font;
+
+      &:hover,
+      &:focus {
+        color: $navbar-text-color;
+        background-color: transparent;
+      }
+    }
+    > .active > a {
+      &,
+      &:hover,
+      &:focus {
+        color: $navbar-text-color;
+        border-color: $navbar-accent;
+        background-color: transparent;
+      }
+    }
+    > .disabled > a {
+      &,
+      &:hover,
+      &:focus {
+        color: rgba($navbar-link-color, $opacity-1);
+        border-color: $navbar-accent;
+        background-color: transparent;
+      }
+    }
+  }
+
+  .navbar-toggle {
+    // border-color: $navbar-default-toggle-border-color;
+    &:hover,
+    &:focus {
+      // background-color: $navbar-default-toggle-hover-bg;
+    }
+    .icon-bar {
+      // background-color: $navbar-default-toggle-icon-bar-bg;
+    }
+  }
+
+  .navbar-collapse,
+  .navbar-form {
+    // border-color: $navbar-default-border;
+  }
+
+  // Dropdown menu items
+  .navbar-nav {
+    // Remove background color from open dropdown
+    > .open > a {
+      &,
+      &:hover,
+      &:focus {
+        // background-color: $navbar-default-link-active-bg;
+        // color: $navbar-default-link-active-color;
+      }
+    }
+
+    @media (max-width: $grid-float-breakpoint-max) {
+      // Dropdowns get custom display when collapsed
+      .open .dropdown-menu {
+        > li > a {
+          // color: $navbar-default-link-color;
+          &:hover,
+          &:focus {
+            // color: $navbar-default-link-hover-color;
+            // background-color: $navbar-default-link-hover-bg;
+          }
+        }
+        > .active > a {
+          &,
+          &:hover,
+          &:focus {
+            // color: $navbar-default-link-active-color;
+            // background-color: $navbar-default-link-active-bg;
+          }
+        }
+        > .disabled > a {
+          &,
+          &:hover,
+          &:focus {
+            // color: $navbar-default-link-disabled-color;
+            // background-color: $navbar-default-link-disabled-bg;
+          }
+        }
+      }
+    }
+  }
+
+
+  // Links in navbars
+  //
+  // Add a class to ensure links outside the navbar nav are colored correctly.
+
+  .navbar-link {
+    // color: $navbar-default-link-color;
+    &:hover {
+      // color: $navbar-default-link-hover-color;
+    }
+  }
+
+  .btn-link {
+    // color: $navbar-default-link-color;
+    &:hover,
+    &:focus {
+      // color: $navbar-default-link-hover-color;
+    }
+    &[disabled],
+    fieldset[disabled] & {
+      &:hover,
+      &:focus {
+        // color: $navbar-default-link-disabled-color;
+      }
+    }
+  }
+
+}

data/sass-mixins/nitro-ui/navigation/navbar/_navbar.scss

@@ -0,0 +1,29 @@
+//
+// Navbars
+// --------------------------------------------------
+
+
+// Wrapper and base class
+//
+// Provide a static navbar from which we expand to create full-width, fixed, and
+// other navbar variations.
+
+.navbar {
+  position: relative;
+  min-height: $navbar-height; // Ensure a navbar always shows (e.g., without a .navbar-brand in collapsed mode)
+  margin-bottom: $navbar-margin-bottom;
+  border: 1px solid transparent;
+  padding: 0 $space-base;
+
+  // Prevent floats from breaking the navbar
+  @include clearfix;
+
+  @media (min-width: $grid-float-breakpoint) {
+    border-radius: $navbar-border-radius;
+  }
+}
+
+
+
+
+// ADD FLUSH BOTTOM OPTION