RubyGems - locomotivecms_wagon - Versions diffs - 2.2.0.beta1 → 2.2.0.rc1 - Mend

locomotivecms_wagon 2.2.0.beta1 → 2.2.0.rc1

Files changed (219) hide show

data/generators/foundation/public/stylesheets/foundation6/_global.scss ADDED Viewed

@@ -0,0 +1,197 @@
+// Foundation for Sites by ZURB
+// foundation.zurb.com
+// Licensed under MIT Open Source
+////
+/// @group global
+////
+/// Global width of your site. Used by the grid to determine row width.
+/// @type Number
+$global-width: rem-calc(1200) !default;
+/// Font size attribute applied to `<html>` and `<body>`. We use 100% by default so the value is inherited from the user's browser settings.
+/// @type Number
+$global-font-size: 100% !default;
+/// Default line height for all type. `$global-lineheight` is 24px while `$global-font-size` is 16px
+/// @type Number
+$global-lineheight: 1.5 !default;
+/// Primary color for interactive components like links and buttons.
+/// @type Color
+$primary-color: #2199e8 !default;
+/// Secondary color, used with components that support the `.secondary` class.
+/// @type Color
+$secondary-color: #777 !default;
+/// Color to indicate a positive status or action, used with the `.success` class.
+/// @type Color
+$success-color: #3adb76 !default;
+/// Color to indicate a caution status or action, used with the `.warning` class.
+/// @type Color
+$warning-color: #ffae00 !default;
+/// Color to indicate a negative status or action, used with the `.alert` class.
+/// @type Color
+$alert-color: #ec5840 !default;
+/// Color used for light gray UI items.
+/// @type Color
+$light-gray: #e6e6e6 !default;
+/// Color used for medium gray UI items.
+/// @type Color
+$medium-gray: #cacaca !default;
+/// Color used for dark gray UI items.
+/// @type Color
+$dark-gray: #8a8a8a !default;
+/// Color used for black ui items.
+/// @type Color
+$black: #0a0a0a !default;
+/// Color used for white ui items.
+/// @type Color
+$white: #fefefe !default;
+/// Background color of the body.
+/// @type Color
+$body-background: $white !default;
+/// Text color of the body.
+/// @type Color
+$body-font-color: $black !default;
+/// Font stack of the body.
+/// @type List
+$body-font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif !default;
+/// Set to `true` to enable antialiased type, using the `-webkit-font-smoothing` and `-moz-osx-font-smoothing` CSS properties.
+/// @type Boolean
+$body-antialiased: true !default;
+/// Text direction for the document. Set to `rtl` to reverse the orientation and direction of all components.
+/// @type Keyword
+$text-direction: ltr !default;
+/// Global value used for margin on components.
+/// @type Number
+$global-margin: 1rem !default;
+/// Global value used for padding on components.
+/// @type Number
+$global-padding: 1rem !default;
+/// Global value used for margin between components.
+/// @type Number
+$global-margin: 1rem !default;
+/// Global font weight used for normal type.
+/// @type Keyword | Number
+$global-weight-normal: normal !default;
+/// Global font weight used for bold type.
+/// @type Keyword | Number
+$global-weight-bold: bold !default;
+/// Global value used for all elements that have a border radius.
+/// @type Number
+$global-radius: 0 !default;
+/// Sets the text direction of the CSS. Can be either `ltr` or `rtl`.
+$global-text-direction: ltr !default;
+// Internal variables used for text direction
+$global-left: if($global-text-direction == rtl, right, left);
+$global-right: if($global-text-direction == rtl, left, right);
+// Internal map used to iterate through colors, to generate CSS classes with less code
+$foundation-colors: (
+  primary: $primary-color,
+  secondary: $secondary-color,
+  success: $success-color,
+  alert: $alert-color,
+  warning: $warning-color,
+);
+@mixin foundation-global-styles {
+  html,
+  body {
+    font-size: $global-font-size;
+    box-sizing: border-box;
+  }
+  // Set box-sizing globally to handle padding and border widths
+  *,
+  *:before,
+  *:after {
+    box-sizing: inherit;
+  }
+  // Default body styles
+  body {
+    padding: 0;
+    margin: 0;
+    font-family: $body-font-family;
+    font-weight: $global-weight-normal;
+    line-height: $global-lineheight;
+    color: $body-font-color;
+    background: $body-background;
+    @if ($body-antialiased) {
+      -webkit-font-smoothing: antialiased;
+      -moz-osx-font-smoothing: grayscale;
+    }
+  }
+  img {
+    // Grid defaults to get images and embeds to work properly
+    max-width: 100%;
+    height: auto;
+    -ms-interpolation-mode: bicubic;
+    // Get rid of gap under images by making them display: inline-block; by default
+    display: inline-block;
+    vertical-align: middle;
+  }
+  // Make sure textarea takes on height automatically
+  textarea {
+    height: auto;
+    min-height: 50px;
+    border-radius: $global-radius;
+  }
+  // Make select elements are 100% width by default
+  select {
+    width: 100%;
+    border-radius: $global-radius;
+  }
+  // Styles Google Maps and MapQuest embeds properly
+  // scss-lint:disable IdSelector
+  #map_canvas,
+  .map_canvas,
+  .mqa-display {
+    img,
+    embed,
+    object {
+      max-width: none !important;
+    }
+  }
+  // Reset <button> styles created by most browsers
+  button {
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    background: transparent;
+    padding: 0;
+    border: 0;
+    border-radius: $global-radius;
+    line-height: 1;
+  }
+}

