foundation-rails 6.1.1.3 → 6.1.2.0

data/vendor/assets/scss/components/_media-object.scss

@@ -34,7 +34,7 @@ $mediaobject-image-width-stacked: 100% !default;
     padding-#{$global-right}: $padding;
   }
 
-  &:last-child:not(+ #{&}:first-child) {
+  &:last-child:not(:nth-child(2)) {
     padding-#{$global-left}: $padding;
   }
 }

data/vendor/assets/scss/components/_menu.scss

@@ -39,7 +39,7 @@ $menu-expand-max: 6 !default;
   }
 
   // Reset line height to make the height of the overall item easier to calculate
-  > li:not(.menu-text) > a {
+  > li > a {
     display: block;
     padding: $menu-item-padding;
     line-height: 1;
@@ -80,9 +80,14 @@ $menu-expand-max: 6 !default;
 
 /// Creates a simple Menu, which has no padding or hover state.
 @mixin menu-simple {
+  li {
+    line-height: 1;
+    display: inline-block;
+    margin-#{$global-right}: get-side($menu-item-padding, $global-right);
+  }
+
   a {
     padding: 0;
-    margin-#{$global-right}: get-side($menu-item-padding, $global-right);
   }
 }
 

data/vendor/assets/scss/components/_off-canvas.scss

@@ -88,10 +88,6 @@ $maincontent-shadow: 0 0 10px rgba($black, 0.5) !default;
     background: $offcanvas-exit-background;
     cursor: pointer;
     transition: background $offcanvas-transition-length $offcanvas-transition-timing;
-
-    .is-off-canvas-open & {
-      display: block;
-    }
   }
 }
 

data/vendor/assets/scss/components/_orbit.scss

