locomotivecms_wagon 2.0.0.rc3 → 2.0.0.rc4

data/generators/line_case/public/stylesheets/foundation/components/_split-buttons.scss

@@ -1,167 +0,0 @@
-//
-// Split Button Variables
-//
-$include-html-button-classes: $include-html-classes !default;
-
-// We use these to control different shared styles for Split Buttons
-$split-button-function-factor: 15% !default;
-$split-button-pip-color: #fff !default;
-$split-button-pip-color-alt: #333 !default;
-$split-button-active-bg-tint: rgba(0,0,0,0.1) !default;
-
-// We use these to control tiny split buttons
-$split-button-padding-tny: $button-tny * 9 !default;
-$split-button-span-width-tny: $button-tny * 6.5 !default;
-$split-button-pip-size-tny: $button-tny !default;
-$split-button-pip-top-tny: $button-tny * 2 !default;
-$split-button-pip-default-float-tny: em-calc(-5) !default;
-
-// We use these to control small split buttons
-$split-button-padding-sml: $button-sml * 7 !default;
-$split-button-span-width-sml: $button-sml * 5 !default;
-$split-button-pip-size-sml: $button-sml !default;
-$split-button-pip-top-sml: $button-sml * 1.5 !default;
-$split-button-pip-default-float-sml: em-calc(-9) !default;
-
-// We use these to control medium split buttons
-$split-button-padding-med: $button-med * 6.4 !default;
-$split-button-span-width-med: $button-med * 4 !default;
-$split-button-pip-size-med: $button-med - em-calc(3) !default;
-$split-button-pip-top-med: $button-med * 1.5 !default;
-$split-button-pip-default-float-med: em-calc(-9) !default;
-
-// We use these to control large split buttons
-$split-button-padding-lrg: $button-lrg * 6 !default;
-$split-button-span-width-lrg: $button-lrg * 3.75 !default;
-$split-button-pip-size-lrg: $button-lrg - em-calc(6) !default;
-$split-button-pip-top-lrg: $button-lrg + em-calc(5) !default;
-$split-button-pip-default-float-lrg: em-calc(-9) !default;
-
-
-//
-// Split Button Mixin
-//
-
-// We use this mixin to create split buttons that build upon the button mixins
-@mixin split-button($padding:medium, $pip-color:$split-button-pip-color, $span-border:$primary-color, $base-style:true) {
-
-  // With this, we can control whether or not the base styles come through.
-  @if $base-style {
-    position: relative;
-
-    // Styling for the split arrow clickable area
-    span {
-      display: block;
-      height: 100%;
-      position: absolute;
-      #{$opposite-direction}: 0;
-      top: 0;
-      border-#{$default-float}: solid 1px;
-
-      // Building the triangle pip indicator
-      &:before {
-        position: absolute;
-        content: "";
-        width: 0;
-        height: 0;
-        display: block;
-        border-style: inset;
-
-        #{$default-float}: 50%;
-      }
-
-      &:active { background-color: $split-button-active-bg-tint; }
-    }
-  }
-
-  // Control the border color for the span area of the split button
-  @if $span-border {
-    span {
-      border-#{$default-float}-color: darken($span-border, $split-button-function-factor);
-    }
-  }
-
-  // Style of the button and clickable area for tiny sizes
-  @if $padding == tiny {
-    padding-#{$opposite-direction}: $split-button-padding-tny;
-
-    span { width: $split-button-span-width-tny;
-      &:before {
-        border-top-style: solid;
-        border-width: $split-button-pip-size-tny;
-        top: $split-button-pip-top-tny;
-        margin-#{$default-float}: $split-button-pip-default-float-tny;
-      }
-    }
-  }
-
-  // Style of the button and clickable area for small sizes
-  @else if $padding == small {
-    padding-#{$opposite-direction}: $split-button-padding-sml;
-
-    span { width: $split-button-span-width-sml;
-      &:before {
-        border-top-style: solid;
-        border-width: $split-button-pip-size-sml;
-        top: $split-button-pip-top-sml;
-        margin-#{$default-float}: $split-button-pip-default-float-sml;
-      }
-    }
-  }
-
-  // Style of the button and clickable area for default (medium) sizes
-  @else if $padding == medium {
-    padding-#{$opposite-direction}: $split-button-padding-med;
-
-    span { width: $split-button-span-width-med;
-      &:before {
-        border-top-style: solid;
-        border-width: $split-button-pip-size-med;
-        top: $split-button-pip-top-med;
-        margin-#{$default-float}: $split-button-pip-default-float-med;
-      }
-    }
-  }
-
-  // Style of the button and clickable area for large sizes
-  @else if $padding == large {
-    padding-#{$opposite-direction}: $split-button-padding-lrg;
-
-    span { width: $split-button-span-width-lrg;
-      &:before {
-        border-top-style: solid;
-        border-width: $split-button-pip-size-lrg;
-        top: $split-button-pip-top-lrg;
-        margin-#{$default-float}: $split-button-pip-default-float-lrg;
-      }
-    }
-  }
-
-  // Control the color of the triangle pip
-  @if $pip-color {
-    span:before { border-color: $pip-color transparent transparent transparent; }
-  }
-}
-
-
-@if $include-html-button-classes != false {
-
-  /* Split Buttons */
-  .split.button { @include split-button;
-
-    &.secondary { @include split-button(false, $split-button-pip-color, $secondary-color, false); }
-    &.alert { @include split-button(false, false, $alert-color, false); }
-    &.success { @include split-button(false, false, $success-color, false); }
-
-    &.tiny { @include split-button(tiny, false, false, false); }
-    &.small { @include split-button(small, false, false, false); }
-    &.large { @include split-button(large, false, false, false); }
-    &.expand { padding-left: 2em; }
-
-    &.secondary { @include split-button(false, $split-button-pip-color-alt, false, false); }
-
-    &.radius span { @include side-radius($opposite-direction, $global-radius); }
-    &.round span { @include side-radius($opposite-direction, 1000px); }
-  }
-
-}

