va_common 0.1.0 → 0.2.0

data/app/assets/stylesheets/foundation/components/_pricing-tables.scss

@@ -1,150 +0,0 @@
-// Foundation by ZURB
-// foundation.zurb.com
-// Licensed under MIT Open Source
-
-@import "global";
-
-//
-// @variables
-//
-$include-html-pricing-classes: $include-html-classes !default;
-
-// We use this to control the border color
-$price-table-border: solid 1px $gainsboro !default;
-
-// We use this to control the bottom margin of the pricing table
-$price-table-margin-bottom: rem-calc(20) !default;
-
-// We use these to control the title styles
-$price-title-bg: $oil !default;
-$price-title-padding: rem-calc(15 20) !default;
-$price-title-align: center !default;
-$price-title-color: $smoke !default;
-$price-title-weight: $font-weight-normal !default;
-$price-title-size: rem-calc(16) !default;
-$price-title-font-family: $body-font-family !default;
-
-// We use these to control the price styles
-$price-money-bg: $vapor !default;
-$price-money-padding: rem-calc(15 20) !default;
-$price-money-align: center !default;
-$price-money-color: $oil !default;
-$price-money-weight: $font-weight-normal !default;
-$price-money-size: rem-calc(32) !default;
-$price-money-font-family: $body-font-family !default;
-
-
-// We use these to control the description styles
-$price-bg: $white !default;
-$price-desc-color: $monsoon !default;
-$price-desc-padding: rem-calc(15) !default;
-$price-desc-align: center !default;
-$price-desc-font-size: rem-calc(12) !default;
-$price-desc-weight: $font-weight-normal !default;
-$price-desc-line-height: 1.4 !default;
-$price-desc-bottom-border: dotted 1px $gainsboro !default;
-
-// We use these to control the list item styles
-$price-item-color: $oil !default;
-$price-item-padding: rem-calc(15) !default;
-$price-item-align: center !default;
-$price-item-font-size: rem-calc(14) !default;
-$price-item-weight: $font-weight-normal !default;
-$price-item-bottom-border: dotted 1px $gainsboro !default;
-
-// We use these to control the CTA area styles
-$price-cta-bg: $white !default;
-$price-cta-align: center !default;
-$price-cta-padding: rem-calc(20 20 0) !default;
-
-// @mixins
-//
-// We use this to create the container element for the pricing tables
-@mixin pricing-table-container {
-  border: $price-table-border;
-  margin-#{$default-float}: 0;
-  margin-bottom: $price-table-margin-bottom;
-
-  & * {
-    list-style: none;
-    line-height: 1;
-  }
-}
-// @mixins
-//
-// We use this mixin to create the pricing table title styles
-@mixin pricing-table-title {
-  background-color: $price-title-bg;
-  padding: $price-title-padding;
-  text-align: $price-title-align;
-  color: $price-title-color;
-  font-weight: $price-title-weight;
-  font-size: $price-title-size;
-  font-family: $price-title-font-family;
-}
-
-// @mixins
-//
-// We use this mixin to control the pricing table price styles
-@mixin pricing-table-price {
-  background-color: $price-money-bg;
-  padding: $price-money-padding;
-  text-align: $price-money-align;
-  color: $price-money-color;
-  font-weight: $price-money-weight;
-  font-size: $price-money-size;
-  font-family: $price-money-font-family;
-}
-
-// @mixins
-//
-// We use this mixin to create the description styles for the pricing table
-@mixin pricing-table-description {
-  background-color: $price-bg;
-  padding: $price-desc-padding;
-  text-align: $price-desc-align;
-  color: $price-desc-color;
-  font-size: $price-desc-font-size;
-  font-weight: $price-desc-weight;
-  line-height: $price-desc-line-height;
-  border-bottom: $price-desc-bottom-border;
-}
-
-// @mixins
-//
-// We use this mixin to style the bullet items in the pricing table
-@mixin pricing-table-bullet {
-  background-color: $price-bg;
-  padding: $price-item-padding;
-  text-align: $price-item-align;
-  color: $price-item-color;
-  font-size: $price-item-font-size;
-  font-weight: $price-item-weight;
-  border-bottom: $price-item-bottom-border;
-}
-
-// @mixins
-//
-// We use this mixin to style the CTA area of the pricing tables
-@mixin pricing-table-cta {
-  background-color: $price-cta-bg;
-  text-align: $price-cta-align;
-  padding: $price-cta-padding;
-}
-
-@include exports("pricing-table") {
-  @if $include-html-pricing-classes {
-
-    /* Pricing Tables */
-    .pricing-table {
-      @include pricing-table-container;
-
-      .title { @include pricing-table-title; }
-      .price { @include pricing-table-price; }
-      .description { @include pricing-table-description; }
-      .bullet-item { @include pricing-table-bullet; }
-      .cta-button { @include pricing-table-cta; }
-    }
-
-  }
-}