data/generators/foundation/public/stylesheets/foundation6/components/_accordion-menu.scss ADDED Viewed

@@ -0,0 +1,28 @@
+////
+/// @group accordion-menu
+////
+/// Sets if accordion menus have the default arrow styles.
+/// @type Boolean
+$accordionmenu-arrows: true;
+@mixin foundation-accordion-menu {
+  @if $accordionmenu-arrows {
+    .is-accordion-submenu-parent > a {
+      position: relative;
+      &::after {
+        @include css-triangle(6px, $primary-color, down);
+        position: absolute;
+        top: 50%;
+        margin-top: -4px;
+        right: 1rem;
+      }
+    }
+    .is-accordion-submenu-parent[aria-expanded="true"] > a::after {
+      transform-origin: 50% 50%;
+      transform: scaleY(-1);
+    }
+  }
+}

data/generators/foundation/public/stylesheets/foundation6/components/_accordion.scss ADDED Viewed

@@ -0,0 +1,112 @@
+// Foundation for Sites by ZURB
+// foundation.zurb.com
+// Licensed under MIT Open Source
+////
+/// @group accordion
+////
+/// Default background color of an accordion group.
+/// @type Color
+$accordion-background: $white;
+/// If `true`, adds plus and minus icons to the side of each accordion title.
+/// @type Boolean
+$accordion-plusminus: true;
+/// Default text color for items in a Menu.
+/// @type Color
+$accordion-item-color: foreground($accordion-background, $primary-color);
+/// Default background color on hover for items in a Menu.
+/// @type Color
+$accordion-item-background-hover: $light-gray !default;
+/// Default padding of an accordion item.
+/// @type Number | List
+$accordion-item-padding: 1.25rem 1rem !default;
+/// Default background color of tab content.
+/// @type Color
+$accordion-content-background: $white !default;
+/// Default border color of tab content.
+/// @type Color
+$accordion-content-border: 1px solid $light-gray !default;
+/// Default text color of tab content.
+/// @type Color
+$accordion-content-color: foreground($accordion-background, $primary-color);
+/// Default padding for tab content.
+/// @type Number | List
+$accordion-content-padding: 1rem !default;
+/// Adds styles for an accordion container. Apply this to the same element that gets `data-accordion`.
+@mixin accordion-container {
+  list-style-type: none;
+  background: $accordion-background;
+  border: $accordion-content-border;
+  border-radius: $global-radius;
+  margin-#{$global-left}: 0;
+}
+/// Adds styles for the title of an accordion item. Apply this to the link within an accordion item.
+@mixin accordion-title {
+  display: block;
+  padding: $accordion-item-padding;
+  line-height: 1;
+  font-size: rem-calc(12);
+  color: $accordion-item-color;
+  position: relative;
+  border-bottom: $accordion-content-border;
+  &:hover,
+  &:focus {
+    background-color: $accordion-item-background-hover;
+  }
+  // Remove the border on the last title
+  :last-child > & {
+    border-bottom-width: 0;
+  }
+  @if $accordion-plusminus {
+    &::before {
+      content: '+';
+      position: absolute;
+      #{$global-right}: 1rem;
+      top: 50%;
+      margin-top: -0.5rem;
+    }
+    .is-active > &::before {
+      content: '–';
+    }
+  }
+}
+/// Adds styles for accordion content. Apply this to the content pane below an accordion item's title.
+@mixin accordion-content {
+  padding: $accordion-item-padding;
+  display: none;
+  border-bottom: $accordion-content-border;
+}
+@mixin foundation-accordion {
+  .accordion {
+    @include accordion-container;
+  }
+  .accordion-item {
+    // This class doesn't need styles!
+  }
+  .accordion-title {
+    @include accordion-title;
+  }
+  .accordion-content {
+    @include accordion-content;
+  }
+}