data/generators/line_case/public/stylesheets/foundation/components/_sub-nav.scss

@@ -1,84 +0,0 @@
-//
-// Sub Nav Variables
-//
-$include-html-nav-classes: $include-html-classes !default;
-
-// We use these to control margin and padding
-$sub-nav-list-margin: em-calc(-4 0 18) !default;
-$sub-nav-list-padding-top: em-calc(4) !default;
-
-// We use this to control the definition
-$sub-nav-font-size: em-calc(14) !default;
-$sub-nav-font-color: #999 !default;
-$sub-nav-font-weight: normal !default;
-$sub-nav-text-decoration: none !default;
-$sub-nav-border-radius: 1000px !default;
-
-// We use these to control the active item styles
-$sub-nav-active-font-weight: bold !default;
-$sub-nav-active-bg: $primary-color !default;
-$sub-nav-active-color: #fff !default;
-$sub-nav-active-padding: em-calc(3 9) !default;
-$sub-nav-active-cursor: default !default;
-
-$sub-nav-item-divider: "" !default;
-$sub-nav-item-divider-margin: emCalc(12) !default;
-
-//
-// Sub Nav Mixins
-//
-
-@mixin sub-nav($font-color:$sub-nav-font-color, $font-size:$sub-nav-font-size, $active-bg:$sub-nav-active-bg) {
-  display: block;
-  width: auto;
-  overflow: hidden;
-  margin: $sub-nav-list-margin;
-  padding-top: $sub-nav-list-padding-top;
-  margin-#{$opposite-direction}: 0;
-  margin-#{$default-float}: em-calc(-9);
-
-  dt,
-  dd,
-  li {
-    float: $default-float;
-    display: inline;
-    margin-#{$default-float}: em-calc(9);
-    margin-bottom: em-calc(10);
-    font-weight: $sub-nav-font-weight;
-    font-size: $font-size;
-
-    a {
-      color: $font-color;
-      text-decoration: $sub-nav-text-decoration; }
-
-    &.active a {
-      @include radius($sub-nav-border-radius);
-      font-weight: $sub-nav-active-font-weight;
-      background: $active-bg;
-      padding: $sub-nav-active-padding;
-      cursor: $sub-nav-active-cursor;
-      color: $sub-nav-active-color;
-    }
-    @if $sub-nav-item-divider != "" {
-      margin-#{$default-float}: 0;
-
-      &:before {
-        content: "#{$sub-nav-item-divider}";
-        margin: 0 $sub-nav-item-divider-margin;
-      }
-
-      &:first-child:before {
-        content: "";
-        margin: 0;
-      }
-    }
-  }
-}
-
-
-@if $include-html-nav-classes != false {
-
-  /* Side Nav */
-  .sub-nav { @include sub-nav; }
-
-}

data/generators/line_case/public/stylesheets/foundation/components/_switch.scss