data/app/assets/stylesheets/foundation/components/_progress-bars.scss

@@ -1,79 +0,0 @@
-// Foundation by ZURB
-// foundation.zurb.com
-// Licensed under MIT Open Source
-
-@import "global";
-
-//
-// @variables
-//
-$include-html-media-classes: $include-html-classes !default;
-
-// We use this to set the progress bar height
-$progress-bar-height: rem-calc(25) !default;
-$progress-bar-color: $vapor !default;
-
-// We use these to control the border styles
-$progress-bar-border-color: scale-color($white, $lightness: 20%) !default;
-$progress-bar-border-size: 1px !default;
-$progress-bar-border-style: solid !default;
-$progress-bar-border-radius: $global-radius !default;
-
-// We use these to control the margin & padding
-$progress-bar-pad: rem-calc(2) !default;
-$progress-bar-margin-bottom: rem-calc(10) !default;
-
-// We use these to set the meter colors
-$progress-meter-color: $primary-color !default;
-$progress-meter-secondary-color: $secondary-color !default;
-$progress-meter-success-color: $success-color !default;
-$progress-meter-alert-color: $alert-color !default;
-
-// @mixins
-//
-// We use this to set up the progress bar container
-@mixin progress-container {
-  background-color: $progress-bar-color;
-  height: $progress-bar-height;
-  border: $progress-bar-border-size $progress-bar-border-style $progress-bar-border-color;
-  padding: $progress-bar-pad;
-  margin-bottom: $progress-bar-margin-bottom;
-}
-
-// @mixins
-//
-// $bg - Default: $progress-meter-color || $primary-color
-@mixin progress-meter($bg:$progress-meter-color) {
-  background: $bg;
-  height: 100%;
-  display: block;
-}
-
-
-@include exports("progress-bar") {
-  @if $include-html-media-classes {
-
-    /* Progress Bar */
-    .progress {
-      @include progress-container;
-
-      // Meter
-      .meter {
-        @include progress-meter;
-      }
-      &.secondary .meter { @include progress-meter($bg:$progress-meter-secondary-color); }
-      &.success .meter { @include progress-meter($bg:$progress-meter-success-color); }
-      &.alert .meter { @include progress-meter($bg:$progress-meter-alert-color); }
-
-      &.radius { @include radius($progress-bar-border-radius);
-        .meter { @include radius($progress-bar-border-radius - 1); }
-      }
-
-      &.round { @include radius(1000px);
-        .meter { @include radius(999px); }
-      }
-
-    }
-
-  }
-}

data/app/assets/stylesheets/foundation/components/_range-slider.scss