data/generators/foundation/public/stylesheets/foundation6/components/_badge.scss ADDED Viewed

@@ -0,0 +1,55 @@
+// Foundation for Sites by ZURB
+// foundation.zurb.com
+// Licensed under MIT Open Source
+////
+/// @group badge
+////
+/// Default background color for badges.
+/// @type Color
+$badge-background: $primary-color !default;
+/// Default text color for badges.
+/// @type Color
+$badge-color: foreground($badge-background) !default;
+/// Default padding inside badges.
+/// @type Number
+$badge-padding: 0.3em !default;
+/// Minimum width of a badge.
+/// @type Number
+$badge-minwidth: 2.1em !default;
+/// Default font size for badges.
+/// @type Number
+$badge-font-size: 0.6rem !default;
+/// Generates the base styles for a badge.
+@mixin badge {
+  display: inline-block;
+  padding: $badge-padding;
+  min-width: $badge-minwidth;
+  font-size: $badge-font-size;
+  text-align: center;
+  border-radius: 50%;
+}
+@mixin foundation-badge {
+  .badge {
+    @include badge;
+    background: $badge-background;
+    color: $badge-color;
+    @each $name, $color in $foundation-colors {
+      @if $name != primary {
+        &.#{$name} {
+          background: $color;
+          color: foreground($color);
+        }
+      }
+    }
+  }
+}

data/generators/foundation/public/stylesheets/foundation6/components/_breadcrumbs.scss ADDED Viewed

@@ -0,0 +1,94 @@
+// Foundation for Sites by ZURB
+// foundation.zurb.com
+// Licensed under MIT Open Source
+////
+/// @group breadcrumbs
+////
+/// Margin around a breadcrumbs container.
+/// @type Number
+$breadcrumbs-margin: 0 0 $global-margin 0 !default;
+/// Font size of breadcrumb links.
+/// @type Number
+$breadcrumbs-item-font-size: rem-calc(11) !default;
+/// Color of breadcrumb links.
+/// @type Color
+$breadcrumbs-item-color: $primary-color !default;
+/// Color of the active breadcrumb link.
+/// @type Color
+$breadcrumbs-item-color-current: $black !default;
+/// Opacity of disabled breadcrumb links.
+/// @type Number
+$breadcrumbs-item-color-disabled: $medium-gray !default;
+/// Margin between breadcrumb items.
+/// @type Number
+$breadcrumbs-item-margin: 0.75rem !default;
+/// If `true`, makes breadcrumb links uppercase.
+/// @type Boolean
+$breadcrumbs-item-uppercase: true !default;
+/// If `true`, adds a slash between breadcrumb links.
+/// @type Boolean
+$breadcrumbs-item-slash: true !default;
+/// Adds styles for a breadcrumbs container, along with the styles for the `<li>` and `<a>` elements inside of it.
+@mixin breadcrumbs-container {
+  @include clearfix;
+  list-style: none;
+  margin: $breadcrumbs-margin;
+  // Item wrapper
+  li {
+    float: #{$global-left};
+    color: $breadcrumbs-item-color-current;
+    font-size: $breadcrumbs-item-font-size;
+    cursor: default;
+    @if $breadcrumbs-item-uppercase {
+      text-transform: uppercase;
+    }
+    @if $breadcrumbs-item-slash {
+      // Need to escape the backslash
+      $slash: if($global-text-direction == 'ltr', '/', '\\');
+      &:not(:last-child)::after {
+        color: $medium-gray;
+        content: $slash;
+        margin: 0 $breadcrumbs-item-margin;
+        position: relative;
+        top: 1px;
+        opacity: 1;
+      }
+    }
+    @else {
+      margin-#{$global-right}: $breadcrumbs-item-margin;
+    }
+  }
+  // Page links
+  a {
+    color: $breadcrumbs-item-color;
+    &:hover {
+      text-decoration: underline;
+    }
+  }
+}
+@mixin foundation-breadcrumbs {
+  .breadcrumbs {
+    @include breadcrumbs-container;
+    .disabled {
+      color: $breadcrumbs-item-color-disabled;
+    }
+  }
+}