@@ -1,266 +0,0 @@
-//
-// Switch Variables
-//
-$include-html-form-classes: $include-html-classes !default;
-
-// Controlling border styles and background colors for the switch container
-$switch-border-color: darken(#fff, 20%) !default;
-$switch-border-style: solid !default;
-$switch-border-width: 1px !default;
-$switch-bg: #fff !default;
-
-// We use these to control the switch heights for our default classes
-$switch-height-tny: 22px !default;
-$switch-height-sml: 28px !default;
-$switch-height-med: 36px !default;
-$switch-height-lrg: 44px !default;
-$switch-bottom-margin: em-calc(20) !default;
-
-// We use these to control default font sizes for our classes.
-$switch-font-size-tny: 11px !default;
-$switch-font-size-sml: 12px !default;
-$switch-font-size-med: 14px !default;
-$switch-font-size-lrg: 17px !default;
-$switch-label-side-padding: 6px !default;
-
-// We use these to style the switch-paddle
-$switch-paddle-bg: #fff !default;
-$switch-paddle-fade-to-color: darken($switch-paddle-bg, 10%) !default;
-$switch-paddle-border-color: darken($switch-paddle-bg, 35%) !default;
-$switch-paddle-border-width: 1px !default;
-$switch-paddle-border-style: solid !default;
-$switch-paddle-transition-speed: .1s !default;
-$switch-paddle-transition-ease: ease-out !default;
-$switch-positive-color: lighten($success-color, 50%) !default;
-$switch-negative-color: #f5f5f5 !default;
-
-// Outline Style for tabbing through switches
-$switch-label-outline: 1px dotted #888 !default;
-
-
-//
-// Switch Mixins
-//
-
-// We use this mixin to create the base styles for our switch element.
-@mixin switch-base($transition-speed:$switch-paddle-transition-speed, $transition-ease:$switch-paddle-transition-ease) {
-
-  // Default position and structure for switch container.
-  position: relative;
-  padding: 0;
-  display: block;
-  overflow: hidden;
-  border-style: $switch-border-style;
-  border-width: $switch-border-width;
-  margin-bottom: $switch-bottom-margin;
-
-  // Default label styles for type and transition
-  label {
-    position: relative;
-    #{$default-float}: 0;
-    z-index: 2;
-    float: $default-float;
-    width: 50%;
-    height: 100%;
-    margin: 0;
-    font-weight: bold;
-    text-align: $default-float;
-
-    // Transition for the switch label to follow paddle
-    @include single-transition(all, $transition-speed, $transition-ease);
-  }
-
-  // So that we don't need to recreate the form with any JS, we use the
-  // existing radio button, but we cleverly position and hide it.
-  input {
-    position: absolute;
-    z-index: 3;
-    opacity: 0;
-    width: 100%;
-    height: 100%;
-    -moz-appearance: none;
-
-    // Hover and focus styles for the paddle
-    &:hover,
-    &:focus {
-      cursor: $cursor-pointer-value;
-    }
-  }
-
-  // The toggle area for radio switches. We call is a paddle.
-  span:last-child {
-    position: absolute;
-    top: -1px;
-    #{$default-float}: -1px;
-    z-index: 1;
-    display: block;
-    padding: 0;
-    border-width: $switch-paddle-border-width;
-    border-style: $switch-paddle-border-style;
-
-    // Transition for the switch paddle
-    @include single-transition(all, $transition-speed, $transition-ease);
-  }
-
-  // When a label isn't :checked, we hide it as it slides away.
-  input:not(:checked) + label { opacity: 0; }
-
-  // Controlling the position of the labels as they are toggled.
-  input:checked { display: none !important; }
-  input { #{$default-float}: 0; display: block !important; }
-
-  // Left Label alignment and position changes, including fixes for while inside a custom form
-  input:first-of-type + label,
-  input:first-of-type + span + label { #{$default-float}: -50%; }
-  input:first-of-type:checked + label,
-  input:first-of-type:checked + span + label { #{$default-float}: 0%; }
-
-  // Right Label alignment and position changes, including fixes for while inside a custom form
-  input:last-of-type + label,
-  input:last-of-type + span + label {#{$opposite-direction}: -50%; #{$default-float}: auto; text-align: $opposite-direction; }
-  input:last-of-type:checked + label,
-  input:last-of-type:checked + span + label { #{$opposite-direction}: 0%; #{$default-float}: auto; }
-
-  // Hiding custom form spans since we auto-create them
-  span.custom { display: none !important; }
-
-  // Bugfix for older Webkit, including mobile Webkit. Adapted from:
-  // http://css-tricks.com/webkit-sibling-bug/
-  @media only screen and (-webkit-min-device-pixel-ratio:0) and (max-device-width:480px) {
-    @if $experimental { -webkit-animation: webkitSiblingBugfix infinite 1s; }
-  }
-
-  @media only screen and (-webkit-min-device-pixel-ratio:1.5) {
-    @if $experimental { -webkit-animation: none 0; }
-  }
-
-  form.custom & .hidden-field {
-    margin-left: auto;
-    position: absolute;
-    visibility: visible;
-  }
-}
-
-// We use this mixin to create the size styles for switches.
-@mixin switch-size($height:$switch-height-med, $font-size:$switch-font-size-med, $line-height:2.3em) {
-
-  height: em-calc($height);
-
-  label {
-    padding: em-calc(0 $switch-label-side-padding);
-    line-height: $line-height;
-    font-size: em-calc($font-size);
-  }
-
-  input {
-    // Move the paddle to the right position
-    &:first-of-type:checked ~ span:last-child {
-      #{$default-float}: 100%;
-      margin-#{$default-float}: em-calc(-$height + 1px);
-    }
-  }
-
-  span:last-child {
-    width: em-calc($height);
-    height: em-calc($height);
-  }
-
-}
-
-// We use this mixin to add color and other fanciness to the switches.
-@mixin switch-style($paddle-bg:$switch-paddle-bg, $positive-color:$switch-positive-color, $negative-color:$switch-negative-color, $radius:false, $base-style:true) {
-
-  @if $base-style {
-    background: $switch-bg;
-    border-color: $switch-border-color;
-
-    span:last-child {
-      border-color: darken($paddle-bg, 30%);
-      background: $paddle-bg;
-      @if $experimental {
-        background: -moz-linear-gradient(top, $paddle-bg 0%, darken($paddle-bg, 5%) 100%);
-        background: -webkit-linear-gradient(top, $paddle-bg 0%, darken($paddle-bg, 5%) 100%);
-      }
-      background: linear-gradient(to bottom, $paddle-bg 0%, darken($paddle-bg, 5%) 100%);
-
-      // Building the alternating colored sides of the switch
-      @if $experimental {
-        -webkit-box-shadow: 2px 0 10px 0 rgba(0,0,0,0.07),
-                            1000px 0 0 1000px $positive-color,
-                            -2px 0 10px 0 rgba(0,0,0,0.07),
-                            -1000px 0 0 1000px $negative-color;
-      }
-      box-shadow:         2px 0 10px 0 rgba(0,0,0,0.07),
-                          1000px 0 0 980px $positive-color,
-                          -2px 0 10px 0 rgba(0,0,0,0.07),
-                          -1000px 0 0 1000px $negative-color;
-    }
-
-    &:hover,
-    &:focus {
-      span:last-child {
-        background: $paddle-bg;
-        @if $experimental {
-          background: -moz-linear-gradient(top, $paddle-bg 0%, darken($paddle-bg, 10%) 100%);
-          background: -webkit-linear-gradient(top, $paddle-bg 0%, darken($paddle-bg, 10%) 100%);
-        }
-        background: linear-gradient(to bottom, $paddle-bg 0%, darken($paddle-bg, 10%) 100%);
-      }
-    }
-
-    &:active { background: transparent; }
-  }
-
-  // Setting up the radius for switches
-  @if $radius == true {
-    @include radius(4px);
-    span:last-child { @include radius(3px); }
-  }
-  @else if $radius {
-    @include radius($radius);
-    span:last-child { @include radius($radius - 1px); }
-  }
-
-}
-
-// We use this to quickly create switches with a single mixin
-@mixin switch($transition-speed:$switch-paddle-transition-speed, $transition-ease:$switch-paddle-transition-ease, $height:$switch-height-med, $font-size:$switch-font-size-med, $line-height:2.3em, $paddle-bg:$switch-paddle-bg, $positive-color:$switch-positive-color, $negative-color:$switch-negative-color, $radius:false, $base-style:true) {
-  @include switch-base($transition-speed, $transition-ease);
-  @include switch-size($height, $font-size, $line-height);
-  @include switch-style($paddle-bg, $positive-color, $negative-color, $radius, $base-style);
-}
-
-@if $include-html-form-classes != false {
-
-  /* Foundation Switches */
-  @media only screen {
-
-    // Containing element for the radio switch
-    div.switch {
-      @include switch;
-
-      // Large radio switches
-      &.large { @include switch-size($switch-height-lrg, $switch-font-size-lrg); }
-
-      // Small radio switches
-      &.small { @include switch-size($switch-height-sml, $switch-font-size-sml, 2.1em); }
-
-      // Tiny radio switches
-      &.tiny { @include switch-size($switch-height-tny, $switch-font-size-tny, 1.9em); }
-
-      // Add a radius to the switch
-      &.radius { @include radius(4px);
-        span:last-child{ @include radius(3px); }
-      }
-
-      // Make the switch completely round, like a pill
-      &.round { @include radius(1000px);
-        span:last-child { @include radius(999px); }
-        label { padding: em-calc(0 $switch-label-side-padding + 3); }
-      }
-
-    }
-
-    @if $experimental { @-webkit-keyframes webkitSiblingBugfix { from { position: relative; } to { position: relative; } } }
-  }
-}