nitro_sg 3.0.0 → 3.0.1

data/sass-mixins/base-mixins/_grid-framework.scss

@@ -0,0 +1,81 @@
+// Framework grid generation
+//
+// Used only by Bootstrap to generate the correct number of grid classes given
+// any value of `$grid-columns`.
+
+// [converter] This is defined recursively in LESS, but Sass supports real loops
+@mixin make-grid-columns($i: 1, $list: ".col-xs-#{$i}, .col-sm-#{$i}, .col-md-#{$i}, .col-lg-#{$i}") {
+  @for $i from (1 + 1) through $grid-columns {
+    $list: "#{$list}, .col-xs-#{$i}, .col-sm-#{$i}, .col-md-#{$i}, .col-lg-#{$i}";
+  }
+  #{$list} {
+    position: relative;
+    // Prevent columns from collapsing when empty
+    min-height: 1px;
+    // Inner gutter via padding
+    padding-left:  ceil(($grid-gutter-width / 2));
+    padding-right: floor(($grid-gutter-width / 2));
+  }
+}
+
+
+// [converter] This is defined recursively in LESS, but Sass supports real loops
+@mixin float-grid-columns($class, $i: 1, $list: ".col-#{$class}-#{$i}") {
+  @for $i from (1 + 1) through $grid-columns {
+    $list: "#{$list}, .col-#{$class}-#{$i}";
+  }
+  #{$list} {
+    float: left;
+  }
+}
+
+
+@mixin calc-grid-column($index, $class, $type) {
+  @if ($type == width) and ($index > 0) {
+    .col-#{$class}-#{$index} {
+      width: percentage(($index / $grid-columns));
+    }
+  }
+  @if ($type == push) and ($index > 0) {
+    .col-#{$class}-push-#{$index} {
+      left: percentage(($index / $grid-columns));
+    }
+  }
+  @if ($type == push) and ($index == 0) {
+    .col-#{$class}-push-0 {
+      left: auto;
+    }
+  }
+  @if ($type == pull) and ($index > 0) {
+    .col-#{$class}-pull-#{$index} {
+      right: percentage(($index / $grid-columns));
+    }
+  }
+  @if ($type == pull) and ($index == 0) {
+    .col-#{$class}-pull-0 {
+      right: auto;
+    }
+  }
+  @if ($type == offset) {
+    .col-#{$class}-offset-#{$index} {
+      margin-left: percentage(($index / $grid-columns));
+    }
+  }
+}
+
+// [converter] This is defined recursively in LESS, but Sass supports real loops
+@mixin loop-grid-columns($columns, $class, $type) {
+  @for $i from 0 through $columns {
+    @include calc-grid-column($i, $class, $type);
+  }
+}
+
+
+// Create grid for specific class
+@mixin make-grid($class) {
+  @include float-grid-columns($class);
+  @include loop-grid-columns($grid-columns, $class, width);
+  @include loop-grid-columns($grid-columns, $class, pull);
+  @include loop-grid-columns($grid-columns, $class, push);
+  @include loop-grid-columns($grid-columns, $class, offset);
+}

data/sass-mixins/base-mixins/_grid.scss

