ama_layout 3.2.2 → 4.0.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: a490c837bd07b1cfd13faa216dcf606397a00b51
-  data.tar.gz: 1f092add0db363e0e61d5de622f9096165b8eddc
+  metadata.gz: 5aae080e7e58a7b87b9f3c453160a86457a7b586
+  data.tar.gz: 97813104e10861b8a16fe6fb7ef66aa03d55b16a
 SHA512:
-  metadata.gz: fe625df9f94ec68e341a1313ac34f7a1a0f3a70987db4d0531d186de6770b8dc26244c0b821b4213d6598d55c3c384aa5123c6855e5a2a91ff5a17b37410b87c
-  data.tar.gz: 98e161833c13071412168cdc1630c7cd535b0b796b1da30d83fdc152fd448c1ec10bdea0a50b1f9101074cc4248bf7646fa5ce781967d8816c0c858073ff79c4
+  metadata.gz: 06cd712b5195469e83ab6ab2e12e3cc718a217f215eda117a6c15eba44df1668251587365b247c878f490d80729d239e00ddc9e5f00282d7016f5324431a58de
+  data.tar.gz: edee8ceebac42c1cc05093dbd8685ec0cd32bd1f6181c7ed949d4c954b2e290580d2726b679e060bc4b5c9673d2f5d999ecb292b850c3428c75e50d7c24b466c

data/ama_layout.gemspec

@@ -18,12 +18,13 @@ Gem::Specification.new do |spec|
   spec.test_files    = spec.files.grep(%r{^(test|spec|features)/})
   spec.require_paths = ["lib"]
 
-  spec.add_dependency "foundation-rails", "~> 6.2.0"
+  spec.add_dependency "foundation-rails", "~> 6.2.3.0"
   spec.add_dependency "rails", "~> 4.2"
   spec.add_dependency "sass-rails", "~> 5.0"
   spec.add_dependency "font-awesome-sass", "4.5.0"
   spec.add_dependency "draper", "~> 2.1"
   spec.add_dependency "browser", "~> 2.0"
+  spec.add_dependency "breadcrumbs_on_rails", "~> 2.3.0"
   spec.add_development_dependency "bundler", "~> 1.11"
   spec.add_development_dependency "rake", "~> 11.0"
   spec.add_development_dependency "rspec-rails"

data/app/assets/images/ama-logo-blue.svg