@@ -1,169 +0,0 @@
-// Foundation by ZURB
-// foundation.zurb.com
-// Licensed under MIT Open Source
-
-@import "global";
-
-//
-// @name _range-slider.scss
-// @dependencies _global.scss
-//
-
-//
-// @variables
-//
-
-$include-html-range-slider-classes: $include-html-classes !default;
-
-// These variabels define the slider bar styles
-$range-slider-bar-width: 100% !default;
-$range-slider-bar-height: rem-calc(16) !default;
-
-$range-slider-bar-border-width: 1px !default;
-$range-slider-bar-border-style: solid !default;
-$range-slider-bar-border-color: $gainsboro !default;
-$range-slider-radius: $global-radius !default;
-$range-slider-round: $global-rounded !default;
-$range-slider-bar-bg-color: $ghost !default;
-$range-slider-active-segment-bg-color: scale-color($secondary-color, $lightness: -1%) !default;
-
-// Vertical bar styles
-$range-slider-vertical-bar-width: rem-calc(16) !default;
-$range-slider-vertical-bar-height: rem-calc(200) !default;
-
-// These variabels define the slider handle styles
-$range-slider-handle-width: rem-calc(32) !default;
-$range-slider-handle-height: rem-calc(22) !default;
-$range-slider-handle-position-top: rem-calc(-5) !default;
-$range-slider-handle-bg-color: $primary-color !default;
-$range-slider-handle-border-width: 1px !default;
-$range-slider-handle-border-style: solid !default;
-$range-slider-handle-border-color: none !default;
-$range-slider-handle-radius: $global-radius !default;
-$range-slider-handle-round: $global-rounded !default;
-$range-slider-handle-bg-hover-color: scale-color($primary-color, $lightness: -12%) !default;
-$range-slider-handle-cursor: pointer !default;
-
-$range-slider-disabled-opacity: 0.7 !default;
-$range-slider-disabled-cursor: $cursor-disabled-value !default;
-
-//
-// @mixins
-//
-
-@mixin range-slider-bar-base($vertical: false) {
-  display: block;
-  position: relative;
-  width: $range-slider-bar-width;
-  height: $range-slider-bar-height;
-  border: $range-slider-bar-border-width $range-slider-bar-border-style $range-slider-bar-border-color;
-  margin: rem-calc(20 0);
-  -ms-touch-action: none;
-  touch-action: none;
-  @if $vertical == true {
-    display: inline-block;
-    width: $range-slider-vertical-bar-width;
-    height: $range-slider-vertical-bar-height;
-  }
-}
-@mixin range-slider-bar-style(
-  $bg: true,
-  $radius: false,
-  $round: false,
-  $disabled: false) {
-  @if $bg == true { background: $range-slider-bar-bg-color; }
-  @if $radius == true { @include radius($range-slider-radius); }
-  @if $round == true { @include radius($range-slider-round); }
-  @if $disabled == true {
-    cursor: $range-slider-disabled-cursor;
-    opacity: $range-slider-disabled-opacity;
-  }
-}
-
-@mixin range-slider-bar(
-  $bg: $range-slider-bar-bg-color,
-  $radius:false) {
-  @include range-slider-bar-base;
-  @include range-slider-bar-style;
-}
-
-@mixin range-slider-handle-base() {
-  display: inline-block;
-  position: absolute;
-  z-index: 1;
-  top: $range-slider-handle-position-top;
-  width: $range-slider-handle-width;
-  height: $range-slider-handle-height;
-  border: $range-slider-handle-border-width $range-slider-handle-border-style $range-slider-handle-border-color;
-  cursor: $range-slider-handle-cursor;
-
-  // This removes the 300ms touch delay on Windows 8
-  -ms-touch-action: manipulation;
-      touch-action: manipulation;
-}
-@mixin range-slider-handle-style(
-  $bg: true,
-  $radius: false,
-  $round: false,
-  $disabled: false) {
-  @if $bg == true { background: $range-slider-handle-bg-color; }
-  @if $radius == true { @include radius($range-slider-radius); }
-  @if $round == true { @include radius($range-slider-round); }
-  @if $disabled == true {
-    cursor: $cursor-default-value;
-    opacity: $range-slider-disabled-opacity;
-  }
-  &:hover {
-    background: $range-slider-handle-bg-hover-color;
-  }
-}
-@mixin range-slider-handle() {
-  @include range-slider-handle-base;
-  @include range-slider-handle-style;
-}
-
-// CSS Generation
-@include exports("range-slider-bar") {
-  @if $include-html-range-slider-classes {
-    .range-slider {
-      @include range-slider-bar-base;
-      @include range-slider-bar-style($bg:true, $radius:false);
-      &.vertical-range {
-        @include range-slider-bar-base($vertical: true);
-        .range-slider-handle {
-          margin-top: 0;
-          margin-#{$default-float}: -($range-slider-handle-width / 4);
-          position: absolute;
-          bottom: -($range-slider-vertical-bar-height - $range-slider-handle-width);
-        }
-        .range-slider-active-segment {
-          width: $range-slider-bar-height - rem-calc((strip-unit($range-slider-bar-border-width) * 2));
-          height: auto;
-          bottom: 0;
-        }
-      }
-      &.radius {
-        @include range-slider-bar-style($radius:true);
-        .range-slider-handle { @include range-slider-handle-style($radius: true); }
-      }
-      &.round {
-        @include range-slider-bar-style($round:true);
-        .range-slider-handle { @include range-slider-handle-style($round: true); }
-      }
-      &.disabled, &[disabled] {
-        @include range-slider-bar-style($disabled:true);
-        .range-slider-handle { @include range-slider-handle-style($disabled: true); }
-      }
-    }
-    .range-slider-active-segment {
-      display: inline-block;
-      position: absolute;
-      height: $range-slider-bar-height - rem-calc((strip-unit($range-slider-bar-border-width) * 2));
-      background: $range-slider-active-segment-bg-color;
-    }
-    .range-slider-handle {
-      @include range-slider-handle-base;
-      @include range-slider-handle-style($bg:true, $radius: false);
-    }
-  }
-}

