foundation-rails 5.5.3.2 → 6.1.1.0

data/vendor/assets/scss/components/_callout.scss

@@ -0,0 +1,105 @@
+// Foundation for Sites by ZURB
+// foundation.zurb.com
+// Licensed under MIT Open Source
+
+////
+/// @group callout
+////
+
+/// Defualt background color.
+/// @type Color
+$callout-background: $white !default;
+
+/// Default fade value for callout backgrounds.
+/// @type Number
+$callout-background-fade: 85% !default;
+
+/// Defualt border style for callouts.
+/// @type List
+$callout-border: 1px solid rgba($black, 0.25) !default;
+
+/// Default bottom margin for callouts.
+/// @type Number
+$callout-margin: 0 0 1rem 0 !default;
+
+/// Default inner padding for callouts.
+/// @type Number
+$callout-padding: 1rem !default;
+
+/// Default font color for callouts.
+/// @type Color
+$callout-font-color: $body-font-color !default;
+
+/// Default font color for callouts, if the callout has a dark background.
+/// @type Color
+$callout-font-color-alt: $body-background !default;
+
+/// Default border radius for callouts.
+/// @type Color
+$callout-radius: $global-radius !default;
+
+/// Amount to tint links used within colored panels. Set to `false` to disable this feature.
+/// @type Number | Boolean
+$callout-link-tint: 30% !default;
+
+/// Adds basic styles for a callout, including padding and margin.
+@mixin callout-base() {
+  margin: $callout-margin;
+  padding: $callout-padding;
+  border: $callout-border;
+  border-radius: $callout-radius;
+  position: relative;
+  color: $callout-font-color;
+
+  // Respect the padding, fool.
+  > :first-child {
+    margin-top: 0;
+  }
+
+  > :last-child {
+    margin-bottom: 0;
+  }
+}
+
+/// Generate quick styles for a callout using a single color as a baseline.
+/// @param {Color} $color [$callout-background] - Color to use.
+@mixin callout-style($color: $callout-background) {
+  $background: scale-color($color, $lightness: $callout-background-fade);
+
+  background-color: $background;
+}
+
+@mixin callout-size($padding) {
+  padding-top: $padding;
+  padding-right: $padding;
+  padding-bottom: $padding;
+  padding-left: $padding;
+}
+
+
+/// Adds styles for a callout.
+/// @param {Color} $color [$callout-background] - Color to use.
+@mixin callout($color: $callout-background) {
+  @include callout-base;
+  @include callout-style($color);
+}
+
+@mixin foundation-callout {
+  .callout {
+    @include callout;
+
+    @each $name, $color in $foundation-colors {
+      &.#{$name} {
+        @include callout-style($color);
+      }
+    }
+
+    &.small {
+      @include callout-size(0.5rem);
+    }
+
+    &.large {
+      @include callout-size(3rem);
+    }
+  }
+}

data/vendor/assets/scss/components/_close-button.scss

@@ -0,0 +1,61 @@
+// Foundation for Sites by ZURB
+// foundation.zurb.com
+// Licensed under MIT Open Source
+
+////
+/// @group close-button
+////
+
+/// Default position of the close button. The first value should be `right` or `left`, and the second value should be `top` or `bottom`.
+/// @type List
+$closebutton-position: right top !default;
+
+/// Right (or left) offset for a close button.
+/// @type Number
+$closebutton-offset-horizontal: 1rem !default;
+
+/// Top (or bottom) offset for a close button.
+/// @type Number
+$closebutton-offset-vertical: 0.5rem !default;
+
+/// Default font size of the close button.
+/// @type Number
+$closebutton-size: 2em !default;
+
+/// The line-height of the close button. It affects the spacing of the element.
+/// @type Number
+$closebutton-lineheight: 1 !default;
+
+/// Default color of the close button.
+/// @type Color
+$closebutton-color: $dark-gray !default;
+
+/// Default color of the close button when being hovered on.
+/// @type Color
+$closebutton-color-hover: $black !default;
+
+/// Adds styles for a close button, using the styles in the settings variables.
+@mixin close-button {
+  $x: nth($closebutton-position, 1);
+  $y: nth($closebutton-position, 2);
+
+  @include disable-mouse-outline;
+  position: absolute;
+  color: $closebutton-color;
+  #{$x}: $closebutton-offset-horizontal;
+  #{$y}: $closebutton-offset-vertical;
+  font-size: $closebutton-size;
+  line-height: $closebutton-lineheight;
+  cursor: pointer;
+
+  &:hover,
+  &:focus {
+    color: $closebutton-color-hover;
+  }
+}
+
+@mixin foundation-close-button {
+  .close-button {
+    @include close-button;
+  }
+}