@@ -67,7 +67,7 @@ $orbit-control-zindex: 10 !default;
 @mixin orbit-slide {
   width: 100%;
   max-height: 100%;
-  
+
   &.no-motionui {
     &.is-active {
       top: 0;

data/vendor/assets/scss/components/_pagination.scss

@@ -68,10 +68,14 @@ $pagination-arrows: true !default;
   li {
     font-size: $pagination-font-size;
     margin-#{$global-right}: $pagination-item-spacing;
-    display: none;
     border-radius: $pagination-radius;
 
-    @if not $pagination-mobile-items {
+    @if $pagination-mobile-items {
+      display: inline-block;
+    }
+    @else {
+      display: none;
+
       &:last-child,
       &:first-child {
         display: inline-block;

data/vendor/assets/scss/components/_progress-bar.scss

@@ -41,20 +41,25 @@ $progress-radius: $global-radius !default;
   width: 0%;
   height: 100%;
   background-color: $progress-meter-background;
-  border-radius: $global-radius;
+
+  @if has-value($progress-radius) {
+    border-radius: $global-radius;
+  }
 }
 
 /// Adds styles for text in the progress meter.
 @mixin progress-meter-text {
+  @include absolute-center;
   position: absolute;
-  top: 50%;
-  #{$global-left}: 50%;
-  transform: translate(-50%, -50%);
   margin: 0;
   font-size: 0.75rem;
   font-weight: bold;
   color: $white;
   white-space: nowrap;
+
+  @if has-value($progress-radius) {
+    border-radius: $progress-radius;
+  }
 }
 
 @mixin foundation-progress-bar {
@@ -71,13 +76,13 @@ $progress-radius: $global-radius !default;
     }
   }
 
-  // Progress bar meter
+  // Inner meter
   .progress-meter {
     @include progress-meter;
+  }
 
-    // Progress bar meter text
-    .progress-meter-text {
-      @include progress-meter-text;
-    }
+  // Inner meter text
+  .progress-meter-text {
+    @include progress-meter-text;
   }
 }

data/vendor/assets/scss/components/_reveal.scss

@@ -63,7 +63,7 @@ $reveal-overlay-background: rgba($black, 0.45) !default;
   z-index: $reveal-zindex + 1;
   padding: $reveal-padding;
   border: $reveal-border;
-  margin: 100px auto 0;
+  margin: $reveal-offset auto 0;
   background-color: $reveal-background;
   border-radius: $reveal-radius;
 
@@ -112,6 +112,8 @@ $reveal-overlay-background: rgba($black, 0.45) !default;
 }
 
 @mixin foundation-reveal {
+  // [TODO] Is this necessary?
+  // scss-lint:disable QualifyingElement
   body.is-reveal-open {
     overflow: hidden;
   }
@@ -128,11 +130,6 @@ $reveal-overlay-background: rgba($black, 0.45) !default;
     position: absolute;
     overflow-y: auto;
 
-    // Remove padding
-    &.collapse {
-      padding: 0;
-    }
-
     // Placeholder selector for medium-and-up modals
     // Prevents duplicate CSS when defining multiple Reveal sizes
     @include breakpoint(medium) {
@@ -143,6 +140,11 @@ $reveal-overlay-background: rgba($black, 0.45) !default;
       }
     }
 
+    // Remove padding
+    &.collapse {
+      padding: 0;
+    }
+
     // Sizing classes
     &.tiny  { @include reveal-modal-width(30%); }
     &.small { @include reveal-modal-width(50%); }

data/vendor/assets/scss/components/_slider.scss

@@ -155,4 +155,11 @@ $slider-transition: all 0.2s ease-in-out !default;
   .slider.vertical {
     @include slider-vertical;
   }
+
+  // RTL support
+  @if $global-text-direction == rtl {
+    .slider:not(.vertical) {
+      transform: scale(-1, 1);
+    }
+  }
 }

data/vendor/assets/scss/components/_table.scss

@@ -8,120 +8,133 @@
 /// @group table
 ////
 
-/// Defualt color for table background.
+/// Default color for table background.
 /// @type Color
 $table-background: $white  !default;
 
-/// Defualt scale for darkening the striped table rows and the table border.
+/// Default scale for darkening the striped table rows and the table border.
 /// @type Number
 $table-color-scale: 5% !default;
 
-/// Defualt style for table border.
+/// Default style for table border.
 /// @type List
 $table-border: 1px solid smart-scale($table-background, $table-color-scale) !default;
 
-/// Defualt padding for table.
+/// Default padding for table.
 /// @type Number
 $table-padding: rem-calc(8 10 10) !default;
 
-/// Defualt scale for darkening the table rows on hover.
+/// Default scale for darkening the table rows on hover.
 /// @type Number
 $table-hover-scale: 2% !default;
 
-/// Defualt color of standard rows on hover.
+/// Default color of standard rows on hover.
 /// @type List
 $table-row-hover: darken($table-background, $table-hover-scale) !default;
 
-/// Defualt color of striped rows on hover.
+/// Default color of striped rows on hover.
 /// @type List
 $table-row-stripe-hover: darken($table-background, $table-color-scale + $table-hover-scale) !default;
 
-/// Defualt background color for striped rows.
+/// Default background color for striped rows.
 /// @type Color
 $table-striped-background: smart-scale($table-background, $table-color-scale) !default;
 
-/// Defualt value for showing the stripe on rows of the tables, excluding the header and footer If even, the even rows will have a background color. If odd, the odd rows will have a background color. If empty, or anyother value, the table rows will have no striping.
+/// Default value for showing the stripe on rows of the tables, excluding the header and footer If even, the even rows will have a background color. If odd, the odd rows will have a background color. If empty, or anyother value, the table rows will have no striping.
 /// @type Keyoword
 $table-stripe: even !default;
 
-/// Defualt color for header background.
+/// Default color for header background.
 /// @type Color
 $table-head-background: smart-scale($table-background, $table-color-scale / 2) !default;
 
-/// Defualt color for footer background.
+/// Default color for footer background.
 /// @type Color
 $table-foot-background: smart-scale($table-background, $table-color-scale) !default;
 
-/// Defualt font color for header.
+/// Default font color for header.
 /// @type Color
 $table-head-font-color: $body-font-color !default;
 
-/// Defualt value for showing the header when using stacked tables.
+/// Default value for showing the header when using stacked tables.
 /// @type Boolean
 $show-header-for-stacked: false !default;
 
-/// Adds the general styles for tables.
-/// @param {Keyword} $stripe [$table-stripe] - Uses kewords even, odd, or none to darken rows of the table. The defualt value is even.
-@mixin table($stripe: $table-stripe) {
-  margin-bottom: $global-margin;
-  border-radius: $global-radius;
+@mixin -zf-table-children-styles($stripe: $table-stripe) {
+  thead,
+  tbody,
+  tfoot {
+    border: $table-border;
+    background-color: $table-background;
+  }
+
+  // Caption
+  caption {
+    font-weight: $global-weight-bold;
+    padding: $table-padding;
+  }
 
-  @at-root {
-    thead,
-    tbody,
-    tfoot {
-      border: $table-border;
-      background-color: $table-background;
+  // Table head and foot
+  thead,
+  tfoot {
+    background: $table-head-background;
+    color: $table-head-font-color;
+
+    // Rows within head and foot
+    tr {
+      background: transparent;
     }
 
-    // Caption
-    caption {
-      font-weight: $global-weight-bold;
+    // Cells within head and foot
+    th,
+    td {
       padding: $table-padding;
+      font-weight: $global-weight-bold;
+      text-align: #{$global-left};
     }
+  }
 
-    // Table head and foot
-    thead,
-    tfoot {
-      background: $table-head-background;
-      color: $table-head-font-color;
-
-      // Rows within head and foot
-      tr {
-        background: transparent;
+  // Table rows
+  tbody {
+    tr {
+      // If stripe is set to even, darken the even rows.
+      @if $stripe == even {
+        &:nth-child(even) {
+          background-color: $table-striped-background;
+        }
       }
 
-      // Cells within head and foot
-      th,
-      td {
-        padding: $table-padding;
-        font-weight: $global-weight-bold;
-        text-align: #{$global-left};
+      // If stripe is set to odd, darken the odd rows.
+      @else if $stripe == odd {
+        &:nth-child(odd) {
+          background-color: $table-striped-background;
+        }
       }
     }
 
-    // Table rows
-    tbody {
-      tr {
-        // If stripe is set to even, darken the even rows.
-        @if $stripe == even {
-          &:nth-child(even) {
-            background-color: $table-striped-background;
-          }
-        }
+    th,
+    td {
+      padding: $table-padding;
+    }
+  }
+}
 
-        // If stripe is set to odd, darken the odd rows.
-        @else if $stripe == odd {
-          &:nth-child(odd) {
-            background-color: $table-striped-background;
-          }
-        }
-      }
+/// Adds the general styles for tables.
+/// @param {Keyword} $stripe [$table-stripe] - Uses keywords even, odd, or none to darken rows of the table. The default value is even.
+@mixin table(
+  $stripe: $table-stripe,
+  $nest: false
+) {
+  width: 100%;
+  margin-bottom: $global-margin;
+  border-radius: $global-radius;
 
-      th,
-      td {
-        padding: $table-padding;
-      }
+  @if $nest {
+    @include -zf-table-children-styles($stripe);
+  }
+  @else {
+    @at-root {
+      @include -zf-table-children-styles($stripe);
     }
   }
 }
@@ -192,9 +205,9 @@ $show-header-for-stacked: false !default;
   }
 }
 
-@mixin foundation-table {
+@mixin foundation-table($nest: false) {
   table {
-    @include table;
+    @include table($nest: $nest);
   }
 
   table.stack {

data/vendor/assets/scss/components/_title-bar.scss

@@ -65,4 +65,8 @@ $titlebar-icon-spacing: 0.25rem !default;
   .menu-icon {
     @include hamburger($color: $titlebar-icon-color, $color-hover: $titlebar-icon-color-hover);
   }
+
+  .menu-icon.dark {
+    @include hamburger;
+  }
 }

data/vendor/assets/scss/components/_tooltip.scss

@@ -6,6 +6,14 @@
 /// @group tooltip
 ////
 
+/// Default font weight of the defined term.
+/// @type Keyword | Number
+$has-tip-font-weight: $global-weight-bold !default;
+
+/// Default border bottom of the defined term.
+/// @type List
+$has-tip-border-bottom: dotted 1px $dark-gray !default;
+
 /// Default color of the tooltip background.
 /// @type Color
 $tooltip-background-color: $black !default;
@@ -39,8 +47,8 @@ $tooltip-pip-offset: 1.25rem !default;
 $tooltip-radius: $global-radius !default;
 
 @mixin has-tip {
-  border-bottom: dotted 1px $dark-gray;
-  font-weight: bold;
+  border-bottom: $has-tip-border-bottom;
+  font-weight: $has-tip-font-weight;
   position: relative;
   display: inline-block;
   cursor: help;

data/vendor/assets/scss/components/_top-bar.scss

@@ -14,9 +14,9 @@ $topbar-padding: 0.5rem !default;
 /// @type Color
 $topbar-background: $light-gray !default;
 
-/// Color for links inside a top bar menu.
-/// @type Color
-$topbar-link-color: $primary-color !default;
+/// Spacing for the top bar title.
+/// @type Number
+$topbar-title-spacing: 1rem !default;
 
 /// Width of `<input>` elements inside the top bar.
 /// @type Number
@@ -32,15 +32,12 @@ $topbar-input-width: 200px !default;
     background-color: $topbar-background;
   }
 
-  a {
-    color: $topbar-link-color;
-  }
-
   input {
     width: $topbar-input-width;
     margin-#{$global-right}: 1rem;
   }
 
+  // scss-lint:disable QualifyingElement
   input.button {
     width: auto;
   }
@@ -49,6 +46,10 @@ $topbar-input-width: 200px !default;
 /// makes sections stacked
 @mixin top-bar-stacked {
   // Sub-sections
+  .top-bar-title {
+    width: 100%;
+  }
+
   .top-bar-right {
     width: 100%;
   }
@@ -79,10 +80,14 @@ $topbar-input-width: 200px !default;
   }
 
   // Sub-sections
+  .top-bar-title {
+    float: left;
+    margin-right: $topbar-title-spacing;
+  }
   .top-bar-left {
     float: left;
   }
-  
+
   .top-bar-right {
     float: right;
   }