data/app/assets/stylesheets/foundation/components/_reveal.scss

@@ -1,202 +0,0 @@
-// Foundation by ZURB
-// foundation.zurb.com
-// Licensed under MIT Open Source
-
-@import "global";
-@import "grid";
-
-//
-// @name _reveal.scss
-// @dependencies _global.scss
-//
-
-$include-html-reveal-classes: $include-html-classes !default;
-
-// We use these to control the style of the reveal overlay.
-$reveal-overlay-bg: rgba($black, .45) !default;
-$reveal-overlay-bg-old: $black !default;
-
-// We use these to control the style of the modal itself.
-$reveal-modal-bg: $white !default;
-$reveal-position-top: rem-calc(100) !default;
-$reveal-default-width: 80% !default;
-$reveal-max-width: $row-width !default;
-$reveal-modal-padding: rem-calc(20) !default;
-$reveal-box-shadow: 0 0 10px rgba($black,.4) !default;
-
-// We use these to style the reveal close button
-$reveal-close-font-size: rem-calc(40) !default;
-$reveal-close-top: rem-calc(10) !default;
-$reveal-close-side: rem-calc(22) !default;
-$reveal-close-color: $base !default;
-$reveal-close-weight: $font-weight-bold !default;
-
-// We use this to set the default radius used throughout the core.
-$reveal-radius: $global-radius !default;
-$reveal-round: $global-rounded !default;
-
-// We use these to control the modal border
-$reveal-border-style: solid !default;
-$reveal-border-width: 1px !default;
-$reveal-border-color: $steel !default;
-
-$reveal-modal-class: "reveal-modal" !default;
-$close-reveal-modal-class: "close-reveal-modal" !default;
-
-//
-// @mixins
-//
-
-// We use this to create the reveal background overlay styles
-@mixin reveal-bg( $include-z-index-value: true ) {
-  position: fixed;
-  // position: absolute; // allows modal background to extend beyond window position
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  background: $reveal-overlay-bg-old; // Autoprefixer should be used to avoid such variables needed when Foundation for Sites can do so in the near future.
-  background: $reveal-overlay-bg;
-  z-index: if( $include-z-index-value, 1004, auto );
-  display: none;
-  #{$default-float}: 0;
-}
-
-// We use this mixin to create the structure of a reveal modal
-//
-// $base-style - Provides reveal base styles, can be set to false to override. Default: true, Options: false
-// $width - Sets reveal width Default: $reveal-default-width || 80%
-//
-@mixin reveal-modal-base( $base-style: true, $width:$reveal-default-width, $max-width:$reveal-max-width, $border-radius: $reveal-radius) {
-  @if $base-style {
-    visibility: hidden;
-    display: none;
-    position: absolute;
-    z-index: 1005;
-    width: 100vw;
-    top:0;
-    border-radius: $border-radius;
-    #{$default-float}: 0;
-
-    @media #{$small-only} {
-      min-height:100vh;
-    }
-
-    // Make sure rows don't have a min-width on them
-    .column, .columns { min-width: 0; }
-
-    // Get rid of margin from first and last element inside modal
-    & > :first-child { margin-top: 0; }
-
-    & > :last-child { margin-bottom: 0; }
-  }
-
-  @if $width {
-    @media #{$medium-up} {
-      width: $width;
-      max-width: $max-width;
-      left: 0;
-      right: 0;
-      margin: 0 auto;
-    }
-  }
-}
-
-// We use this to style the reveal modal defaults
-//
-// $bg - Sets background color of reveal modal. Default: $reveal-modal-bg || $white
-// $padding - Padding to apply to reveal modal. Default: $reveal-modal-padding.
-// $border - Choose whether reveal uses a border. Default: true, Options: false
-// $border-style - Set reveal border style. Default: $reveal-border-style || solid
-// $border-width - Width of border (i.e. 1px). Default: $reveal-border-width.
-// $border-color - Color of border. Default: $reveal-border-color.
-// $box-shadow - Choose whether or not to include the default box-shadow. Default: true, Options: false
-// $radius - If true, set to modal radius which is $global-radius || explicitly set radius amount in px (ex. $radius:10px). Default: false
-// $top-offset - Default: $reveal-position-top || 50px
-@mixin reveal-modal-style(
-  $bg:false,
-  $padding:false,
-  $border:false,
-  $border-style:$reveal-border-style,
-  $border-width:$reveal-border-width,
-  $border-color:$reveal-border-color,
-  $box-shadow:false,
-  $radius:false,
-  $top-offset:false) {
-
-  @if $bg { background-color: $bg; }
-  @if $padding != false { padding: $padding; }
-
-  @if $border { border: $border-style $border-width $border-color; }
-
-  // We can choose whether or not to include the default box-shadow.
-  @if $box-shadow {
-    box-shadow: $reveal-box-shadow;
-  }
-
-  // We can control how much radius is used on the modal
-  @if $radius == true { @include radius($reveal-radius); }
-  @else if $radius { @include radius($radius); }
-
-  @if $top-offset {
-    @media #{$medium-up} {
-      top: $top-offset;
-    }
-  }
-}
-
-// We use this to create a close button for the reveal modal
-//
-// $color - Default: $reveal-close-color || $base
-@mixin reveal-close($color:$reveal-close-color) {
-  font-size: $reveal-close-font-size;
-  line-height: 1;
-  position: absolute;
-  top: $reveal-close-top;
-  #{$opposite-direction}: $reveal-close-side;
-  color: $color;
-  font-weight: $reveal-close-weight;
-  cursor: $cursor-pointer-value;
-}
-
-@include exports("reveal") {
-  @if $include-html-reveal-classes {
-
-    // Reveal Modals
-    .reveal-modal-bg { @include reveal-bg; }
-
-    .#{$reveal-modal-class} {
-      @include reveal-modal-base;
-      @include reveal-modal-style(
-        $bg:$reveal-modal-bg,
-        $padding:$reveal-modal-padding,
-        $border:true,
-        $box-shadow:true,
-        $radius:false,
-        $top-offset:$reveal-position-top
-      );
-      @include reveal-modal-style($padding:$reveal-modal-padding * 1.5);
-
-      &.radius { @include reveal-modal-style($radius:true); }
-      &.round  { @include reveal-modal-style($radius:$reveal-round); }
-      &.collapse { @include reveal-modal-style($padding:0); }
-      &.tiny  { @include reveal-modal-base(false, 30%); }
-      &.small { @include reveal-modal-base(false, 40%); }
-      &.medium  { @include reveal-modal-base(false, 60%); }
-      &.large { @include reveal-modal-base(false, 70%); }
-      &.xlarge { @include reveal-modal-base(false, 95%); }
-      &.full {
-        @include reveal-modal-base(false, 100vw);
-        top:0;
-        left:0;
-        height:100%;
-        height: 100vh;
-        min-height:100vh;
-        max-width: none !important;
-        margin-left: 0 !important;
-      }
-
-      .#{$close-reveal-modal-class} { @include reveal-close; }
-    }
-  }
-}