data/vendor/assets/scss/components/_drilldown.scss

@@ -0,0 +1,75 @@
+// Foundation for Sites by ZURB
+// foundation.zurb.com
+// Licensed under MIT Open Source
+
+////
+/// @group drilldown
+////
+
+/// Transition property to use for animating menus.
+/// @type Transition
+$drilldown-transition: transform 0.15s linear !default;
+
+/// Adds arrows to drilldown items with submenus, as well as the back button.
+/// @type Boolean
+$drilldown-arrows: true !default;
+
+/// Sets drilldown arrow color if arrow is used.
+/// @type Color
+$drilldown-arrow-color: $primary-color !default;
+
+/// Background color for drilldown submenus.
+/// @type Color
+$drilldown-background: $white !default;
+
+@mixin foundation-drilldown-menu {
+  // Applied to the Menu container
+  .is-drilldown {
+    position: relative;
+    overflow: hidden;
+  }
+
+  // Applied to nested <ul>s
+  .is-drilldown-submenu {
+    position: absolute;
+    top: 0;
+    #{$global-left}: 100%;
+    z-index: -1;
+    height: 100%;
+    width: 100%;
+    background: $drilldown-background;
+    transition: $drilldown-transition;
+
+    &.is-active {
+      z-index: 1;
+      display: block;
+      transform: translateX(if($global-text-direction == ltr, -100%, 100%));
+    }
+
+    &.is-closing {
+      transform: translateX(if($global-text-direction == ltr, 100%, -100%));
+    }
+  }
+
+  @if $drilldown-arrows {
+    .is-drilldown-submenu-parent > a {
+      position: relative;
+
+      &::after {
+        @include css-triangle(6px, $drilldown-arrow-color, $global-right);
+        position: absolute;
+        top: 50%;
+        margin-top: -6px;
+        #{$global-right}: 1rem;
+      }
+    }
+
+    .js-drilldown-back::before {
+      @include css-triangle(6px, $drilldown-arrow-color, $global-left);
+      float: $global-left;
+      margin-#{$global-right}: 0.75rem; // Creates space between the arrow and the text
+      margin-#{$global-left}: 0.6rem; // Lines the tip of the arrow with the items below
+      margin-top: 14px; // Aligns the arrow with the text
+    }
+  }
+}

data/vendor/assets/scss/components/_dropdown-menu.scss