@@ -0,0 +1,126 @@
+// Grid system
+//
+// Generate semantic grid columns with these mixins.
+
+// Tests for breakpoints
+// @include _assert-ascending($grid-breakpoints, "$grid-breakpoints");
+// @include _assert-starts-at-zero($grid-breakpoints);
+
+// Centered container element
+@mixin container-fixed($gutter: $grid-gutter-width) {
+  margin-right: auto;
+  margin-left: auto;
+  padding-left:  ($gutter / 2);
+  padding-right: ($gutter / 2);
+  @include clearfix;
+}
+
+// Creates a wrapper for a series of columns
+@mixin make-row($gutter: $grid-gutter-width) {
+  margin-left:  ceil(($gutter / -2));
+  margin-right: floor(($gutter / -2));
+  @include clearfix;
+}
+
+// Generate the extra small columns
+@mixin make-xs-column($columns, $gutter: $grid-gutter-width) {
+  position: relative;
+  float: left;
+  width: percentage(($columns / $grid-columns));
+  min-height: 1px;
+  padding-left:  ($gutter / 2);
+  padding-right: ($gutter / 2);
+}
+@mixin make-xs-column-offset($columns) {
+  margin-left: percentage(($columns / $grid-columns));
+}
+@mixin make-xs-column-push($columns) {
+  left: percentage(($columns / $grid-columns));
+}
+@mixin make-xs-column-pull($columns) {
+  right: percentage(($columns / $grid-columns));
+}
+
+// Generate the small columns
+@mixin make-sm-column($columns, $gutter: $grid-gutter-width) {
+  position: relative;
+  min-height: 1px;
+  padding-left:  ($gutter / 2);
+  padding-right: ($gutter / 2);
+
+  @media (min-width: $screen-sm-min) {
+    float: left;
+    width: percentage(($columns / $grid-columns));
+  }
+}
+@mixin make-sm-column-offset($columns) {
+  @media (min-width: $screen-sm-min) {
+    margin-left: percentage(($columns / $grid-columns));
+  }
+}
+@mixin make-sm-column-push($columns) {
+  @media (min-width: $screen-sm-min) {
+    left: percentage(($columns / $grid-columns));
+  }
+}
+@mixin make-sm-column-pull($columns) {
+  @media (min-width: $screen-sm-min) {
+    right: percentage(($columns / $grid-columns));
+  }
+}
+
+// Generate the medium columns
+@mixin make-md-column($columns, $gutter: $grid-gutter-width) {
+  position: relative;
+  min-height: 1px;
+  padding-left:  ($gutter / 2);
+  padding-right: ($gutter / 2);
+
+  @media (min-width: $screen-md-min) {
+    float: left;
+    width: percentage(($columns / $grid-columns));
+  }
+}
+@mixin make-md-column-offset($columns) {
+  @media (min-width: $screen-md-min) {
+    margin-left: percentage(($columns / $grid-columns));
+  }
+}
+@mixin make-md-column-push($columns) {
+  @media (min-width: $screen-md-min) {
+    left: percentage(($columns / $grid-columns));
+  }
+}
+@mixin make-md-column-pull($columns) {
+  @media (min-width: $screen-md-min) {
+    right: percentage(($columns / $grid-columns));
+  }
+}
+
+// Generate the large columns
+@mixin make-lg-column($columns, $gutter: $grid-gutter-width) {
+  position: relative;
+  min-height: 1px;
+  padding-left:  ($gutter / 2);
+  padding-right: ($gutter / 2);
+
+  @media (min-width: $screen-lg-min) {
+    float: left;
+    width: percentage(($columns / $grid-columns));
+  }
+}
+@mixin make-lg-column-offset($columns) {
+  @media (min-width: $screen-lg-min) {
+    margin-left: percentage(($columns / $grid-columns));
+  }
+}
+@mixin make-lg-column-push($columns) {
+  @media (min-width: $screen-lg-min) {
+    left: percentage(($columns / $grid-columns));
+  }
+}
+@mixin make-lg-column-pull($columns) {
+  @media (min-width: $screen-lg-min) {
+    right: percentage(($columns / $grid-columns));
+  }
+}

data/sass-mixins/base-mixins/_hover.scss

@@ -0,0 +1,26 @@
+@mixin hover {
+  &:hover { @content }
+}
+
+@mixin hover-focus {
+  &:focus,
+  &:hover {
+    @content
+  }
+}
+
+@mixin plain-hover-focus {
+  &,
+  &:focus,
+  &:hover {
+    @content
+  }
+}
+
+@mixin hover-focus-active {
+  &:focus,
+  &:active,
+  &:hover {
+    @content
+  }
+}

data/sass-mixins/base-mixins/_images.scss

@@ -0,0 +1,33 @@
+// Image Mixins
+// - Responsive image
+// - Retina image
+
+
+// Responsive image
+//
+// Keep images from scaling beyond the width of their parents.
+@mixin img-responsive($display: block) {
+  display: $display;
+  max-width: 100%; // Part 1: Set a maximum relative to the parent
+  height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
+}
+
+
+// Retina image
+//
+// Short retina mixin for setting background-image and -size. Note that the
+// spelling of `min--moz-device-pixel-ratio` is intentional.
+@mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) {
+  background-image: url(if($bootstrap-sass-asset-helper, twbs-image-path("#{$file-1x}"), "#{$file-1x}"));
+
+  @media
+  only screen and (-webkit-min-device-pixel-ratio: 2),
+  only screen and (   min--moz-device-pixel-ratio: 2),
+  only screen and (     -o-min-device-pixel-ratio: 2/1),
+  only screen and (        min-device-pixel-ratio: 2),
+  only screen and (                min-resolution: 192dpi),
+  only screen and (                min-resolution: 2dppx) {
+    background-image: url(if($bootstrap-sass-asset-helper, twbs-image-path("#{$file-2x}"), "#{$file-2x}"));
+    background-size: $width-1x $height-1x;
+  }
+}

