From edb41acb28c04512b5e938e7d629f59fc0f1a46d Mon Sep 17 00:00:00 2001 From: devclair Date: Tue, 12 Jun 2018 18:46:44 -0500 Subject: [PATCH 01/10] DP-8266: add clean new print styles file --- .../source/assets/scss/08-print/_print.scss | 691 +++++------------- 1 file changed, 193 insertions(+), 498 deletions(-) diff --git a/styleguide/source/assets/scss/08-print/_print.scss b/styleguide/source/assets/scss/08-print/_print.scss index 95a1c0f649..6a4837aef0 100644 --- a/styleguide/source/assets/scss/08-print/_print.scss +++ b/styleguide/source/assets/scss/08-print/_print.scss @@ -1,562 +1,257 @@ @media print { -html { - font-size: 13px; -} - -body { - color: $c-font-heading; - width: 7.65in; -} - -img, -.ma__google-map, -.ma__mapped-locations, -.ma__section-links { - page-break-inside: avoid; -} - -.ma__sections-3up, -.ma__sections-3up__container { - page-break-inside: auto; -} - -h1, -.ma__page-banner--large .ma__page-banner__title, -.ma__page-banner--small .ma__page-banner__title, -.ma__page-banner__title { - font-size: 3.75rem; -} - -.ma__header__nav, -.ma__header__search, -.ma__header__backto, -.ma__footer, -.ma__action-details__anchor-links, -.ma__header-tags, -.ma__emergency-alerts, -.ma__illustrated-header__image, -.ma__jump-links, -.ma__suggested-pages, -.ma__sidebar-widget__more, -.ma__action-activities__image, -.ma__action-activities__link, -.ma__action-header__divider, -.ma__action-finder__see-all-container, -.ma__page-banner__icon, -.ma__page-banner--small .ma__page-banner__icon, -.ma__location-banner__image, -.ma__banner-carousel, -.ma__quick-actions, -.ma__wait-time, -.fluid-width-video-wrapper, -#feedback, -.ma__floating-action { - display: none !important; -} - -* { - box-shadow: none !important; -} - -.ma__header, -.ma__header__container, -.ma__action-header__container { - background-color: transparent; - padding: 0; -} - -.ma__header__container:before { - display: none; -} - -.ma__header__logo { - width: auto; -} - -.page-content, -.ma__page-header, -.sidebar { - float: none !important; - margin-bottom: 30px !important; - padding: 0 !important; - width: 100% !important; -} - -.ma__action-details__content { - margin-left: 0; -} - -.ma__page-header__content { - padding-right: 0; - width: 100%; -} - -.main-content--two .page-content .ma__action-details__title { - background-color: transparent; - border-bottom: 2px solid $c-bd-divider; - color: $c-font-base; - margin: 0; - margin-bottom: 30px; - padding: 0; - padding-bottom: .5em; -} - -.ma__comp-heading { - padding: 0; -} - -h3 { - margin-bottom: .5em !important; -} - -h4 { - margin-bottom: .3em !important; -} - -.ma__rich-text { - margin-bottom: 30px; + * { + box-shadow: none !important; + -webkit-transition: none !important; + transition: none !important; + transform: none !important; } -.ma__rich-text h4, -.ma__rich-text h2, -.ma__rich-text h3 { - padding-bottom: 0; -} - -.ma__rich-text p { - margin-bottom: 1.25rem; -} - -.ma__rich-text__embed { - border: none; -} - -.ma__rich-text__table-wrapper { - overflow: visible; -} + html { + font-size: 13px; + } -.ma__callout-stats { - border: 3px solid $c-bd-divider; - padding: 20px; + body { + color: $c-font-heading !important; + } - &__stat { - color: $c-font-heading; + .ma__stacked-row-section .main-content .page-content>*, + .main-content--two .page-content>* { + margin-top: 0; } - &:before { - display: none; + .ma__page-header__content { + padding: 20px 0; } -} -.sidebar .ma__colored-heading { - background-color: transparent; - border-bottom: 2px solid $c-bd-divider; - color: $c-font-base; - font-size: 1.188rem; - line-height: 1.2em; - margin: 0; - margin-bottom: 20px !important; - padding: 0; - padding-bottom: .5em; - - &:after { - display: none; + .ma__header__search, + .ma__floating-action, + .ma__content-eyebrow__tags, + .ma__page-header__tags, + .ma__footer, + .ma__header-alerts, + #feedback, + .messages--error, + *[aria-hidden="true"], + .ma__download-link__icon, + .ma__sidebar-widget__more, + .ma__page-banner__icon, + .ma__callout-time__icon, + .ma__jump-links, + .ma__header__nav, + .ma__toc--overlay, + .ma__page-flipper, + .ma__callout-stats, + .ma__illustrated-header__image, + .ma__location-banner, + .ma__pagination, + .ma__location-listing__filters, + .ma__location-listing__map, + .ma__action-activities__image, + .ma__action-activities__link, + .ma__action-header__divider, + .ma__action-finder__see-all-container, + .ma__page-banner__icon, + .ma__page-banner--small .ma__page-banner__icon, + .ma__location-banner__image, + .ma__banner-carousel, + .ma__quick-actions, + .ma__wait-time { + display: none !important; } -} -.main-content--two, -.ma__sections-3up__container, -.ma__top-actions, -.ma__image-credit__container, -.ma__link-list__container, -.ma__sections-3up__title { - padding-left: 0; - padding-right: 0; -} + a::after { + content: " (" attr(href) ") "; + font-size: 0.8em; + font-weight: normal; + } -.ma__sidebar-widget__items { - margin-bottom: 50px; -} + .ma__page-banner { + margin-bottom: 0; + padding: 0; + min-height: 0; -.paragraph--type--related-link + .paragraph--type--related-link, .ma__related-action + .paragraph--type--related-link, .paragraph--type--related-link + -.ma__related-action, .ma__related-action + -.ma__related-action { - margin-top: 20px; - padding-top: 20px; -} + &.ma__page-banner--overlay { + height: auto; + } -.ma__contact-us + .ma__contact-us { - margin-top: 20px; - padding-top: 20px; - margin-bottom: 50px; -} + .ma__page-banner__container { + min-height: 0; + } -.ma__contact-us__extra { - display: block !important; - padding-top: 10px; -} + .ma__page-banner__content-wrapper, + .ma__page-banner__title, + .ma__page-banner__description { + width: 100%; + color: $c-font-heading; + padding: 0; + } -.ma__contact-us__expand { - display: none; -} + .ma__page-banner__image { + display: none; + height: 0; + position: unset; + } -.ma__contact-group + .ma__contact-group { - padding-top: 10px; -} + .ma__page-banner__content { + padding: 0; + margin: 0; + position: relative; + max-width: none; + width: 100%; + height: auto; + top: 0; + max-width: none; + color: $c-font-heading; + } + } -.ma__illustrated-header { - margin: 0; + .main-content { + margin-bottom: 0; + } - &__container { - overflow: visible; - padding: 0; + img, + .ma__google-map, + .ma__mapped-locations, + .ma__section-links, + .ma__contact-us--accordion, + .ma__contact-list { + page-break-inside: avoid; } - &__content { - min-height: 0; + .ma__colored-heading { padding: 0; - width: 100%; - - &:after { - display: none; - } + color: $c-font-heading; } -} -.ma__multi-row-section { + .ma__callout-link { + border-width: 0 !important; + break-inside: avoid; - &__container { - padding: 0; + a { + padding: 0; + } } - &__title { + .ma__press-status { padding: 0; } -} - -.ma__multi-row-section ~ .ma__multi-row-section .ma__multi-row-section__title { - border: none; - padding-top: 0; -} -.main-content { - margin-bottom: 20px !important; -} - -.ma__action-step { - margin-bottom: 25px; -} - -.ma__split-columns__container, .ma__key-actions__container { - padding: 0; -} - -.main-content--two .ma__split-columns__column:first-child:nth-last-child(2), .main-content--two .ma__split-columns__column:first-child:nth-last-child(2) ~ .ma__split-columns__column, -.ma__split-columns__column:first-child:nth-last-child(3), .ma__split-columns__column:first-child:nth-last-child(3) ~ .ma__split-columns__column { - margin-right: 0%; - width: 100%; -} - -.ma__callout { - border-color: $c-bd-divider; - padding-left: 20px; - - &__header svg { - fill: $c-bd-divider; + .ma__action-finder__header { + margin-bottom: 0; } - &__text { + .ma__action-finder__container { padding-bottom: 0; - padding-top: 20px; } -} -.ma__key-actions__items .ma__callout-link { - width: 48.78049%; -} - -.ma__sidebar-heading { - margin-bottom: 20px !important; -} + .ma__contact-us--accordion { + border-width: 0; -.ma__action-header { - padding: 0; -} - -.ma__action-header__content { - margin-bottom: 30px; - padding: 0 !important; - width: 100%; -} - -.ma__action-header__content .ma__page-header { - margin-bottom: 0 !important; -} + .ma__contact-us--accordion__status { + display: none; + } -.ma__breadcrumbs { - display: none; + .ma__contact-us__content { + display: block !important; + } - &__container { - padding: 0; - padding-bottom: 30px; + .ma__contact-group { + width: 100%; + max-width: 100%; + border-width: 0; + } } - &__items { + .ma__contact-group { padding: 0; + margin: 0; } - a { - font-size: 11px; + .ma__split-columns__column { + padding: 0; } -} -.ma__header-contact__directions .ma__content-link { - display: none; -} - -.ma__action-header__widgets { - padding-bottom: 20px; - padding-top: 0; -} - -.ma__location-icons__name { - font-size: 10px; -} - -.ma__location-banner__map { - width: 100%; -} + .ma__action-step { + border-width: 0; -.ma__action-activities__details { - margin-left: 0; - width: 100%; -} - -.ma__action-activities { - padding: 20px 0; -} - -.ma__action-gallery { - margin-bottom: 30px; + .ma__action-step__header { + padding: 20px 0 0; + color: $c-font-heading; + } - &__view-more { - display: none; + .ma__action-step__icon { + display: none; + } + + .ma__action-step__content { + display: inline !important; + border-width: 0; + page-break-inside: auto; + } } -} -.ma__action-event + .ma__action-event { - margin-top: 20px; - padding-top: 20px; -} - -.ma__header-alert { - background-color: transparent; - margin-bottom: 30px; + .ma__steps-ordered__item { + padding-left: 0; + list-style-type: decimal; - &__container { - border: 3px solid $c-bd-divider; - padding: 10px; - text-align: left; - } + .ma__action-step__header::after { + display: none; + } - &__hide { - display: none; + &::before { + display: none; + } } -} - -.ma__sidebar-promo__view-more { - text-align: left; -} - -.ma__stacked-row-section__container { - padding: 0; -} - -.ma__stacked-row-section ~ .ma__stacked-row-section .ma__stacked-row-section__title { - padding-top: 40px; -} - -.ma__page-banner { - background-image: none !important; - margin-bottom: .4em; -} - -.ma__page-banner, -.ma__page-banner--large { - height: auto; -} - -.ma__page-banner__container, -.ma__page-banner--small .ma__page-banner__content, -.ma__page-banner--large .ma__page-banner__content { - padding: 0; -} - -.ma__page-banner__content { - align-items: inherit; - background: transparent; - display: inherit; - margin: 0; - padding: 0; - position: relative; - top: auto; - transform: none; - width: 100%; -} - -.ma__page-banner--large .ma__page-banner__title, .ma__page-banner--small .ma__page-banner__title, -.ma__action-finder__title, -.ma__action-finder__category, -.ma__page-banner__title { - color: $c-font-heading; - font-weight: 700; -} - -.ma__page-banner__content:before { - display: none; -} - -.ma__page-banner__title { - transform: none; - width: 100%; -} - -.ma__header-contact__address { - margin-top: 30px; -} - -.ma__action-header__widgets .ma__image { - float: left; - margin-bottom: 30px; -} - -.ma__action-finder, -.ma__action-finder:after { - background: none !important; -} -.ma__action-finder__header { - padding-bottom: 30px; -} - -.ma__action-finder__container { - margin-bottom: 30px; - padding: 0; -} - -.ma__action-finder__items--all .ma__callout-link { - border-color: $c-bd-divider; -} - -.ma__action-finder__items--all .ma__illustrated-link { - border: 3px solid $c-bd-divider; -} - -.ma__illustrated-link__image { - background-image: none !important; -} - -.ma__callout-link { - padding: 10px 20px; -} - -.ma__illustrated-link__content { - padding: 10px 0 10px 20px; -} - -.ma__section-links__content, -.ma__section-links__toggle-content { - padding: 0; -} - -.ma__sections-3up__container > * { - margin-bottom: 40px; - margin-right: 0; - width: 100%; -} - -.ma__section-links { - background-color: transparent; -} - -.ma__action-finder__header { - padding-bottom: 0; -} - -.ma__action-finder__title, -.ma__section-links__title, -.ma__link-list__title { - padding-bottom: 0; -} - -.ma__comp-heading:after, -.ma__section-links__title:after, -.ma__action-finder__title:after, -.ma__top-actions__title:after, -.ma__link-list__title:after, -.ma__rich-text h2:after, -.ma__rich-text h3:after, -.ma__rich-text h4:after { - display: none; -} + .ma__suggested-pages { -.ma__sections-3up { - padding-top: 20px; - padding-bottom: 40px; -} - -.ma__link-list { - padding: 0; -} - -.ma__page-banner--large .ma__page-banner__title, .ma__page-banner--small .ma__page-banner__title, .ma__action-finder__title, .ma__action-finder__category { - margin-bottom: 30px; -} - -.ma__top-actions__title { - margin-bottom: 20px; - padding-bottom: 0; - text-align: left; -} - -.ma__top-actions { - padding-bottom: 30px; -} + .ma__suggested-pages__title { + text-align: left; + padding-top: 20px; + margin-bottom: 0; + } -.ma__comp-heading--centered { - text-align: left; -} + .ma__suggested-pages__items { + display: inline; + } -.ma__section-links__icon { - margin-top: 0; - text-align: left; -} + .ma__suggested-pages__item--figure { + width: 100%; + padding: 0; + border-width: 0; + margin: 0; + text-align: left; + + a, + .ma__image { + display: none; + } + + .ma__decorative-link a { + display: block !important; + } + } -.ma__category-icon svg, .ma__category-icon svg > g { - fill: #43956f; -} + .ma__suggested-pages__more { + display: none; + } + } -.ma__category-icon:before, -.ma__category-icon:after { - display: none; -} + .ma__toc--hierarchy { + page-break-inside: avoid; -.ma__category-icon { - background-color: transparent; - height: auto; - margin: 0; - padding: 0; - width: auto; -} + .ma__toc--hierarchy__title::after { + display: none; + } -.ma__link-list__items { - column-count: 1; -} + .ma__toc--hierarchy__container { + top: 0; + border: none !important; + } - // Opens accordions when printing. - .ma__action-step--accordion .ma__action-step__content, - .ma__contact-us--accordion .ma__contact-us__content { - display: block !important; + .ma__toc--hierarchy__accordion-content { + display: block; + } } } From 2367d9a289c27123b8ef027efdd7e9bd351313c0 Mon Sep 17 00:00:00 2001 From: devclair Date: Tue, 12 Jun 2018 18:47:49 -0500 Subject: [PATCH 02/10] DP-8266: add new js file for link paths --- styleguide/source/assets/js/index.js | 1 + styleguide/source/assets/js/modules/linkPaths.js | 10 ++++++++++ 2 files changed, 11 insertions(+) create mode 100644 styleguide/source/assets/js/modules/linkPaths.js diff --git a/styleguide/source/assets/js/index.js b/styleguide/source/assets/js/index.js index 5b1c1c967a..6e1dfb81d8 100644 --- a/styleguide/source/assets/js/index.js +++ b/styleguide/source/assets/js/index.js @@ -20,6 +20,7 @@ import keywordSearch from "./modules/keywordSearch.js"; import linkListToggle from "./modules/linkListToggle.js"; import locationFilters from "./modules/locationFilters.js"; import locationListing from "./modules/locationListing.js"; +import linkPaths from "./modules/linkPaths.js"; import mainNav from "./modules/mainNav.js"; import mobileNav from "./modules/mobileNav.js"; import orgSelector from "./modules/orgSelector.js"; diff --git a/styleguide/source/assets/js/modules/linkPaths.js b/styleguide/source/assets/js/modules/linkPaths.js new file mode 100644 index 0000000000..1491f4fb1c --- /dev/null +++ b/styleguide/source/assets/js/modules/linkPaths.js @@ -0,0 +1,10 @@ +// Force links to print full path on page print +export default function (window,document,$,undefined) { + window.onbeforeprint = function() { + + $('a:not([href^=https])').each(function(){ + let path = $(this).prop('href'); + $(this).prop('href', path); + }); + }; +}(window,document,jQuery); \ No newline at end of file From 98b6a248ec00d39c2facfc702fa90c2a223c6f54 Mon Sep 17 00:00:00 2001 From: devclair Date: Tue, 12 Jun 2018 18:48:53 -0500 Subject: [PATCH 03/10] DP-8266: move print styles up above other styles --- styleguide/source/assets/scss/base-theme.scss | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/styleguide/source/assets/scss/base-theme.scss b/styleguide/source/assets/scss/base-theme.scss index 516fa65240..7a7457b3c8 100644 --- a/styleguide/source/assets/scss/base-theme.scss +++ b/styleguide/source/assets/scss/base-theme.scss @@ -13,6 +13,9 @@ @import "06-theme/00-base/fonts"; @import "06-theme/00-base/pikaday"; +// Print styles +@import "08-print/print"; + // Atoms - reusable styles @import "06-theme/01-atoms/global/elements"; @import "06-theme/01-atoms/arrow-button"; @@ -166,6 +169,3 @@ @import "06-theme/04-templates/general"; @import "06-theme/04-templates/organization-details"; @import "06-theme/04-templates/stacked-row"; - -// Print styles -@import "08-print/print"; From ed763bf657f475858743f0cc7a9256f22ba7e8e8 Mon Sep 17 00:00:00 2001 From: devclair Date: Tue, 12 Jun 2018 18:54:27 -0500 Subject: [PATCH 04/10] DP-8266: Remove most of the print styles from pattern files --- .../assets/scss/02-molecules/_callout-stats.scss | 2 +- .../assets/scss/02-molecules/_header-contact.scss | 12 ++++-------- .../assets/scss/03-organisms/_action-details.scss | 3 --- .../assets/scss/03-organisms/_action-finder.scss | 2 +- .../source/assets/scss/03-organisms/_header.scss | 7 +------ .../assets/scss/03-organisms/_page-header.scss | 10 +++++----- .../assets/scss/03-organisms/_quick-actions.scss | 5 +---- .../scss/03-organisms/_stacked-row-section.scss | 8 ++------ .../assets/scss/03-organisms/_top-actions.scss | 4 ++-- .../assets/scss/04-templates/_stacked-row.scss | 8 ++------ .../scss/06-theme/03-organisms/_page-header.scss | 2 +- 11 files changed, 20 insertions(+), 43 deletions(-) diff --git a/styleguide/source/assets/scss/02-molecules/_callout-stats.scss b/styleguide/source/assets/scss/02-molecules/_callout-stats.scss index f8d491abff..15ded85047 100644 --- a/styleguide/source/assets/scss/02-molecules/_callout-stats.scss +++ b/styleguide/source/assets/scss/02-molecules/_callout-stats.scss @@ -3,7 +3,7 @@ padding: 30px 0 40px 30px; position: relative; - @media print, ($bp-small-min) { + @media ($bp-small-min) { padding: 40px 30px 50px; &--left, diff --git a/styleguide/source/assets/scss/02-molecules/_header-contact.scss b/styleguide/source/assets/scss/02-molecules/_header-contact.scss index ae301170af..fc10f2e0ed 100644 --- a/styleguide/source/assets/scss/02-molecules/_header-contact.scss +++ b/styleguide/source/assets/scss/02-molecules/_header-contact.scss @@ -5,7 +5,7 @@ content: "true"; display: none; - @media print, ($bp-small-min) { + @media ($bp-small-min) { content: "false"; } } @@ -55,14 +55,14 @@ } - @media print, ($bp-small-min) { + @media ($bp-small-min) { display: none; } } &__container { - @media print, ($bp-small-min) { + @media ($bp-small-min) { display: flex; align-items: stretch; } @@ -77,13 +77,9 @@ @media ($bp-small-max) { display: none; } - - @media print { - display: block; - } } - @media print, ($bp-small-min) { + @media ($bp-small-min) { width: 50%; & + & { diff --git a/styleguide/source/assets/scss/03-organisms/_action-details.scss b/styleguide/source/assets/scss/03-organisms/_action-details.scss index 5285fb4ca5..2aba2e9d60 100644 --- a/styleguide/source/assets/scss/03-organisms/_action-details.scss +++ b/styleguide/source/assets/scss/03-organisms/_action-details.scss @@ -54,9 +54,6 @@ margin-left: -$column-with-gutter * 2; width: $column-with-gutter * 2; } - @media print { - display: none; - } &[data-sticky='middle'] { position: fixed; diff --git a/styleguide/source/assets/scss/03-organisms/_action-finder.scss b/styleguide/source/assets/scss/03-organisms/_action-finder.scss index aa1e5b4027..d1a01bdcd5 100644 --- a/styleguide/source/assets/scss/03-organisms/_action-finder.scss +++ b/styleguide/source/assets/scss/03-organisms/_action-finder.scss @@ -130,7 +130,7 @@ $action-finder-bp: 900px; display: flex; } - @media print, ($bp-large-min) { + @media ($bp-large-min) { @include span-columns(4 of 12); @include omega(3n); display: flex; diff --git a/styleguide/source/assets/scss/03-organisms/_header.scss b/styleguide/source/assets/scss/03-organisms/_header.scss index 1f5c744361..e1d51ebd3d 100644 --- a/styleguide/source/assets/scss/03-organisms/_header.scss +++ b/styleguide/source/assets/scss/03-organisms/_header.scss @@ -25,7 +25,7 @@ body { padding-top: 43px; // height of the util nav position: relative; - @media print { + @media { padding-top: 0; } @@ -176,11 +176,6 @@ body { @media ($bp-header-toggle-min){ display: none; } - - @media print { - display: none; - } - } &__back-button { diff --git a/styleguide/source/assets/scss/03-organisms/_page-header.scss b/styleguide/source/assets/scss/03-organisms/_page-header.scss index ab70369849..26dc97d0d3 100644 --- a/styleguide/source/assets/scss/03-organisms/_page-header.scss +++ b/styleguide/source/assets/scss/03-organisms/_page-header.scss @@ -258,7 +258,7 @@ $page-header-widget-width: 350px; content: "true"; } - @media print, ($bp-small-min) { + @media ($bp-small-min) { &:before { content: "false"; } @@ -266,7 +266,7 @@ $page-header-widget-width: 350px; } & > .ma__contact-group:first-child { - @media print, ($bp-small-min) { + @media ($bp-small-min) { clear: both; padding-bottom: 20px; } @@ -274,7 +274,7 @@ $page-header-widget-width: 350px; // more than two contacts .ma__contact-group:nth-child(2):nth-last-child(3) { - @media print, ($bp-small-min) { + @media ($bp-small-min) { border-right-width: 1px; border-right-style: solid; float: left; @@ -286,7 +286,7 @@ $page-header-widget-width: 350px; } &__extra { - @media print, ($bp-small-min) { + @media ($bp-small-min) { border-left-width: 1px; border-left-style: solid; display: block; @@ -302,7 +302,7 @@ $page-header-widget-width: 350px; &__expand { clear: both; - @media print, ($bp-small-min) { + @media ($bp-small-min) { display: none; } } diff --git a/styleguide/source/assets/scss/03-organisms/_quick-actions.scss b/styleguide/source/assets/scss/03-organisms/_quick-actions.scss index d91ce44f5d..9654da190a 100644 --- a/styleguide/source/assets/scss/03-organisms/_quick-actions.scss +++ b/styleguide/source/assets/scss/03-organisms/_quick-actions.scss @@ -9,14 +9,11 @@ } } - @media print { - display: block; - } } .page-content & { margin-bottom: 40px; - @media print, ($bp-large-min) { + @media ($bp-large-min) { display: none; & + * { diff --git a/styleguide/source/assets/scss/03-organisms/_stacked-row-section.scss b/styleguide/source/assets/scss/03-organisms/_stacked-row-section.scss index 1cfaf9258c..ac6f4a780d 100644 --- a/styleguide/source/assets/scss/03-organisms/_stacked-row-section.scss +++ b/styleguide/source/assets/scss/03-organisms/_stacked-row-section.scss @@ -13,10 +13,6 @@ } } - @media print { - padding-bottom: 0; - } - &__container { @include ma-container(); } @@ -32,7 +28,7 @@ content: ""; padding-top: 45px; - @media print, ($bp-large-min) { + @media ($bp-large-min) { border-top-width: 1px; border-top-style: solid; padding-top: 90px; @@ -40,7 +36,7 @@ } & ~ &--borderless &__container:before { - @media print, ($bp-large-min) { + @media ($bp-large-min) { border-top-width: 0; } } diff --git a/styleguide/source/assets/scss/03-organisms/_top-actions.scss b/styleguide/source/assets/scss/03-organisms/_top-actions.scss index 4e4d62aede..30c1d1475e 100644 --- a/styleguide/source/assets/scss/03-organisms/_top-actions.scss +++ b/styleguide/source/assets/scss/03-organisms/_top-actions.scss @@ -16,7 +16,7 @@ &__items { @include clearfix; - @media print, ($bp-small-min) { + @media ($bp-small-min) { display: flex; align-items: stretch; flex-wrap: wrap; @@ -34,7 +34,7 @@ display: flex; } - @media print, ($bp-x-large-min) { + @media ($bp-x-large-min) { @include span-columns(3); @include omega(4n); display: flex; diff --git a/styleguide/source/assets/scss/04-templates/_stacked-row.scss b/styleguide/source/assets/scss/04-templates/_stacked-row.scss index 878d8fc8a1..1c39829273 100644 --- a/styleguide/source/assets/scss/04-templates/_stacked-row.scss +++ b/styleguide/source/assets/scss/04-templates/_stacked-row.scss @@ -15,10 +15,6 @@ border-top-width: 0; } } - - @media print { - padding-bottom: 0; - } } &__container { @@ -35,7 +31,7 @@ display: block; padding-top: 45px; - @media print, ($bp-large-min) { + @media ($bp-large-min) { border-top-width: 1px; border-top-style: solid; padding-top: 90px; @@ -43,7 +39,7 @@ } &__section ~ &__section--borderless &__container:before { - @media print, ($bp-large-min) { + @media ($bp-large-min) { border-top-width: 0; } } diff --git a/styleguide/source/assets/scss/06-theme/03-organisms/_page-header.scss b/styleguide/source/assets/scss/06-theme/03-organisms/_page-header.scss index 8e4dc1f535..83269650ee 100644 --- a/styleguide/source/assets/scss/06-theme/03-organisms/_page-header.scss +++ b/styleguide/source/assets/scss/06-theme/03-organisms/_page-header.scss @@ -16,7 +16,7 @@ } &__optional-content { - @media print, ($bp-small-min) { + @media ($bp-small-min) { .ma__contact-us > .ma__contact-group:nth-child(2):nth-last-child(3), .ma__contact-us > .ma__contact-us__extra { border-color: $c-bd-divider; From ab1a73f5cce853722b84cd82cddb2f8bda2a83e1 Mon Sep 17 00:00:00 2001 From: devclair Date: Tue, 12 Jun 2018 18:57:31 -0500 Subject: [PATCH 05/10] DP-8266: fix my typo --- styleguide/source/assets/scss/03-organisms/_header.scss | 4 ---- 1 file changed, 4 deletions(-) diff --git a/styleguide/source/assets/scss/03-organisms/_header.scss b/styleguide/source/assets/scss/03-organisms/_header.scss index e1d51ebd3d..e4ee2ec044 100644 --- a/styleguide/source/assets/scss/03-organisms/_header.scss +++ b/styleguide/source/assets/scss/03-organisms/_header.scss @@ -25,10 +25,6 @@ body { padding-top: 43px; // height of the util nav position: relative; - @media { - padding-top: 0; - } - &__skip-nav { display: block; margin: 0 auto; From 5fc267b83a0eeb64b251a4316985bc4c9d739368 Mon Sep 17 00:00:00 2001 From: devclair Date: Tue, 12 Jun 2018 19:00:43 -0500 Subject: [PATCH 06/10] DP-8266: add changelog --- changelogs/DP-8266.txt | 4 ++++ 1 file changed, 4 insertions(+) create mode 100644 changelogs/DP-8266.txt diff --git a/changelogs/DP-8266.txt b/changelogs/DP-8266.txt new file mode 100644 index 0000000000..a54c733518 --- /dev/null +++ b/changelogs/DP-8266.txt @@ -0,0 +1,4 @@ +___DESCRIPTION___ +Changed +Minor +- DP-8266: Sitewide print styles update From 17f998930ce3d1ed33ebd2ad634a0e4a5b19ca38 Mon Sep 17 00:00:00 2001 From: Melissa Rossi Date: Wed, 13 Jun 2018 12:03:48 -0400 Subject: [PATCH 07/10] Added release notes for 5.28.0 --- release-notes.md | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/release-notes.md b/release-notes.md index d491640b31..3519f6dcd7 100644 --- a/release-notes.md +++ b/release-notes.md @@ -14,6 +14,11 @@ The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/) - DP-1234: The short description text on a [service detail](http://mayflower.digital.mass.gov/?p=pages-detail-for-service-howto-location) page banner ([@organisms/by-template/page-banner](http://mayflower.digital.mass.gov/?p=organisms-page-banner)) should now render ([PR #493](https://github.com/massgov/mayflower/pull/493)) +## 5.28.0 (6/13/2018) + +### Added +- DP-8825: Adds teaser listing group organism to apply accordion behavior to multiple teaser listings at once. + ## 5.27.0 (6/06/2018) ### Added From f7f533b44cbe64da195c3f9d0f04bf0e031d228c Mon Sep 17 00:00:00 2001 From: Melissa Rossi Date: Wed, 13 Jun 2018 12:04:37 -0400 Subject: [PATCH 08/10] Removed changelogs txt files for 5.28.0 --- changelogs/DP-8825.txt | 3 --- 1 file changed, 3 deletions(-) delete mode 100644 changelogs/DP-8825.txt diff --git a/changelogs/DP-8825.txt b/changelogs/DP-8825.txt deleted file mode 100644 index e443f7cc1e..0000000000 --- a/changelogs/DP-8825.txt +++ /dev/null @@ -1,3 +0,0 @@ -Added -Minor -- DP-8825: Adds teaser listing group organism to apply accordion behavior to multiple teaser listings at once. From 6fe0f42ccb930fe822bebe0c7ae2fe5e7d13a64f Mon Sep 17 00:00:00 2001 From: Melissa Rossi Date: Wed, 13 Jun 2018 12:06:41 -0400 Subject: [PATCH 09/10] Updated the package.json version to 5.28.0 --- styleguide/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/styleguide/package.json b/styleguide/package.json index fe3d100cec..2b899c4954 100644 --- a/styleguide/package.json +++ b/styleguide/package.json @@ -1,7 +1,7 @@ { "name": "@massds/mayflower", "description": "Open source UI components and visual style guide for Massachusetts government websites", - "version": "5.27.0", + "version": "5.28.0", "author": "Massachusetts Digital Services (MDS)", "repository": { "type": "git", From 517e5e0dee0046041bcd61e34e8000a162f3e3d1 Mon Sep 17 00:00:00 2001 From: devclair Date: Mon, 18 Jun 2018 13:10:28 -0500 Subject: [PATCH 10/10] cleaning up space, replacing alerts --- .../source/assets/scss/08-print/_print.scss | 18 ++++++++++++++---- 1 file changed, 14 insertions(+), 4 deletions(-) diff --git a/styleguide/source/assets/scss/08-print/_print.scss b/styleguide/source/assets/scss/08-print/_print.scss index 6a4837aef0..d25de938d3 100644 --- a/styleguide/source/assets/scss/08-print/_print.scss +++ b/styleguide/source/assets/scss/08-print/_print.scss @@ -29,7 +29,6 @@ .ma__content-eyebrow__tags, .ma__page-header__tags, .ma__footer, - .ma__header-alerts, #feedback, .messages--error, *[aria-hidden="true"], @@ -114,8 +113,7 @@ .ma__google-map, .ma__mapped-locations, .ma__section-links, - .ma__contact-us--accordion, - .ma__contact-list { + .ma__contact-us--accordion { page-break-inside: avoid; } @@ -124,6 +122,15 @@ color: $c-font-heading; } + .ma__rich-text, + table { + margin-bottom: 2rem; + } + + .ma__footnote-list { + margin: 2rem 0; + } + .ma__callout-link { border-width: 0 !important; break-inside: avoid; @@ -168,6 +175,10 @@ margin: 0; } + .ma__contact-list { + margin-top: 2rem !important; + } + .ma__split-columns__column { padding: 0; } @@ -239,7 +250,6 @@ } .ma__toc--hierarchy { - page-break-inside: avoid; .ma__toc--hierarchy__title::after { display: none;