@@ -0,0 +1,148 @@
+// Foundation for Sites by ZURB
+// foundation.zurb.com
+// Licensed under MIT Open Source
+
+////
+/// @group dropdown-menu
+////
+
+/// Enables arrows for items with dropdown menus.
+/// @type Boolean
+$dropdownmenu-arrows: true !default;
+
+/// Sets dropdown menu arrow color if arrow is used.
+/// @type Color
+$dropdownmenu-arrow-color: $anchor-color !default;
+
+/// Minimum width of dropdown sub-menus.
+/// @type Length
+$dropdownmenu-min-width: 200px !default;
+
+/// Background color for dropdowns.
+/// @type Color
+$dropdownmenu-background: $white !default;
+
+/// Border for dropdown sub-menus.
+/// @type List
+$dropdownmenu-border: 1px solid $medium-gray !default;
+
+// Border width for dropdown sub-menus.
+// Used to adjust top margin of a sub-menu if a border is used.
+// @type Length
+$dropdownmenu-border-width: nth($dropdownmenu-border, 1);
+
+@mixin foundation-dropdown-menu {
+  .dropdown.menu {
+    a {
+      @include disable-mouse-outline;
+    }
+    .is-dropdown-submenu-parent {
+      position: relative;
+
+      a::after {
+        float: $global-right;
+        margin-top: 3px;
+        margin-#{$global-left}: 10px;
+      }
+
+      @if $dropdownmenu-arrows {
+        &.is-down-arrow a {
+          padding-#{$global-right}: 1.5rem;
+          position: relative;
+        }
+
+        &.is-down-arrow > a::after {
+          @include css-triangle(5px, $dropdownmenu-arrow-color, down);
+          position: absolute;
+          top: rem-calc(2px) + rem-calc(get-side($menu-item-padding, top));
+          #{$global-right}: 5px;
+        }
+
+        &.is-left-arrow > a::after {
+          @include css-triangle(5px, $dropdownmenu-arrow-color, left);
+          float: left;
+          margin-left: 0;
+          margin-right: 10px;
+        }
+
+        &.is-right-arrow > a::after {
+          @include css-triangle(5px, $dropdownmenu-arrow-color, right);
+        }
+      }
+
+      &.is-left-arrow.opens-inner .submenu {
+        right: 0;
+        left: auto;
+      }
+
+      &.is-right-arrow.opens-inner .submenu {
+        left: 0;
+        right: auto;
+      }
+      
+      &.opens-inner .submenu {
+        top: 100%;
+      }
+    }
+
+    .no-js & ul {
+      display: none;
+    }
+
+    .submenu {
+      display: none;
+      position: absolute;
+      top: 0;
+      left: 100%;
+      min-width: $dropdownmenu-min-width;
+      z-index: 1;
+      background: $dropdownmenu-background;
+      border: $dropdownmenu-border;
+
+      @if (type-of($dropdownmenu-border-width) == 'number') {
+        margin-top: (-$dropdownmenu-border-width);
+      }
+
+      > li {
+        width: 100%;
+      }
+
+      &.first-sub {
+        top: 100%;
+        left: 0;
+        right: auto;
+      }
+
+      &:not(.js-dropdown-nohover) > .is-dropdown-submenu-parent:hover > &,
+      &.js-dropdown-active {
+        display: block;
+      }
+    }
+
+    .is-dropdown-submenu-parent.opens-left .submenu {
+      left: auto;
+      right: 100%;
+    }
+
+    &.align-right {
+      .submenu.first-sub {
+        top: 100%;
+        left: auto;
+        right: 0;
+      }
+    }
+  }
+
+  .is-dropdown-menu.vertical {
+    width: 100px;
+
+    &.align-right {
+      float: right;
+    }
+
+    > li .submenu {
+      top: 0;
+      left: 100%;
+    }
+  }
+}

data/vendor/assets/scss/components/_dropdown.scss

@@ -0,0 +1,64 @@
+// Foundation for Sites by ZURB
+// foundation.zurb.com
+// Licensed under MIT Open Source
+
+////
+/// @group dropdown
+////
+
+/// Padding for dropdown panes.
+/// @type List
+$dropdown-padding: 1rem !default;
+
+/// Border for dropdown panes.
+/// @type List
+$dropdown-border: 1px solid $medium-gray !default;
+
+/// Font size for dropdown panes.
+/// @type List
+$dropdown-font-size: 16rem !default;
+
+/// Width for dropdown panes.
+/// @type Number
+$dropdown-width: 300px !default;
+
+/// Border radius dropdown panes.
+/// @type Number
+$dropdown-radius: $global-radius !default;
+
+/// Sizes for dropdown panes. Each size is a CSS class you can apply.
+/// @type Map
+$dropdown-sizes: (
+  tiny: 100px,
+  small: 200px,
+  large: 400px,
+) !default;
+
+/// Applies styles for a basic dropdown.
+@mixin dropdown-container {
+  background-color: $body-background;
+  border: $dropdown-border;
+  display: block;
+  padding: $dropdown-padding;
+  position: absolute;
+  visibility: hidden;
+  width: $dropdown-width;
+  z-index: 10;
+  border-radius: $dropdown-radius;
+
+  &.is-open {
+    visibility: visible;
+  }
+}
+
+@mixin foundation-dropdown {
+  .dropdown-pane {
+    @include dropdown-container;
+  }
+
+  @each $name, $size in $dropdown-sizes {
+    .dropdown-pane.#{$name} {
+      width: $size;
+    }
+  }
+}