@@ -0,0 +1,44 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 19.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 264 64" style="enable-background:new 0 0 264 64;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#00539B;}
+	.st1{fill:#FFFFFF;stroke:#FFFFFF;stroke-miterlimit:10;}
+	.st2{fill:#FFFFFF;stroke:#FFFFFF;stroke-width:0.3594;}
+	.st3{fill:#FFFFFF;}
+	.st4{fill:#DA291C;}
+	.st5{fill-rule:evenodd;clip-rule:evenodd;fill:#DA291C;}
+</style>
+<g>
+	<g>
+		<path class="st0" d="M121.8,4.1h25.1l12.7,39.7h0.2L173,4.1h24.1v59.7h-15.6l0.3-45.9h-0.2l-15.2,45.9h-14.6L137.2,18H137
+			l0.3,45.9h-15.6V4.1z M79.8,4.1h19.5l23,59.7h-17.5l-4.5-12.8H78l-4.7,12.8H57.1L79.8,4.1z M89.5,16.4h-0.2l-7.7,23.4h15
+			L89.5,16.4z M219.5,4.1H239l23,59.7h-17.5l-4.4-12.8h-22.4L213,63.9h-16.2L219.5,4.1z M229.2,16.4h-0.2l-7.7,23.4h15L229.2,16.4z"
+			/>
+	</g>
+</g>
+<path class="st1" d="M1,26.5C0.9,12.3,17.7,0.8,38.6,0.8c20.9,0,37.9,11.5,38,25.7C76.7,40.7,59.9,52.2,39,52.2
+	C18.1,52.2,1.1,40.7,1,26.5z"/>
+<path class="st2" d="M71.4,15.6c4,4.9,4.9,12.8,1.9,18.5c-7.1,12.2-20.4,16-33.7,16.6c-14,0.1-27.5-4-35.2-15.9
+	c-3-5.3-2.4-13.3,1.3-18.2C16.1,3.1,33.4,0.5,49.9,3.3C58,5.2,65.8,8.3,71.4,15.6L71.4,15.6z"/>
+<path class="st0" d="M71.4,15.6c4,4.9,4.9,12.8,1.9,18.5c-7.1,12.2-20.4,16-33.7,16.6c-14,0.1-27.5-4-35.2-15.9
+	c-3-5.3-2.4-13.3,1.3-18.2C16.1,3.1,33.4,0.5,49.9,3.3C58,5.2,65.8,8.3,71.4,15.6L71.4,15.6z"/>
+<path class="st3" d="M67.2,19.2c2,2.9,3,6.8,1.9,10.4c-3.6,10.1-14.6,13.9-24.2,15.2c-12.1,1.4-24.4-0.6-33-8.9
+	C8.6,32.4,7,27.2,8.8,22.5c5-10.6,16.5-13.6,27-14.8C48.1,7.4,59.5,9.7,67.2,19.2L67.2,19.2z"/>
+<path class="st4" d="M47.6,24.7l0.5,1.6c-1,3.2-1.9,6.3-2.8,9.6l5.8-0.1l2.4,5.4L46.9,43c-1.2-3-2.1-6.1-3.2-9.1l-11.1,0
+	c-1,2.9-1.9,5.8-2.7,8.7c-2.2-0.2-4.4-0.9-6.7-1.3c0.3-1.5,1-3.1,1.5-4.6c3.2-1.5,5.8-5,5.8-8.7l-2.8-0.1l6.3-18.7
+	C36.8,9,39.1,9,41.7,9L47.6,24.7L47.6,24.7z"/>
+<path class="st4" d="M65.5,35.1l-5.3,0c-0.3-1.3-0.7-2.6-1.1-3.9l-6.4-0.1c-0.4,1.3-0.6,2.6-0.9,3.9l-5.4,0.1l6.1-20.8l6.1,0
+	L65.5,35.1L65.5,35.1z"/>
+<path class="st4" d="M28.3,18.1c0.7,1,1.1,2.2,1.1,3.5l-5.2,0.1c-0.1-0.8-0.2-1.6-0.9-2.1c-0.8-0.7-2-0.7-3-0.5
+	c-3.2,1.7-2.9,5.4-2.6,8.7c0.3,1.7,0.9,3.7,2.8,4.2c1,0,2,0,2.7-0.6c0.7-0.8,1.1-1.7,1.3-2.7h5.2c-0.4,3.6-3.1,6.7-6.5,7.6
+	c-3.2,0.6-6.2-0.3-8.3-2.7c-3.2-3.7-3.6-9.3-1.5-13.6c1.3-2.8,4.3-5.1,7.4-5.4C23.8,14.5,26.4,15.6,28.3,18.1L28.3,18.1z"/>
+<path class="st3" d="M41.7,28.4h-7.5l3.6-12C39.1,20.4,40.6,24.3,41.7,28.4L41.7,28.4z"/>
+<path class="st3" d="M53.8,26.6c0.4-2.1,1-4.4,1.6-6.5l2,6.5H53.8L53.8,26.6z"/>
+<path class="st5" d="M66.2,31.4c0.7,0,1.2-0.5,1.2-1.2c0-0.7-0.6-1.2-1.2-1.2c-0.7,0-1.2,0.5-1.2,1.2C65,30.9,65.6,31.4,66.2,31.4
+	L66.2,31.4z M65.2,30.2c0-0.6,0.4-1,1-1c0.5,0,1,0.4,1,1c0,0.6-0.4,1-1,1C65.7,31.2,65.2,30.7,65.2,30.2L65.2,30.2z M66,30.3h0.2
+	l0.4,0.6h0.2l-0.4-0.6c0.2,0,0.4-0.1,0.4-0.4c0-0.3-0.2-0.4-0.5-0.4h-0.5v1.4H66V30.3L66,30.3z M66,30.1v-0.4h0.3
+	c0.1,0,0.3,0,0.3,0.2c0,0.2-0.2,0.2-0.3,0.2H66L66,30.1z"/>
+</svg>

data/app/assets/javascripts/ama_layout/desktop/foundation-custom.js

@@ -0,0 +1,21 @@
+//= require foundation.core.js
+//= require foundation.abide.js
+//= require foundation.accordion.js
+//= require foundation.drilldown.js
+//= require foundation.dropdown.js
+//= require foundation.dropdownMenu.js
+//= require foundation.equalizer.js
+//= require foundation.offcanvas.js
+//= require foundation.responsiveMenu.js
+//= require foundation.responsiveToggle.js
+//= require foundation.reveal.js
+//= require foundation.tabs.js
+//= require foundation.toggler.js
+//= require foundation.tooltip.js
+//= require foundation.util.box.js
+//= require foundation.util.keyboard.js
+//= require foundation.util.mediaQuery.js
+//= require foundation.util.motion.js
+//= require foundation.util.nest.js
+//= require foundation.util.timerAndImageLoader.js
+//= require foundation.util.triggers.js

data/app/assets/javascripts/ama_layout/desktop/foundation-equalizer-reflow.coffee

@@ -0,0 +1,5 @@
+# Add a data-equalizer-reflow attribute to any element to
+# trigger a reInit of the equalizer plugin on the click event.
+$(document).on 'click', '*[data-equalizer-reflow]', ->
+  if Foundation? and Foundation._plugins.equalizer?
+    Foundation.reInit('equalizer')

data/app/assets/javascripts/ama_layout/desktop/foundation-ready.coffee

@@ -1,2 +1,4 @@
 $ ->
+  # Foundation equalizer does not play well with Accordion animations!
+  Foundation.Accordion.defaults.slideSpeed = 0
   $(document).foundation()

data/app/assets/javascripts/ama_layout/desktop/index.js

@@ -1,12 +1,6 @@
 //= require ../ama_layout_namespace
-//= require ./drop_down
-//= require ./toggle_menu
-//= require ./header_menu
-//= require ./ready
-//= require foundation
+//= require ./foundation-custom
 //= require ./foundation-ready
-//= require ./sticky-footer
-//= require ./foundation-namespace
-//= require ./sidebar
+//= require ./foundation-equalizer-reflow
 //= require ./cookie.ready
 //= require ../mailcheck/index

data/app/assets/stylesheets/ama_layout/_settings.scss

@@ -45,7 +45,7 @@
 // 1. Global
 // ---------
 
-$global-font-size: 100%;
+$global-font-size: 14px;
 $global-width: rem-calc(1200);
 $global-lineheight: 1.5;
 $foundation-palette: (
@@ -60,12 +60,12 @@ $medium-gray: #cacaca;
 $dark-gray: #8a8a8a;
 $black: #0a0a0a;
 $white: #ffffff;
-$body-background: $white;
-$body-font-color: $black;
+$body-background: $stone;
+$body-font-color: $slate;
 $body-font-family: 'Open Sans', Helvetica, Roboto, Arial, sans-serif;
 $body-antialiased: true;
-$global-margin: 1rem;
-$global-padding: 1rem;
+$global-margin: $base-margin;
+$global-padding: $base-padding;
 $global-weight-normal: normal;
 $global-weight-bold: bold;
 $global-radius: 3px;
@@ -89,11 +89,11 @@ $breakpoint-classes: (small medium large);
 
 // 3. The Grid
 // -----------
-
-$grid-row-width: $global-width;
+//change $grid-row-width to $global-width to give it a fixed width
+$grid-row-width: 100%;
 $grid-column-count: 12;
 $grid-column-gutter: (
-  small: 20px,
+  small: 30px,
   medium: 30px,
 );
 $grid-column-align-edge: true;
@@ -103,12 +103,12 @@ $block-grid-max: 8;
 // ------------------
 
 $header-font-family: $body-font-family;
-$header-font-weight: $global-weight-normal;
+$header-font-weight: 700;
 $header-font-style: normal;
 $font-family-monospace: Consolas, 'Liberation Mono', Courier, monospace;
 $header-sizes: (
   small: (
-    'h1': 24,
+    'h1': 20,
     'h2': 20,
     'h3': 19,
     'h4': 18,
@@ -116,22 +116,22 @@ $header-sizes: (
     'h6': 16,
   ),
   medium: (
-    'h1': 48,
-    'h2': 40,
-    'h3': 27,
-    'h4': 23,
-    'h5': 18,
-    'h6': 16,
+    'h1': 20,
+    'h2': 20,
+    'h3': 18,
+    'h4': 16,
+    'h5': 14,
+    'h6': 12,
   ),
 );
 $header-color: inherit;
-$header-lineheight: 1.4;
-$header-margin-bottom: 0.5rem;
+$header-lineheight: 1.5;
+$header-margin-bottom: 0;
 $header-text-rendering: optimizeLegibility;
 $small-font-size: 80%;
 $header-small-font-color: $medium-gray;
-$paragraph-lineheight: 1.6;
-$paragraph-margin-bottom: 1rem;
+$paragraph-lineheight: 1.5;
+$paragraph-margin-bottom: $base-margin;
 $paragraph-text-rendering: optimizeLegibility;
 $code-color: $black;
 $code-font-family: $font-family-monospace;
@@ -139,18 +139,18 @@ $code-font-weight: $global-weight-normal;
 $code-background: $light-gray;
 $code-border: 1px solid $medium-gray;
 $code-padding: rem-calc(2 5 1);
-$anchor-color: $primary-color;
-$anchor-color-hover: scale-color($anchor-color, $lightness: -14%);
+$anchor-color: $cerulean;
+$anchor-color-hover: scale-color($anchor-color, $lightness: 24%);
 $anchor-text-decoration: none;
-$anchor-text-decoration-hover: none;
-$hr-width: $global-width;
-$hr-border: 1px solid $medium-gray;
-$hr-margin: rem-calc(20) auto;
+$anchor-text-decoration-hover: underline;
+$hr-width: $grid-row-width;
+$hr-border: 2px solid $stone;
+$hr-margin: $base-margin auto;
 $list-lineheight: $paragraph-lineheight;
 $list-margin-bottom: $paragraph-margin-bottom;
 $list-style-type: disc;
-$list-style-position: outside;
-$list-side-margin: 1.25rem;
+$list-style-position: inside;
+$list-side-margin: 0;
 $list-nested-side-margin: 1.25rem;
 $defnlist-margin-bottom: 1rem;
 $defnlist-term-weight: $global-weight-bold;
@@ -199,8 +199,8 @@ $accordion-item-color: foreground($accordion-background, $primary-color);
 $accordion-item-background-hover: $brand-blue-light;
 $accordion-item-padding: 1.25rem 1rem;
 $accordion-content-background: $white;
-$accordion-content-border: 1px solid $light-gray;
-$accordion-content-color: foreground($accordion-background, $primary-color);
+$accordion-content-border: 0;
+$accordion-content-color: $body-font-color;
 $accordion-content-padding: 1rem;
 
 // 8. Accordion Menu
@@ -221,13 +221,13 @@ $badge-font-size: 0.6rem;
 // 10. Breadcrumbs
 // ---------------
 
-$breadcrumbs-margin: 0 0 $global-margin 0;
-$breadcrumbs-item-font-size: rem-calc(11);
-$breadcrumbs-item-color: $primary-color;
-$breadcrumbs-item-color-current: $black;
-$breadcrumbs-item-color-disabled: $medium-gray;
+$breadcrumbs-margin: 0 0 $base-margin 0;
+$breadcrumbs-item-font-size: rem-calc(12);
+$breadcrumbs-item-color: $cerulean;
+$breadcrumbs-item-color-current: $stormcloud;
+$breadcrumbs-item-color-disabled: $stormcloud;
 $breadcrumbs-item-margin: 0.75rem;
-$breadcrumbs-item-uppercase: true;
+$breadcrumbs-item-uppercase: false;
 $breadcrumbs-item-slash: true;
 
 // 11. Button
@@ -236,15 +236,15 @@ $breadcrumbs-item-slash: true;
 $button-padding: 1em 1.75em;
 $button-margin: 0 0 $global-margin 0;
 $button-fill: solid;
-$button-background: $primary-color;
+$button-background: $cerulean;
 $button-background-hover: scale-color($button-background, $lightness: -15%);
 $button-color: $white;
 $button-color-alt: $black;
 $button-radius: $global-radius;
 $button-sizes: (
   tiny: 0.6rem,
-  small: 0.75rem,
-  default: 0.9rem,
+  small: 0.85rem,
+  default: 1rem,
   large: 1.25rem,
 );
 $button-opacity-disabled: 0.25;
@@ -261,10 +261,10 @@ $buttongroup-expand-max: 6;
 // -----------
 
 $callout-background: $white;
-$callout-background-fade: 85%;
-$callout-border: 1px solid rgba($black, 0.25);
+$callout-background-fade: 0%;
+$callout-border: 0;
 $callout-margin: 0 0 1rem 0;
-$callout-padding: 1rem;
+$callout-padding: $base-padding;
 $callout-font-color: $body-font-color;
 $callout-font-color-alt: $body-background;
 $callout-radius: 0;
@@ -309,7 +309,7 @@ $dropdown-sizes: (
 $dropdownmenu-arrows: true;
 $dropdownmenu-arrow-color: $anchor-color;
 $dropdownmenu-min-width: 200px;
-$dropdownmenu-background: $white;
+$dropdownmenu-background: none;
 $dropdownmenu-border: 1px solid $medium-gray;
 
 // 18. Flex Video
@@ -326,7 +326,7 @@ $fieldset-border: none;
 $fieldset-padding: none;
 $fieldset-margin: none;
 $legend-padding: rem-calc(0 3);
-$form-spacing: rem-calc(16);
+$form-spacing: 1.25rem;
 $helptext-color: $black;
 $helptext-font-size: rem-calc(13);
 $helptext-font-style: italic;
@@ -334,7 +334,7 @@ $input-prefix-color: $black;
 $input-prefix-background: $light-gray;
 $input-prefix-border: 1px solid $medium-gray;
 $input-prefix-padding: 1rem;
-$form-label-color: $black;
+$form-label-color: $slate;
 $form-label-font-size: rem-calc(14);
 $form-label-font-weight: $global-weight-normal;
 $form-label-line-height: 1.8;
@@ -342,16 +342,16 @@ $select-background: $white;
 $select-triangle-color: $dark-gray;
 $select-radius: 0;
 $input-color: $black;
-$input-placeholder-color: $brand-red !important;
+$input-placeholder-color: $smoke;
 $input-font-family: inherit;
-$input-font-size: rem-calc(16);
+$input-font-size: rem-calc(14);
 $input-background: $white;
 $input-background-focus: $white;
 $input-background-disabled: $light-gray;
-$input-border: 1px solid $medium-gray;
-$input-border-focus: 1px solid $dark-gray;
-$input-shadow: inset 0 1px 2px rgba($black, 0.1);
-$input-shadow-focus: 0 0 5px $medium-gray;
+$input-border: 2px solid #e5e5e5;
+$input-border-focus: 2px solid $ocean;
+$input-shadow: inset 0 0px 0px rgba($black, 0.1);
+$input-shadow-focus: 0 0 0px $medium-gray;
 $input-cursor-disabled: default;
 $input-transition: box-shadow 0.5s, border-color 0.25s ease-in-out;
 $input-number-spinners: true;
@@ -379,7 +379,7 @@ $mediaobject-image-width-stacked: 100%;
 $menu-margin: 0;
 $menu-margin-nested: 1rem;
 $menu-item-padding: 1.2rem 1rem;
-$menu-item-color-active: $white;
+$menu-item-color-active: $cerulean;
 $menu-item-background-active: map-get($foundation-palette, primary);
 $menu-icon-spacing: 0.25rem;
 
@@ -397,14 +397,14 @@ $meter-fill-bad: $alert-color;
 // --------------
 
 $offcanvas-size: 250px;
-$offcanvas-background: $light-gray;
+$offcanvas-background: $white;
 $offcanvas-zindex: -1;
 $offcanvas-transition-length: 0.5s;
 $offcanvas-transition-timing: ease;
 $offcanvas-fixed-reveal: true;
-$offcanvas-exit-background: rgba($white, 0.25);
+$offcanvas-exit-background: none;
 $maincontent-class: 'off-canvas-content';
-$maincontent-shadow: 0 0 10px rgba($black, 0.5);
+$maincontent-shadow: none;
 
 // 25. Orbit
 // ---------
@@ -510,14 +510,14 @@ $show-header-for-stacked: false;
 // --------
 
 $tab-margin: 0;
-$tab-background: $white;
-$tab-background-active: $light-gray;
+$tab-background: $stone;
+$tab-background-active: lighten($button-background, 10%);
 $tab-item-font-size: $base-font-size;
-$tab-item-background-hover: $white;
+$tab-item-background-hover: lighten($button-background, 10%);
 $tab-item-padding: 0;
 $tab-expand-max: 6;
 $tab-content-background: $white;
-$tab-content-border: $light-gray;
+$tab-content-border: none;
 $tab-content-color: foreground($tab-background, $primary-color);
 $tab-content-padding: 0;
 
@@ -534,13 +534,13 @@ $thumbnail-radius: $global-radius;
 // 34. Title Bar
 // -------------
 
-$titlebar-background: $brand-blue-dark;
-$titlebar-color: $white;
-$titlebar-padding: 0.5rem;
+$titlebar-background: $white;
+$titlebar-color: $cerulean;
+$titlebar-padding: 0;
 $titlebar-text-font-weight: bold;
-$titlebar-icon-color: $white;
+$titlebar-icon-color: $cerulean;
 $titlebar-icon-color-hover: $medium-gray;
-$titlebar-icon-spacing: 0.25rem;
+$titlebar-icon-spacing: 0;
 
 // 35. Tooltip
 // -----------
@@ -559,8 +559,8 @@ $tooltip-radius: $global-radius;
 // -----------
 
 $topbar-padding: 0;
-$topbar-background: $brand-blue-dark;
-$topbar-submenu-background: $topbar-background;
+$topbar-background: none;
+$topbar-submenu-background: none;
 $topbar-title-spacing: 1rem;
 $topbar-input-width: 200px;
 $topbar-unstack-breakpoint: medium;

data/app/assets/stylesheets/ama_layout/application.scss

@@ -7,5 +7,4 @@
 @import "foundation";
 @import "layout/index";
 @import "layout_components/index";
-@import "old-ie";
 @import "media_queries/index";

data/app/assets/stylesheets/ama_layout/foundation_and_overrides.scss

@@ -3,12 +3,6 @@
 @import 'settings';
 @import 'foundation';
 
-// If you'd like to include motion-ui the foundation-rails gem comes prepackaged with it, uncomment the 3 @imports, if you are not using the gem you need to install the motion-ui sass package.
-//
-// @import 'motion-ui/motion-ui';
-
-// We include everything by default.  To slim your CSS, remove components you don't use.
-
 @include foundation-global-styles;
 @include foundation-grid;
 @include foundation-typography;
@@ -17,35 +11,18 @@
 @include foundation-visibility-classes;
 @include foundation-float-classes;
 @include foundation-accordion;
-@include foundation-accordion-menu;
-@include foundation-badge;
 @include foundation-breadcrumbs;
-@include foundation-button-group;
 @include foundation-callout;
 @include foundation-close-button;
 @include foundation-drilldown-menu;
 @include foundation-dropdown;
 @include foundation-dropdown-menu;
-@include foundation-flex-video;
-@include foundation-label;
-@include foundation-media-object;
 @include foundation-menu;
 @include foundation-off-canvas;
-@include foundation-orbit;
-@include foundation-pagination;
-@include foundation-progress-bar;
-@include foundation-slider;
-@include foundation-sticky;
 @include foundation-reveal;
-@include foundation-switch;
 @include foundation-table;
 @include foundation-tabs;
-@include foundation-thumbnail;
+@include foundation-reveal;
 @include foundation-title-bar;
 @include foundation-tooltip;
 @include foundation-top-bar;
-
-// If you'd like to include motion-ui the foundation-rails gem comes prepackaged with it, uncomment the 3 @imports, if you are not using the gem you need to install the motion-ui sass package.
-//
-// @include motion-ui-transitions;
-// @include motion-ui-animations;