data/sass-mixins/base-mixins/_media-queries.sass

@@ -0,0 +1,58 @@
+=retina
+  @media (-webkit-min-device-pixel-ratio: 2)
+    @content
+
+=at-landscape
+  @media screen and (orientation:landscape)
+    @content
+
+=at-retina($asset, $width, $height)
+  @media (-webkit-min-device-pixel-ratio: 2)
+    background-image: url($asset)
+    background-size: $width, $height
+
+=mobile-only($include_portrait_tablet: false)
+  @if $include_portrait_tablet == true
+    @media screen and (max-width: $mobile), (orientation: portrait)
+      @content
+  @else
+    @media screen and (max-width: $mobile)
+      @content
+
+=tablet-only
+  @media screen and (min-width: $tablet) and (max-width: $desktop)
+    @content
+
+=tablet-and-above
+  @media screen and (min-width: $tablet)
+    @content
+
+=tablet-and-below
+  @media screen and (max-width: $desktop)
+    @content
+
+=desktop-only
+  @media screen and (min-width: $desktop)
+    @content
+
+=desktop-large
+  @media screen and (min-width: $large-desktop)
+    @content
+
+// Custom Min Query
+=media-min-width($size)
+  @media screen and (min-width: $size)
+    @content
+
+=media_min_width($size)
+  @media screen and (min-width: $size)
+    @content
+
+// Custom Max Query
+=media-max-width($size)
+  @media screen and (max-width: $size)
+    @content
+
+=media_max_width($size)
+  @media screen and (max-width: $size)
+    @content

data/sass-mixins/base-mixins/_type.scss

@@ -0,0 +1,46 @@
+@mixin text-truncate() {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+
+@mixin text-emphasis-variant($parent, $color) {
+  #{$parent} {
+    color: $color !important;
+  }
+  a#{$parent}:hover,
+  a#{$parent}:focus {
+    color: darken($color, 10%) !important;
+  }
+}
+
+
+
+@mixin text-hide() {
+  font: 0/0 a;
+  color: transparent;
+  text-shadow: none;
+  background-color: transparent;
+  border: 0;
+}
+
+
+@mixin reset-text() {
+  font-family: $font-family-base;
+  // We deliberately do NOT reset font-size.
+  font-style: normal;
+  font-weight: normal;
+  letter-spacing: normal;
+  line-break: auto;
+  line-height: $line-height-base;
+  text-align: left; // Fallback for where `start` is not supported
+  text-align: start;
+  text-decoration: none;
+  text-shadow: none;
+  text-transform: none;
+  white-space: normal;
+  word-break: normal;
+  word-spacing: normal;
+  word-wrap: normal;
+}

data/sass-mixins/base-variables/_all.scss

@@ -0,0 +1,11 @@
+@import "colors";
+@import "typography";
+@import "opacity";
+@import "border-radius";
+@import "spacing";
+@import "animation-curves";
+@import "bootstrap-variables";
+@import "sizing-ui-elements";
+@import "positioning";
+@import "shadows";
+@import "forms";

data/sass-mixins/base-variables/_animation-curves.scss