data/generators/foundation/public/stylesheets/foundation6/components/_button-group.scss ADDED Viewed

@@ -0,0 +1,115 @@
+// Foundation for Sites by ZURB
+// foundation.zurb.com
+// Licensed under MIT Open Source
+////
+/// @group button-group
+////
+/// Margin for button groups.
+/// @type Number
+$buttongroup-margin: 1rem;
+/// Margin between buttons in a button group.
+/// @type Border
+$buttongroup-spacing: 1px;
+/// Selector for the buttons inside a button group.
+/// @type String
+$buttongroup-child-selector: '.button';
+/// Maximum number of buttons that can be in an even-width button group.
+/// @type Number
+$buttongroup-expand-max: 6;
+/// Add styles for a button group container.
+/// @param {String} $child-selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.
+@mixin button-group(
+  $child-selector: $buttongroup-child-selector
+) {
+  @include clearfix;
+  margin-bottom: $buttongroup-margin;
+  font-size: map-get($button-sizes, default);
+  #{$child-selector} {
+    float: #{$global-left};
+    margin: 0;
+    font-size: inherit;
+    &:not(:last-child) {
+      border-#{$global-right}: $buttongroup-spacing solid $body-background;
+    }
+  }
+}
+/// Creates a full-width button group, making each button equal width.
+/// @param {Keyword|Number} $count [auto] - Number of buttons inside the button group. Set to `auto` to generate CSS that will account for a variable number of buttons.
+/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.
+@mixin button-group-expand(
+  $count: auto,
+  $selector: $buttongroup-child-selector
+) {
+  #{$selector} {
+    @if $count == auto {
+      @include auto-width($buttongroup-expand-max, $selector);
+    }
+    @else if type-of($count) == 'number' {
+      width: percentage(1 / $count);
+    }
+  }
+}
+/// Stacks the buttons in a button group.
+/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside the button group.
+@mixin button-group-stack(
+  $selector: $buttongroup-child-selector
+) {
+  #{$selector} {
+    width: 100%;
+    border-#{$global-right}: 0;
+  }
+}
+/// Un-stacks the buttons in a button group.
+/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside the button group.
+@mixin button-group-unstack(
+  $selector: $buttongroup-child-selector
+) {
+  #{$selector} {
+    width: auto;
+    &:not(:last-child) {
+      border-#{$global-right}: $buttongroup-spacing solid $body-background;
+    }
+  }
+}
+@mixin foundation-button-group {
+  .button-group {
+    @include button-group;
+    // Sizes
+    &.tiny     { font-size: map-get($button-sizes, tiny); }
+    &.small    { font-size: map-get($button-sizes, small); }
+    &.large    { font-size: map-get($button-sizes, large); }
+    &.expanded { @include button-group-expand; }
+    // Colors
+    @each $name, $color in $foundation-colors {
+      &.#{$name} #{$buttongroup-child-selector} {
+        @include button-style($color, auto, auto);
+      }
+    }
+    &.stacked,
+    &.stacked-for-small {
+      @include button-group-stack;
+    }
+    &.stacked-for-small {
+      @include breakpoint(medium) {
+        @include button-group-unstack;
+      }
+    }
+  }
+}