@@ -0,0 +1,37 @@
+$bezier: cubic-bezier(.64, 0, .35, 1);
+// +transition-timing-function(cubic-bezier(0.7, 0, 0.3, 1))
+
+/* Default Equations */
+$linear: cubic-bezier(0.250, 0.250, 0.750, 0.750);
+$ease: cubic-bezier(0.250, 0.100, 0.250, 1.000);
+$easeIn: cubic-bezier(0.420, 0.000, 1.000, 1.000);
+$easeOut: cubic-bezier(0.000, 0.000, 0.580, 1.000);
+$easeInOut: cubic-bezier(0.420, 0.000, 0.580, 1.000);
+
+/* Penner Equations (approximated) originally created by @robpenner */
+$easeInQuad: cubic-bezier(0.550, 0.085, 0.680, 0.530);
+$easeInCubic: cubic-bezier(0.550, 0.055, 0.675, 0.190);
+$easeInQuart: cubic-bezier(0.895, 0.030, 0.685, 0.220);
+$easeInQuint: cubic-bezier(0.755, 0.050, 0.855, 0.060);
+$easeInSine: cubic-bezier(0.470, 0.000, 0.745, 0.715);
+$easeInExpo: cubic-bezier(0.950, 0.050, 0.795, 0.035);
+$easeInCirc: cubic-bezier(0.600, 0.040, 0.980, 0.335);
+$easeInBack: cubic-bezier(0.600, -0.280, 0.735, 0.045);
+
+$easeOutQuad: cubic-bezier(0.250, 0.460, 0.450, 0.940);
+$easeOutCubic: cubic-bezier(0.215, 0.610, 0.355, 1.000);
+$easeOutQuart: cubic-bezier(0.165, 0.840, 0.440, 1.000);
+$easeOutQuint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
+$easeOutSine: cubic-bezier(0.390, 0.575, 0.565, 1.000);
+$easeOutExpo: cubic-bezier(0.190, 1.000, 0.220, 1.000);
+$easeOutCirc: cubic-bezier(0.075, 0.820, 0.165, 1.000);
+$easeOutBack: cubic-bezier(0.175, 0.885, 0.320, 1.275);
+
+$easeInOutQuad: cubic-bezier(0.455, 0.030, 0.515, 0.955);
+$easeInOutCubic: cubic-bezier(0.645, 0.045, 0.355, 1.000);
+$easeInOutQuart: cubic-bezier(0.770, 0.000, 0.175, 1.000);
+$easeInOutQuint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
+$easeInOutSine: cubic-bezier(0.445, 0.050, 0.550, 0.950);
+$easeInOutExpo: cubic-bezier(1.000, 0.000, 0.000, 1.000);
+$easeInOutCirc: cubic-bezier(0.785, 0.135, 0.150, 0.860);
+$easeInOutBack: cubic-bezier(0.680, -0.550, 0.265, 1.550);

data/sass-mixins/base-variables/_bootstrap-variables.scss

@@ -0,0 +1,284 @@
+
+//*****************************
+// GOAL IS TO DELETE THIS FILE
+//*****************************
+
+// Grid breakpoints Needed for cards
+//
+// Define the minimum dimensions at which your layout will change,
+// adapting to different screen sizes, for use in media queries.
+
+$grid-breakpoints: (
+  xs: 0,
+  sm: 576px,
+  md: 768px,
+  lg: 992px,
+  xl: 1200px
+) !default;
+
+
+
+//== Grid system
+//
+//## Define your custom responsive grid.
+
+$screen-sm-min: 768px;
+
+//** Number of columns in the grid.
+$grid-columns:              12 !default;
+//** Padding between columns. Gets divided in half for the left and right.
+$grid-gutter-width:         30px !default;
+// Navbar collapse
+//** Point at which the navbar becomes uncollapsed.
+$grid-float-breakpoint:     $screen-sm-min !default;
+//** Point at which the navbar begins collapsing.
+$grid-float-breakpoint-max: ($grid-float-breakpoint - 1) !default;
+
+
+//== Container sizes
+$container-tablet:             (720px + $grid-gutter-width) !default;
+$container-sm:                 $container-tablet !default;
+$container-desktop:            (940px + $grid-gutter-width) !default;
+$container-md:                 $container-desktop !default;
+$container-large-desktop:      (1140px + $grid-gutter-width) !default;
+$container-lg:                 $container-large-desktop !default;
+
+
+
+
+
+//** Disabled cursor for form controls and buttons.
+$cursor-disabled:                not-allowed !default;
+
+
+
+
+
+//== Iconography
+
+$bootstrap-sass-asset-helper: false;
+//
+//## Specify custom location and filename of the included Glyphicons icon font. Useful for those including Bootstrap via Bower.
+
+//** Load fonts from this directory.
+
+// [converter] If $bootstrap-sass-asset-helper if used, provide path relative to the assets load path.
+// [converter] This is because some asset helpers, such as Sprockets, do not work with file-relative paths.
+$icon-font-path: if($bootstrap-sass-asset-helper, "bootstrap/", "../fonts/bootstrap/");
+
+//** File name for all font files.
+$icon-font-name:          "glyphicons-halflings-regular";
+//** Element ID within SVG icon file.
+$icon-font-svg-id:        "glyphicons_halflingsregular";
+
+
+//--------------
+// MOVE TO BASE
+//--------------
+
+
+// Specific Colors
+$border-width: 1px;
+
+
+
+
+
+// ------------
+// Iconography
+// ------------
+$icon-normal:               16px;
+$icon-medium:               18px;
+$icon-large:                32px;
+$caret-width-base:          $border-rad-light;
+$caret-width-large:         $border-rad-heavy;
+
+
+
+
+
+
+
+
+
+
+
+// ------------
+// Pager
+// ------------
+
+
+
+
+
+
+//== Dropdown Menu
+//
+//##
+
+$dropdown-background:        mix($inverse, $brand-primary, 94%);
+
+
+//== Iconbar
+//
+//##
+
+$iconbar-background:         mix($brand-primary, black, 85%);
+
+
+//== Progress bars
+//
+//##
+
+$progress-height:            12px;
+
+
+//== Slider
+//
+//##
+
+$slider-height:              12px;
+$slider-value-font-size:     floor($component-font-size-base * 0.867); // ~13px;
+
+$slider-handle-bg:           mix($brand-secondary, black, 85%);
+$slider-handle-hover-bg:     mix($brand-secondary, white, 80%);
+$slider-handle-active-bg:    mix($brand-secondary, black, 85%);
+
+$slider-range-bg:            $brand-secondary;
+
+$slider-segment-bg:          mix(desaturate($brand-primary, 15%), white, 20%);
+
+
+//== Switch
+//
+//##
+
+$switch-border-radius:       30px;
+$switch-width:               80px;
+
+
+//== Thumbnails
+//
+//##
+
+//** Padding around the thumbnail image
+$thumbnail-padding:           4px;
+//** Thumbnail background color
+$thumbnail-bg:                $body-bg;
+//** Thumbnail border color
+$thumbnail-border:            $gray-light;
+//** Thumbnail border radius
+$thumbnail-border-radius:     $border-radius-large;
+
+//** Custom text color for thumbnail captions
+$thumbnail-caption-color:     $text-color;
+//** Padding around the thumbnail caption
+$thumbnail-caption-padding:   9px;
+
+
+
+
+
+
+
+// -----------------------------------
+// Breakpoints for media query mixins
+// -----------------------------------
+
+$screen-xs-min:               480px; // Extra small screen / phone
+$screen-sm-min:               768px; // Small screen / tablet
+$screen-md-min:               992px; // Medium screen / desktop
+$screen-lg-min:               1200px; // Large screen / wide desktop
+
+// So media queries don't overlap when required, provide a maximum
+$screen-xs-max:               ($screen-sm-min - 1);
+$screen-sm-max:               ($screen-md-min - 1);
+$screen-md-max:               ($screen-lg-min - 1);
+
+$mobile: 700px;
+$tablet: 701px;
+$desktop: $screen-md-min;
+$large-desktop: $screen-lg-min;
+
+
+
+
+//== Grid system
+//
+//## Define your custom responsive grid.
+
+//** Number of columns in the grid.
+$grid-columns:                12;
+//** Padding between columns. Gets divided in half for the left and right.
+$grid-gutter-width:           30px;
+// Navbar collapse
+//** Point at which the navbar becomes uncollapsed.
+$grid-float-breakpoint:       $screen-sm-min;
+//** Point at which the navbar begins collapsing.
+$grid-float-breakpoint-max:   ($grid-float-breakpoint - 1);
+
+// Form states and alerts
+//
+//## Define colors for form feedback states and, by default, alerts.
+
+$state-success-text:          $brand-success;
+$state-success-bg:            #dff0d8;
+$state-success-border:        darken(adjust-hue($state-success-bg, -10), 5%);
+
+$state-info-text:             $brand-info;
+$state-info-bg:               #d9edf7;
+$state-info-border:           darken(adjust-hue($state-info-bg, -10), 7%);
+
+$state-warning-text:          $brand-warning;
+$state-warning-bg:            #fcf8e3;
+$state-warning-border:        darken(adjust-hue($state-warning-bg, -10), 5%);
+
+$state-danger-text:           $brand-danger;
+$state-danger-bg:             #f2dede;
+$state-danger-border:         darken(adjust-hue($state-danger-bg, -10), 5%);
+
+
+
+
+
+// Miscellaneous
+//
+//##
+
+//** Hr border color
+$hr-border:                   mix($brand-primary, $inverse, 63%);
+
+//** Horizontal forms & lists
+$component-offset-horizontal: 180px;
+
+
+
+
+
+// Spacing
+//
+// Control the default styling of most Bootstrap elements by modifying these
+// variables. Mostly focused on spacing.
+// You can add more entries to the $spacers map, should you need more variation.
+
+// stylelint-disable
+$spacer: 1rem !default;
+$spacers: () !default;
+$spacers: map-merge((
+  0: 0,
+  1: ($spacer * .25),
+  2: ($spacer * .5),
+  3: $spacer,
+  4: ($spacer * 1.5),
+  5: ($spacer * 3)
+), $spacers);
+
+
+
+// This variable affects the `.h-*` and `.w-*` classes.
+$sizes: (
+  25: 25%,
+  50: 50%,
+  75: 75%,
+  100: 100%
+) !default;