@cfpb/cfpb-design-system 3.6.3 → 3.7.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (36) hide show
  1. package/CHANGELOG.md +35 -8
  2. package/dist/components/cfpb-buttons/index.css +1 -1
  3. package/dist/components/cfpb-buttons/index.css.map +2 -2
  4. package/dist/components/cfpb-buttons/index.js +1 -1
  5. package/dist/components/cfpb-buttons/index.js.map +1 -1
  6. package/dist/components/cfpb-expandables/index.css +1 -1
  7. package/dist/components/cfpb-expandables/index.css.map +2 -2
  8. package/dist/components/cfpb-expandables/index.js +1 -1
  9. package/dist/components/cfpb-expandables/index.js.map +1 -1
  10. package/dist/components/cfpb-forms/index.css +1 -1
  11. package/dist/components/cfpb-forms/index.css.map +2 -2
  12. package/dist/components/cfpb-forms/index.js +1 -1
  13. package/dist/components/cfpb-forms/index.js.map +1 -1
  14. package/dist/components/cfpb-notifications/index.css +1 -1
  15. package/dist/components/cfpb-notifications/index.css.map +2 -2
  16. package/dist/components/cfpb-notifications/index.js.map +1 -1
  17. package/dist/components/cfpb-tooltips/index.css +1 -1
  18. package/dist/components/cfpb-tooltips/index.css.map +2 -2
  19. package/dist/components/cfpb-tooltips/index.js.map +1 -1
  20. package/dist/components/cfpb-typography/index.css +1 -1
  21. package/dist/components/cfpb-typography/index.css.map +2 -2
  22. package/dist/components/cfpb-typography/index.js.map +1 -1
  23. package/dist/index.css +1 -1
  24. package/dist/index.css.map +2 -2
  25. package/dist/index.js +1 -1
  26. package/dist/index.js.map +1 -1
  27. package/dist/utilities/index.css +1 -1
  28. package/dist/utilities/index.css.map +2 -2
  29. package/dist/utilities/index.js +1 -1
  30. package/dist/utilities/index.js.map +1 -1
  31. package/package.json +1 -1
  32. package/src/components/cfpb-buttons/button-group.scss +1 -1
  33. package/src/components/cfpb-buttons/button-link.scss +2 -7
  34. package/src/components/cfpb-buttons/button.scss +9 -1
  35. package/src/components/cfpb-buttons/vars.scss +10 -5
  36. package/src/components/cfpb-notifications/notification.scss +4 -0
package/dist/components/cfpb-notifications/index.css CHANGED
@@ -1,2 +1,2 @@
1
- .o-banner{padding:.9375em 0;background:var(--gold-10);border-bottom:1px solid var(--gray-40);font-size:.875em}.o-banner .m-notification{border:none;padding:0}.o-banner .m-notification__icon{left:0;top:0}.o-banner--dark{background:var(--teal-dark);border-color:var(--teal-dark);color:var(--white)}.o-banner--dark .m-notification{background:var(--teal-dark)}.o-banner--dark .m-notification .cf-icon-svg{fill:var(--white)}.o-banner--dark .m-notification a{color:var(--white);border-color:var(--white)}.o-banner--dark .m-notification a:visited,.o-banner--dark .m-notification a.visited{border-color:var(--teal-40);color:var(--teal-40)}.o-banner--dark .m-notification a:hover,.o-banner--dark .m-notification a.hover{border-color:var(--gray-15);color:var(--gray-15)}.o-banner--dark .m-notification a:focus,.o-banner--dark .m-notification a.focus{border-color:var(--white);color:var(--white)}.o-banner--dark .m-notification a:active,.o-banner--dark .m-notification a.active{border-color:var(--gray-15);color:var(--gray-15)}@media only all and (min-width: 37.5625em){.o-banner{font-size:1em}}.no-js .u-js-only,.u-hide-if-js{display:none!important}.no-js .u-hide-if-js{display:block!important}.u-clearfix:after{content:"";display:table;clear:both}.u-visually-hidden{position:absolute;width:1px;height:1px;border:0;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0)}@media only all and (max-width: 37.5em){.u-hide-on-mobile{display:none}}.u-show-on-mobile{display:none}@media only all and (max-width: 37.5em){.u-show-on-mobile{display:block}}.u-hidden{display:none!important}.u-invisible{visibility:hidden}.u-right{float:right}.u-nowrap{white-space:nowrap}.u-flexible-container{position:relative;padding-bottom:56.25%;height:0}.u-flexible-container__inner{position:absolute;top:0;left:0;width:100%;height:100%}.u-flexible-container--4-3{position:relative;padding-bottom:75%;height:0}.u-mt0{margin-top:0!important}.u-mb0{margin-bottom:0!important}.u-mt5{margin-top:5px!important}.u-mb5{margin-bottom:5px!important}.u-mt10{margin-top:10px!important}.u-mb10{margin-bottom:10px!important}.u-mt15{margin-top:15px!important}.u-mb15{margin-bottom:15px!important}.u-mt20{margin-top:20px!important}.u-mb20{margin-bottom:20px!important}.u-mt30{margin-top:30px!important}.u-mb30{margin-bottom:30px!important}.u-mt45{margin-top:45px!important}.u-mb45{margin-bottom:45px!important}.u-mt60{margin-top:60px!important}.u-mb60{margin-bottom:60px!important}.u-w100pct{width:100%}.u-w90pct{width:90%}.u-w80pct{width:80%}.u-w70pct{width:70%}.u-w60pct{width:60%}.u-w50pct{width:50%}.u-w40pct{width:40%}.u-w30pct{width:30%}.u-w20pct{width:20%}.u-w10pct{width:10%}.u-w75pct{width:75%}.u-w65pct{width:65%}.u-w25pct{width:25%}.u-w15pct{width:15%}.u-w66pct{width:66.6666666667%}.u-w33pct{width:33.3333333333%}small,.u-small-text{font-size:.875em}small--subtle,.u-small-text--subtle{color:var(--gray)}.u-no-animation{transition-duration:0s!important}.u-move-transition{transition:transform .25s ease-out}.u-move-to-origin{transform:translateZ(0)}.u-move-left{transform:translate3d(-100%,0,0)}.u-move-left-2x{transform:translate3d(-200%,0,0)}.u-move-left-3x{transform:translate3d(-300%,0,0)}.u-move-right{transform:translate3d(100%,0,0)}.u-move-up{transform:translate3d(0,-100%,0)}.u-alpha-transition{transition:opacity .25s linear}.u-alpha-100{opacity:1}.u-alpha-0{opacity:0}.u-max-height-transition{overflow:hidden;contain:paint;transition:max-height .2s ease-out}.u-max-height-zero{max-height:0!important}.u-max-height-summary{max-height:88px!important}.m-notification{display:none;position:relative;padding:15px;background:var(--gray-5);border:1px solid var(--gray-40)}.m-notification>.cf-icon-svg{position:absolute;fill:var(--gray)}.m-notification--success{background:var(--green-10);border-color:var(--green)}.m-notification--success>.cf-icon-svg{fill:var(--green)}.m-notification--warning{background:var(--gold-10);border-color:var(--gold)}.m-notification--warning>.cf-icon-svg{fill:var(--gold)}.m-notification--error{background:var(--red-10);border-color:var(--red)}.m-notification--error>.cf-icon-svg{fill:var(--red)}.m-notification--success a,.m-notification--warning a,.m-notification--error a{color:var(--pacific-mid-dark);border-color:var(--pacific-mid-dark)}.m-notification--success a:visited,.m-notification--success a.visited,.m-notification--warning a:visited,.m-notification--warning a.visited,.m-notification--error a:visited,.m-notification--error a.visited{border-color:var(--teal);color:var(--teal)}.m-notification--success a:hover,.m-notification--success a.hover,.m-notification--warning a:hover,.m-notification--warning a.hover,.m-notification--error a:hover,.m-notification--error a.hover{border-color:var(--pacific-dark);color:var(--pacific-dark)}.m-notification--success a:focus,.m-notification--success a.focus,.m-notification--warning a:focus,.m-notification--warning a.focus,.m-notification--error a:focus,.m-notification--error a.focus{border-color:var(--pacific-mid-dark);color:var(--pacific-mid-dark)}.m-notification--success a:active,.m-notification--success a.active,.m-notification--warning a:active,.m-notification--warning a.active,.m-notification--error a:active,.m-notification--error a.active{border-color:var(--navy-dark);color:var(--navy-dark)}.m-notification--visible{display:block}.cf-icon-svg+.m-notification__content{padding-left:1.5625rem}.m-notification__message{font-size:1rem;line-height:1.25;font-weight:500}@media only all and (min-width: 37.5625em){.m-notification__message{font-size:1.125rem}}.m-notification__explanation{margin-top:.3125rem;margin-bottom:.9375rem}.m-notification__message+.m-list{margin-top:.9375rem}@media only all and (min-width: 37.5625em){.m-notification .cf-icon-svg{font-size:1.125rem}.m-notification__explanation{margin-bottom:0}.m-notification .m-list{margin-top:.3125rem}.m-notification .m-list__item{margin-bottom:.3125rem}}html[lang=ar] .m-notification .cf-icon-svg+.m-notification__content{padding-left:initial;padding-right:1.5625rem}html[lang=ar] .m-notification .m-list{padding-right:0}
1
+ .o-banner{padding:.9375em 0;background:var(--gold-10);border-bottom:1px solid var(--gray-40);font-size:.875em}.o-banner .m-notification{border:none;padding:0}.o-banner .m-notification__icon{left:0;top:0}.o-banner--dark{background:var(--teal-dark);border-color:var(--teal-dark);color:var(--white)}.o-banner--dark .m-notification{background:var(--teal-dark)}.o-banner--dark .m-notification .cf-icon-svg{fill:var(--white)}.o-banner--dark .m-notification a{color:var(--white);border-color:var(--white)}.o-banner--dark .m-notification a:visited,.o-banner--dark .m-notification a.visited{border-color:var(--teal-40);color:var(--teal-40)}.o-banner--dark .m-notification a:hover,.o-banner--dark .m-notification a.hover{border-color:var(--gray-15);color:var(--gray-15)}.o-banner--dark .m-notification a:focus,.o-banner--dark .m-notification a.focus{border-color:var(--white);color:var(--white)}.o-banner--dark .m-notification a:active,.o-banner--dark .m-notification a.active{border-color:var(--gray-15);color:var(--gray-15)}@media only all and (min-width: 37.5625em){.o-banner{font-size:1em}}.no-js .u-js-only,.u-hide-if-js{display:none!important}.no-js .u-hide-if-js{display:block!important}.u-clearfix:after{content:"";display:table;clear:both}.u-visually-hidden{position:absolute;width:1px;height:1px;border:0;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0)}@media only all and (max-width: 37.5em){.u-hide-on-mobile{display:none}}.u-show-on-mobile{display:none}@media only all and (max-width: 37.5em){.u-show-on-mobile{display:block}}.u-hidden{display:none!important}.u-invisible{visibility:hidden}.u-right{float:right}.u-nowrap{white-space:nowrap}.u-flexible-container{position:relative;padding-bottom:56.25%;height:0}.u-flexible-container__inner{position:absolute;top:0;left:0;width:100%;height:100%}.u-flexible-container--4-3{position:relative;padding-bottom:75%;height:0}.u-mt0{margin-top:0!important}.u-mb0{margin-bottom:0!important}.u-mt5{margin-top:5px!important}.u-mb5{margin-bottom:5px!important}.u-mt10{margin-top:10px!important}.u-mb10{margin-bottom:10px!important}.u-mt15{margin-top:15px!important}.u-mb15{margin-bottom:15px!important}.u-mt20{margin-top:20px!important}.u-mb20{margin-bottom:20px!important}.u-mt30{margin-top:30px!important}.u-mb30{margin-bottom:30px!important}.u-mt45{margin-top:45px!important}.u-mb45{margin-bottom:45px!important}.u-mt60{margin-top:60px!important}.u-mb60{margin-bottom:60px!important}.u-w100pct{width:100%}.u-w90pct{width:90%}.u-w80pct{width:80%}.u-w70pct{width:70%}.u-w60pct{width:60%}.u-w50pct{width:50%}.u-w40pct{width:40%}.u-w30pct{width:30%}.u-w20pct{width:20%}.u-w10pct{width:10%}.u-w75pct{width:75%}.u-w65pct{width:65%}.u-w25pct{width:25%}.u-w15pct{width:15%}.u-w66pct{width:66.6666666667%}.u-w33pct{width:33.3333333333%}small,.u-small-text{font-size:.875em}small--subtle,.u-small-text--subtle{color:var(--gray)}.u-no-animation{transition-duration:0s!important}.u-move-transition{transition:transform .25s ease-out}.u-move-to-origin{transform:translateZ(0)}.u-move-left{transform:translate3d(-100%,0,0)}.u-move-left-2x{transform:translate3d(-200%,0,0)}.u-move-left-3x{transform:translate3d(-300%,0,0)}.u-move-right{transform:translate3d(100%,0,0)}.u-move-up{transform:translate3d(0,-100%,0)}.u-alpha-transition{transition:opacity .25s linear}.u-alpha-100{opacity:1}.u-alpha-0{opacity:0}.u-max-height-transition{overflow:hidden;contain:paint;transition:max-height .2s ease-out}.u-max-height-zero{max-height:0!important}.u-max-height-summary{max-height:88px!important}.m-notification{display:none;position:relative;padding:15px;background:var(--gray-5);border:1px solid var(--gray-40)}.m-notification>.cf-icon-svg{position:absolute;fill:var(--gray)}.m-notification--success{background:var(--green-10);border-color:var(--green)}.m-notification--success>.cf-icon-svg{fill:var(--green)}.m-notification--warning{background:var(--gold-10);border-color:var(--gold)}.m-notification--warning>.cf-icon-svg{fill:var(--gold)}.m-notification--error{background:var(--red-10);border-color:var(--red)}.m-notification--error>.cf-icon-svg{fill:var(--red)}.m-notification--success a,.m-notification--warning a,.m-notification--error a{color:var(--pacific-mid-dark);border-color:var(--pacific-mid-dark)}.m-notification--success a:visited,.m-notification--success a.visited,.m-notification--warning a:visited,.m-notification--warning a.visited,.m-notification--error a:visited,.m-notification--error a.visited{border-color:var(--teal);color:var(--teal)}.m-notification--success a:hover,.m-notification--success a.hover,.m-notification--warning a:hover,.m-notification--warning a.hover,.m-notification--error a:hover,.m-notification--error a.hover{border-color:var(--pacific-dark);color:var(--pacific-dark)}.m-notification--success a:focus,.m-notification--success a.focus,.m-notification--warning a:focus,.m-notification--warning a.focus,.m-notification--error a:focus,.m-notification--error a.focus{border-color:var(--pacific-mid-dark);color:var(--pacific-mid-dark)}.m-notification--success a:active,.m-notification--success a.active,.m-notification--warning a:active,.m-notification--warning a.active,.m-notification--error a:active,.m-notification--error a.active{border-color:var(--navy-dark);color:var(--navy-dark)}.m-notification--visible{display:block}.m-notification__content{max-width:41.875rem}.cf-icon-svg+.m-notification__content{padding-left:1.5625rem}.m-notification__message{font-size:1rem;line-height:1.25;font-weight:500}@media only all and (min-width: 37.5625em){.m-notification__message{font-size:1.125rem}}.m-notification__explanation{margin-top:.3125rem;margin-bottom:.9375rem}.m-notification__message+.m-list{margin-top:.9375rem}@media only all and (min-width: 37.5625em){.m-notification .cf-icon-svg{font-size:1.125rem}.m-notification__explanation{margin-bottom:0}.m-notification .m-list{margin-top:.3125rem}.m-notification .m-list__item{margin-bottom:.3125rem}}html[lang=ar] .m-notification .cf-icon-svg+.m-notification__content{padding-left:initial;padding-right:1.5625rem}html[lang=ar] .m-notification .m-list{padding-right:0}
2
2
  /*# sourceMappingURL=index.css.map */
package/dist/components/cfpb-notifications/index.css.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../packages/cfpb-design-system/src/components/cfpb-notifications/banner.scss", "../../../../../packages/cfpb-design-system/src/components/cfpb-notifications/notification.scss"],
4
- "sourcesContent": ["/* ==========================================================================\n Design System\n Notifications Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Utilities\n ========================================================================== */\n.no-js .u-js-only {\n display: none !important;\n}\n\n.u-hide-if-js {\n display: none !important;\n}\n.no-js .u-hide-if-js {\n display: block !important;\n}\n\n.u-clearfix::after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n.u-visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n border: 0;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n}\n\n@media only all and (max-width: 37.5em) {\n .u-hide-on-mobile {\n display: none;\n }\n}\n\n.u-show-on-mobile {\n display: none;\n}\n@media only all and (max-width: 37.5em) {\n .u-show-on-mobile {\n display: block;\n }\n}\n\n.u-hidden {\n display: none !important;\n}\n\n.u-invisible {\n visibility: hidden;\n}\n\n.u-right {\n float: right;\n}\n\n.u-nowrap {\n white-space: nowrap;\n}\n\n/* stylelint-disable selector-class-pattern */\n.u-flexible-container {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 56.25%;\n height: 0;\n}\n.u-flexible-container__inner {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n.u-flexible-container--4-3 {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 75%;\n height: 0;\n}\n\n/*\nLink text and underline, unless otherwise specified.\n$c: Link color.\n$v: Link visited color.\n$h: Link hover color.\n$f: Link focus color.\n$a: Link active color.\n\n// Separate out a different underline color.\n$bc: Link underline color.\n$bv: Link underline visited color.\n$bh: Link underline hover color.\n$bf: Link underline focus color.\n$ba: Link underline active color.\n*/\n/* stylelint-disable selector-class-pattern */\n/* stylelint-enable */\n.u-mt0 {\n margin-top: 0 !important;\n}\n\n.u-mb0 {\n margin-bottom: 0 !important;\n}\n\n.u-mt5 {\n margin-top: 5px !important;\n}\n\n.u-mb5 {\n margin-bottom: 5px !important;\n}\n\n.u-mt10 {\n margin-top: 10px !important;\n}\n\n.u-mb10 {\n margin-bottom: 10px !important;\n}\n\n.u-mt15 {\n margin-top: 15px !important;\n}\n\n.u-mb15 {\n margin-bottom: 15px !important;\n}\n\n.u-mt20 {\n margin-top: 20px !important;\n}\n\n.u-mb20 {\n margin-bottom: 20px !important;\n}\n\n.u-mt30 {\n margin-top: 30px !important;\n}\n\n.u-mb30 {\n margin-bottom: 30px !important;\n}\n\n.u-mt45 {\n margin-top: 45px !important;\n}\n\n.u-mb45 {\n margin-bottom: 45px !important;\n}\n\n.u-mt60 {\n margin-top: 60px !important;\n}\n\n.u-mb60 {\n margin-bottom: 60px !important;\n}\n\n.u-w100pct {\n width: 100%;\n}\n\n.u-w90pct {\n width: 90%;\n}\n\n.u-w80pct {\n width: 80%;\n}\n\n.u-w70pct {\n width: 70%;\n}\n\n.u-w60pct {\n width: 60%;\n}\n\n.u-w50pct {\n width: 50%;\n}\n\n.u-w40pct {\n width: 40%;\n}\n\n.u-w30pct {\n width: 30%;\n}\n\n.u-w20pct {\n width: 20%;\n}\n\n.u-w10pct {\n width: 10%;\n}\n\n.u-w75pct {\n width: 75%;\n}\n\n.u-w65pct {\n width: 65%;\n}\n\n.u-w25pct {\n width: 25%;\n}\n\n.u-w15pct {\n width: 15%;\n}\n\n.u-w66pct {\n width: 66.6666666667%;\n}\n\n.u-w33pct {\n width: 33.3333333333%;\n}\n\n/* stylelint-disable selector-class-pattern */\nsmall,\n.u-small-text {\n /* stylelint-enable */\n font-size: 0.875em;\n}\nsmall--subtle,\n.u-small-text--subtle {\n color: var(--gray);\n}\n\n/* ==========================================================================\n Utility classes for transitions.\n\n Adds transitions utilty classes for transform, opacity,\n and for the removing the transition duration.\n ========================================================================== */\n.u-no-animation {\n transition-duration: 0s !important;\n}\n\n.u-move-transition {\n transition: transform 0.25s ease-out;\n}\n\n.u-move-to-origin {\n transform: translate3d(0, 0, 0);\n}\n\n.u-move-left {\n transform: translate3d(-100%, 0, 0);\n}\n\n.u-move-left-2x {\n transform: translate3d(-200%, 0, 0);\n}\n\n.u-move-left-3x {\n transform: translate3d(-300%, 0, 0);\n}\n\n.u-move-right {\n transform: translate3d(100%, 0, 0);\n}\n\n.u-move-up {\n transform: translate3d(0, -100%, 0);\n}\n\n.u-alpha-transition {\n transition: opacity 0.25s linear;\n}\n\n.u-alpha-100 {\n opacity: 1;\n}\n\n.u-alpha-0 {\n opacity: 0;\n}\n\n.u-max-height-transition {\n overflow: hidden;\n contain: paint;\n transition: max-height 0.2s ease-out;\n}\n\n/*\n.u-max-height-default {\n This class is kept for documentation completeness.\n The actual max-height is set in the JavaScript,\n so that we know what the actual height of the content is for easing purposes.\n}\n*/\n.u-max-height-zero {\n max-height: 0 !important;\n}\n\n.u-max-height-summary {\n /* The value set here should show 4 lines of text at our standard 16px\n base font size. The calculation comes from the following:\n 88px = 16 * 5.5em.\n 5.5em = base-line-height (22px) * 4 / base-font-size (16px)\n */\n max-height: 88px !important;\n}\n\n.o-banner {\n padding: 0.9375em 0;\n background: var(--gold-10);\n border-bottom: 1px solid var(--gray-40);\n font-size: 0.875em;\n}\n.o-banner .m-notification {\n border: none;\n padding: 0;\n}\n.o-banner .m-notification__icon {\n left: 0;\n top: 0;\n}\n.o-banner--dark {\n background: var(--teal-dark);\n border-color: var(--teal-dark);\n color: var(--white);\n}\n.o-banner--dark .m-notification {\n background: var(--teal-dark);\n}\n.o-banner--dark .m-notification .cf-icon-svg {\n fill: var(--white);\n}\n.o-banner--dark .m-notification a {\n color: var(--white);\n border-color: var(--white);\n}\n.o-banner--dark .m-notification a:visited, .o-banner--dark .m-notification a.visited {\n border-color: var(--teal-40);\n color: var(--teal-40);\n}\n.o-banner--dark .m-notification a:hover, .o-banner--dark .m-notification a.hover {\n border-color: var(--gray-15);\n color: var(--gray-15);\n}\n.o-banner--dark .m-notification a:focus, .o-banner--dark .m-notification a.focus {\n border-color: var(--white);\n color: var(--white);\n}\n.o-banner--dark .m-notification a:active, .o-banner--dark .m-notification a.active {\n border-color: var(--gray-15);\n color: var(--gray-15);\n}\n@media only all and (min-width: 37.5625em) {\n .o-banner {\n font-size: 1em;\n }\n}", "/* ==========================================================================\n Design System\n Notifications Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Utilities\n ========================================================================== */\n.no-js .u-js-only {\n display: none !important;\n}\n\n.u-hide-if-js {\n display: none !important;\n}\n.no-js .u-hide-if-js {\n display: block !important;\n}\n\n.u-clearfix::after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n.u-visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n border: 0;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n}\n\n@media only all and (max-width: 37.5em) {\n .u-hide-on-mobile {\n display: none;\n }\n}\n\n.u-show-on-mobile {\n display: none;\n}\n@media only all and (max-width: 37.5em) {\n .u-show-on-mobile {\n display: block;\n }\n}\n\n.u-hidden {\n display: none !important;\n}\n\n.u-invisible {\n visibility: hidden;\n}\n\n.u-right {\n float: right;\n}\n\n.u-nowrap {\n white-space: nowrap;\n}\n\n/* stylelint-disable selector-class-pattern */\n.u-flexible-container {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 56.25%;\n height: 0;\n}\n.u-flexible-container__inner {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n.u-flexible-container--4-3 {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 75%;\n height: 0;\n}\n\n/*\nLink text and underline, unless otherwise specified.\n$c: Link color.\n$v: Link visited color.\n$h: Link hover color.\n$f: Link focus color.\n$a: Link active color.\n\n// Separate out a different underline color.\n$bc: Link underline color.\n$bv: Link underline visited color.\n$bh: Link underline hover color.\n$bf: Link underline focus color.\n$ba: Link underline active color.\n*/\n/* stylelint-disable selector-class-pattern */\n/* stylelint-enable */\n.u-mt0 {\n margin-top: 0 !important;\n}\n\n.u-mb0 {\n margin-bottom: 0 !important;\n}\n\n.u-mt5 {\n margin-top: 5px !important;\n}\n\n.u-mb5 {\n margin-bottom: 5px !important;\n}\n\n.u-mt10 {\n margin-top: 10px !important;\n}\n\n.u-mb10 {\n margin-bottom: 10px !important;\n}\n\n.u-mt15 {\n margin-top: 15px !important;\n}\n\n.u-mb15 {\n margin-bottom: 15px !important;\n}\n\n.u-mt20 {\n margin-top: 20px !important;\n}\n\n.u-mb20 {\n margin-bottom: 20px !important;\n}\n\n.u-mt30 {\n margin-top: 30px !important;\n}\n\n.u-mb30 {\n margin-bottom: 30px !important;\n}\n\n.u-mt45 {\n margin-top: 45px !important;\n}\n\n.u-mb45 {\n margin-bottom: 45px !important;\n}\n\n.u-mt60 {\n margin-top: 60px !important;\n}\n\n.u-mb60 {\n margin-bottom: 60px !important;\n}\n\n.u-w100pct {\n width: 100%;\n}\n\n.u-w90pct {\n width: 90%;\n}\n\n.u-w80pct {\n width: 80%;\n}\n\n.u-w70pct {\n width: 70%;\n}\n\n.u-w60pct {\n width: 60%;\n}\n\n.u-w50pct {\n width: 50%;\n}\n\n.u-w40pct {\n width: 40%;\n}\n\n.u-w30pct {\n width: 30%;\n}\n\n.u-w20pct {\n width: 20%;\n}\n\n.u-w10pct {\n width: 10%;\n}\n\n.u-w75pct {\n width: 75%;\n}\n\n.u-w65pct {\n width: 65%;\n}\n\n.u-w25pct {\n width: 25%;\n}\n\n.u-w15pct {\n width: 15%;\n}\n\n.u-w66pct {\n width: 66.6666666667%;\n}\n\n.u-w33pct {\n width: 33.3333333333%;\n}\n\n/* stylelint-disable selector-class-pattern */\nsmall,\n.u-small-text {\n /* stylelint-enable */\n font-size: 0.875em;\n}\nsmall--subtle,\n.u-small-text--subtle {\n color: var(--gray);\n}\n\n/* ==========================================================================\n Utility classes for transitions.\n\n Adds transitions utilty classes for transform, opacity,\n and for the removing the transition duration.\n ========================================================================== */\n.u-no-animation {\n transition-duration: 0s !important;\n}\n\n.u-move-transition {\n transition: transform 0.25s ease-out;\n}\n\n.u-move-to-origin {\n transform: translate3d(0, 0, 0);\n}\n\n.u-move-left {\n transform: translate3d(-100%, 0, 0);\n}\n\n.u-move-left-2x {\n transform: translate3d(-200%, 0, 0);\n}\n\n.u-move-left-3x {\n transform: translate3d(-300%, 0, 0);\n}\n\n.u-move-right {\n transform: translate3d(100%, 0, 0);\n}\n\n.u-move-up {\n transform: translate3d(0, -100%, 0);\n}\n\n.u-alpha-transition {\n transition: opacity 0.25s linear;\n}\n\n.u-alpha-100 {\n opacity: 1;\n}\n\n.u-alpha-0 {\n opacity: 0;\n}\n\n.u-max-height-transition {\n overflow: hidden;\n contain: paint;\n transition: max-height 0.2s ease-out;\n}\n\n/*\n.u-max-height-default {\n This class is kept for documentation completeness.\n The actual max-height is set in the JavaScript,\n so that we know what the actual height of the content is for easing purposes.\n}\n*/\n.u-max-height-zero {\n max-height: 0 !important;\n}\n\n.u-max-height-summary {\n /* The value set here should show 4 lines of text at our standard 16px\n base font size. The calculation comes from the following:\n 88px = 16 * 5.5em.\n 5.5em = base-line-height (22px) * 4 / base-font-size (16px)\n */\n max-height: 88px !important;\n}\n\n.m-notification {\n display: none;\n position: relative;\n padding: 15px;\n background: var(--gray-5);\n border: 1px solid var(--gray-40);\n}\n.m-notification > .cf-icon-svg {\n position: absolute;\n fill: var(--gray);\n}\n.m-notification--success {\n background: var(--green-10);\n border-color: var(--green);\n}\n.m-notification--success > .cf-icon-svg {\n fill: var(--green);\n}\n.m-notification--warning {\n background: var(--gold-10);\n border-color: var(--gold);\n}\n.m-notification--warning > .cf-icon-svg {\n fill: var(--gold);\n}\n.m-notification--error {\n background: var(--red-10);\n border-color: var(--red);\n}\n.m-notification--error > .cf-icon-svg {\n fill: var(--red);\n}\n.m-notification--success a, .m-notification--warning a, .m-notification--error a {\n color: var(--pacific-mid-dark);\n border-color: var(--pacific-mid-dark);\n}\n.m-notification--success a:visited, .m-notification--success a.visited, .m-notification--warning a:visited, .m-notification--warning a.visited, .m-notification--error a:visited, .m-notification--error a.visited {\n border-color: var(--teal);\n color: var(--teal);\n}\n.m-notification--success a:hover, .m-notification--success a.hover, .m-notification--warning a:hover, .m-notification--warning a.hover, .m-notification--error a:hover, .m-notification--error a.hover {\n border-color: var(--pacific-dark);\n color: var(--pacific-dark);\n}\n.m-notification--success a:focus, .m-notification--success a.focus, .m-notification--warning a:focus, .m-notification--warning a.focus, .m-notification--error a:focus, .m-notification--error a.focus {\n border-color: var(--pacific-mid-dark);\n color: var(--pacific-mid-dark);\n}\n.m-notification--success a:active, .m-notification--success a.active, .m-notification--warning a:active, .m-notification--warning a.active, .m-notification--error a:active, .m-notification--error a.active {\n border-color: var(--navy-dark);\n color: var(--navy-dark);\n}\n.m-notification--visible {\n display: block;\n}\n.cf-icon-svg + .m-notification__content {\n padding-left: 1.5625rem;\n}\n.m-notification__message {\n font-size: 1rem;\n line-height: 1.25;\n font-weight: 500;\n}\n@media only all and (min-width: 37.5625em) {\n .m-notification__message {\n font-size: 1.125rem;\n }\n}\n.m-notification__explanation {\n margin-top: 0.3125rem;\n margin-bottom: 0.9375rem;\n}\n.m-notification__message + .m-list {\n margin-top: 0.9375rem;\n}\n@media only all and (min-width: 37.5625em) {\n .m-notification .cf-icon-svg {\n font-size: 1.125rem;\n }\n .m-notification__explanation {\n margin-bottom: 0;\n }\n .m-notification .m-list {\n margin-top: 0.3125rem;\n }\n .m-notification .m-list__item {\n margin-bottom: 0.3125rem;\n }\n}\n\nhtml[lang=ar] .m-notification .cf-icon-svg + .m-notification__content {\n padding-left: initial;\n padding-right: 1.5625rem;\n}\nhtml[lang=ar] .m-notification .m-list {\n padding-right: 0;\n}"],
5
- "mappings": "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",
4
+ "sourcesContent": ["/* ==========================================================================\n Design System\n Notifications Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Utilities\n ========================================================================== */\n.no-js .u-js-only {\n display: none !important;\n}\n\n.u-hide-if-js {\n display: none !important;\n}\n.no-js .u-hide-if-js {\n display: block !important;\n}\n\n.u-clearfix::after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n.u-visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n border: 0;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n}\n\n@media only all and (max-width: 37.5em) {\n .u-hide-on-mobile {\n display: none;\n }\n}\n\n.u-show-on-mobile {\n display: none;\n}\n@media only all and (max-width: 37.5em) {\n .u-show-on-mobile {\n display: block;\n }\n}\n\n.u-hidden {\n display: none !important;\n}\n\n.u-invisible {\n visibility: hidden;\n}\n\n.u-right {\n float: right;\n}\n\n.u-nowrap {\n white-space: nowrap;\n}\n\n/* stylelint-disable selector-class-pattern */\n.u-flexible-container {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 56.25%;\n height: 0;\n}\n.u-flexible-container__inner {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n.u-flexible-container--4-3 {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 75%;\n height: 0;\n}\n\n/*\nLink text and underline, unless otherwise specified.\n$c: Link color.\n$v: Link visited color.\n$h: Link hover color.\n$f: Link focus color.\n$a: Link active color.\n\n// Separate out a different underline color.\n$bc: Link underline color.\n$bv: Link underline visited color.\n$bh: Link underline hover color.\n$bf: Link underline focus color.\n$ba: Link underline active color.\n*/\n/* stylelint-disable selector-class-pattern */\n/* stylelint-enable */\n.u-mt0 {\n margin-top: 0 !important;\n}\n\n.u-mb0 {\n margin-bottom: 0 !important;\n}\n\n.u-mt5 {\n margin-top: 5px !important;\n}\n\n.u-mb5 {\n margin-bottom: 5px !important;\n}\n\n.u-mt10 {\n margin-top: 10px !important;\n}\n\n.u-mb10 {\n margin-bottom: 10px !important;\n}\n\n.u-mt15 {\n margin-top: 15px !important;\n}\n\n.u-mb15 {\n margin-bottom: 15px !important;\n}\n\n.u-mt20 {\n margin-top: 20px !important;\n}\n\n.u-mb20 {\n margin-bottom: 20px !important;\n}\n\n.u-mt30 {\n margin-top: 30px !important;\n}\n\n.u-mb30 {\n margin-bottom: 30px !important;\n}\n\n.u-mt45 {\n margin-top: 45px !important;\n}\n\n.u-mb45 {\n margin-bottom: 45px !important;\n}\n\n.u-mt60 {\n margin-top: 60px !important;\n}\n\n.u-mb60 {\n margin-bottom: 60px !important;\n}\n\n.u-w100pct {\n width: 100%;\n}\n\n.u-w90pct {\n width: 90%;\n}\n\n.u-w80pct {\n width: 80%;\n}\n\n.u-w70pct {\n width: 70%;\n}\n\n.u-w60pct {\n width: 60%;\n}\n\n.u-w50pct {\n width: 50%;\n}\n\n.u-w40pct {\n width: 40%;\n}\n\n.u-w30pct {\n width: 30%;\n}\n\n.u-w20pct {\n width: 20%;\n}\n\n.u-w10pct {\n width: 10%;\n}\n\n.u-w75pct {\n width: 75%;\n}\n\n.u-w65pct {\n width: 65%;\n}\n\n.u-w25pct {\n width: 25%;\n}\n\n.u-w15pct {\n width: 15%;\n}\n\n.u-w66pct {\n width: 66.6666666667%;\n}\n\n.u-w33pct {\n width: 33.3333333333%;\n}\n\n/* stylelint-disable selector-class-pattern */\nsmall,\n.u-small-text {\n /* stylelint-enable */\n font-size: 0.875em;\n}\nsmall--subtle,\n.u-small-text--subtle {\n color: var(--gray);\n}\n\n/* ==========================================================================\n Utility classes for transitions.\n\n Adds transitions utilty classes for transform, opacity,\n and for the removing the transition duration.\n ========================================================================== */\n.u-no-animation {\n transition-duration: 0s !important;\n}\n\n.u-move-transition {\n transition: transform 0.25s ease-out;\n}\n\n.u-move-to-origin {\n transform: translate3d(0, 0, 0);\n}\n\n.u-move-left {\n transform: translate3d(-100%, 0, 0);\n}\n\n.u-move-left-2x {\n transform: translate3d(-200%, 0, 0);\n}\n\n.u-move-left-3x {\n transform: translate3d(-300%, 0, 0);\n}\n\n.u-move-right {\n transform: translate3d(100%, 0, 0);\n}\n\n.u-move-up {\n transform: translate3d(0, -100%, 0);\n}\n\n.u-alpha-transition {\n transition: opacity 0.25s linear;\n}\n\n.u-alpha-100 {\n opacity: 1;\n}\n\n.u-alpha-0 {\n opacity: 0;\n}\n\n.u-max-height-transition {\n overflow: hidden;\n contain: paint;\n transition: max-height 0.2s ease-out;\n}\n\n/*\n.u-max-height-default {\n This class is kept for documentation completeness.\n The actual max-height is set in the JavaScript,\n so that we know what the actual height of the content is for easing purposes.\n}\n*/\n.u-max-height-zero {\n max-height: 0 !important;\n}\n\n.u-max-height-summary {\n /* The value set here should show 4 lines of text at our standard 16px\n base font size. The calculation comes from the following:\n 88px = 16 * 5.5em.\n 5.5em = base-line-height (22px) * 4 / base-font-size (16px)\n */\n max-height: 88px !important;\n}\n\n.o-banner {\n padding: 0.9375em 0;\n background: var(--gold-10);\n border-bottom: 1px solid var(--gray-40);\n font-size: 0.875em;\n}\n.o-banner .m-notification {\n border: none;\n padding: 0;\n}\n.o-banner .m-notification__icon {\n left: 0;\n top: 0;\n}\n.o-banner--dark {\n background: var(--teal-dark);\n border-color: var(--teal-dark);\n color: var(--white);\n}\n.o-banner--dark .m-notification {\n background: var(--teal-dark);\n}\n.o-banner--dark .m-notification .cf-icon-svg {\n fill: var(--white);\n}\n.o-banner--dark .m-notification a {\n color: var(--white);\n border-color: var(--white);\n}\n.o-banner--dark .m-notification a:visited, .o-banner--dark .m-notification a.visited {\n border-color: var(--teal-40);\n color: var(--teal-40);\n}\n.o-banner--dark .m-notification a:hover, .o-banner--dark .m-notification a.hover {\n border-color: var(--gray-15);\n color: var(--gray-15);\n}\n.o-banner--dark .m-notification a:focus, .o-banner--dark .m-notification a.focus {\n border-color: var(--white);\n color: var(--white);\n}\n.o-banner--dark .m-notification a:active, .o-banner--dark .m-notification a.active {\n border-color: var(--gray-15);\n color: var(--gray-15);\n}\n@media only all and (min-width: 37.5625em) {\n .o-banner {\n font-size: 1em;\n }\n}", "/* ==========================================================================\n Design System\n Notifications Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Utilities\n ========================================================================== */\n.no-js .u-js-only {\n display: none !important;\n}\n\n.u-hide-if-js {\n display: none !important;\n}\n.no-js .u-hide-if-js {\n display: block !important;\n}\n\n.u-clearfix::after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n.u-visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n border: 0;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n}\n\n@media only all and (max-width: 37.5em) {\n .u-hide-on-mobile {\n display: none;\n }\n}\n\n.u-show-on-mobile {\n display: none;\n}\n@media only all and (max-width: 37.5em) {\n .u-show-on-mobile {\n display: block;\n }\n}\n\n.u-hidden {\n display: none !important;\n}\n\n.u-invisible {\n visibility: hidden;\n}\n\n.u-right {\n float: right;\n}\n\n.u-nowrap {\n white-space: nowrap;\n}\n\n/* stylelint-disable selector-class-pattern */\n.u-flexible-container {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 56.25%;\n height: 0;\n}\n.u-flexible-container__inner {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n.u-flexible-container--4-3 {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 75%;\n height: 0;\n}\n\n/*\nLink text and underline, unless otherwise specified.\n$c: Link color.\n$v: Link visited color.\n$h: Link hover color.\n$f: Link focus color.\n$a: Link active color.\n\n// Separate out a different underline color.\n$bc: Link underline color.\n$bv: Link underline visited color.\n$bh: Link underline hover color.\n$bf: Link underline focus color.\n$ba: Link underline active color.\n*/\n/* stylelint-disable selector-class-pattern */\n/* stylelint-enable */\n.u-mt0 {\n margin-top: 0 !important;\n}\n\n.u-mb0 {\n margin-bottom: 0 !important;\n}\n\n.u-mt5 {\n margin-top: 5px !important;\n}\n\n.u-mb5 {\n margin-bottom: 5px !important;\n}\n\n.u-mt10 {\n margin-top: 10px !important;\n}\n\n.u-mb10 {\n margin-bottom: 10px !important;\n}\n\n.u-mt15 {\n margin-top: 15px !important;\n}\n\n.u-mb15 {\n margin-bottom: 15px !important;\n}\n\n.u-mt20 {\n margin-top: 20px !important;\n}\n\n.u-mb20 {\n margin-bottom: 20px !important;\n}\n\n.u-mt30 {\n margin-top: 30px !important;\n}\n\n.u-mb30 {\n margin-bottom: 30px !important;\n}\n\n.u-mt45 {\n margin-top: 45px !important;\n}\n\n.u-mb45 {\n margin-bottom: 45px !important;\n}\n\n.u-mt60 {\n margin-top: 60px !important;\n}\n\n.u-mb60 {\n margin-bottom: 60px !important;\n}\n\n.u-w100pct {\n width: 100%;\n}\n\n.u-w90pct {\n width: 90%;\n}\n\n.u-w80pct {\n width: 80%;\n}\n\n.u-w70pct {\n width: 70%;\n}\n\n.u-w60pct {\n width: 60%;\n}\n\n.u-w50pct {\n width: 50%;\n}\n\n.u-w40pct {\n width: 40%;\n}\n\n.u-w30pct {\n width: 30%;\n}\n\n.u-w20pct {\n width: 20%;\n}\n\n.u-w10pct {\n width: 10%;\n}\n\n.u-w75pct {\n width: 75%;\n}\n\n.u-w65pct {\n width: 65%;\n}\n\n.u-w25pct {\n width: 25%;\n}\n\n.u-w15pct {\n width: 15%;\n}\n\n.u-w66pct {\n width: 66.6666666667%;\n}\n\n.u-w33pct {\n width: 33.3333333333%;\n}\n\n/* stylelint-disable selector-class-pattern */\nsmall,\n.u-small-text {\n /* stylelint-enable */\n font-size: 0.875em;\n}\nsmall--subtle,\n.u-small-text--subtle {\n color: var(--gray);\n}\n\n/* ==========================================================================\n Utility classes for transitions.\n\n Adds transitions utilty classes for transform, opacity,\n and for the removing the transition duration.\n ========================================================================== */\n.u-no-animation {\n transition-duration: 0s !important;\n}\n\n.u-move-transition {\n transition: transform 0.25s ease-out;\n}\n\n.u-move-to-origin {\n transform: translate3d(0, 0, 0);\n}\n\n.u-move-left {\n transform: translate3d(-100%, 0, 0);\n}\n\n.u-move-left-2x {\n transform: translate3d(-200%, 0, 0);\n}\n\n.u-move-left-3x {\n transform: translate3d(-300%, 0, 0);\n}\n\n.u-move-right {\n transform: translate3d(100%, 0, 0);\n}\n\n.u-move-up {\n transform: translate3d(0, -100%, 0);\n}\n\n.u-alpha-transition {\n transition: opacity 0.25s linear;\n}\n\n.u-alpha-100 {\n opacity: 1;\n}\n\n.u-alpha-0 {\n opacity: 0;\n}\n\n.u-max-height-transition {\n overflow: hidden;\n contain: paint;\n transition: max-height 0.2s ease-out;\n}\n\n/*\n.u-max-height-default {\n This class is kept for documentation completeness.\n The actual max-height is set in the JavaScript,\n so that we know what the actual height of the content is for easing purposes.\n}\n*/\n.u-max-height-zero {\n max-height: 0 !important;\n}\n\n.u-max-height-summary {\n /* The value set here should show 4 lines of text at our standard 16px\n base font size. The calculation comes from the following:\n 88px = 16 * 5.5em.\n 5.5em = base-line-height (22px) * 4 / base-font-size (16px)\n */\n max-height: 88px !important;\n}\n\n.m-notification {\n display: none;\n position: relative;\n padding: 15px;\n background: var(--gray-5);\n border: 1px solid var(--gray-40);\n}\n.m-notification > .cf-icon-svg {\n position: absolute;\n fill: var(--gray);\n}\n.m-notification--success {\n background: var(--green-10);\n border-color: var(--green);\n}\n.m-notification--success > .cf-icon-svg {\n fill: var(--green);\n}\n.m-notification--warning {\n background: var(--gold-10);\n border-color: var(--gold);\n}\n.m-notification--warning > .cf-icon-svg {\n fill: var(--gold);\n}\n.m-notification--error {\n background: var(--red-10);\n border-color: var(--red);\n}\n.m-notification--error > .cf-icon-svg {\n fill: var(--red);\n}\n.m-notification--success a, .m-notification--warning a, .m-notification--error a {\n color: var(--pacific-mid-dark);\n border-color: var(--pacific-mid-dark);\n}\n.m-notification--success a:visited, .m-notification--success a.visited, .m-notification--warning a:visited, .m-notification--warning a.visited, .m-notification--error a:visited, .m-notification--error a.visited {\n border-color: var(--teal);\n color: var(--teal);\n}\n.m-notification--success a:hover, .m-notification--success a.hover, .m-notification--warning a:hover, .m-notification--warning a.hover, .m-notification--error a:hover, .m-notification--error a.hover {\n border-color: var(--pacific-dark);\n color: var(--pacific-dark);\n}\n.m-notification--success a:focus, .m-notification--success a.focus, .m-notification--warning a:focus, .m-notification--warning a.focus, .m-notification--error a:focus, .m-notification--error a.focus {\n border-color: var(--pacific-mid-dark);\n color: var(--pacific-mid-dark);\n}\n.m-notification--success a:active, .m-notification--success a.active, .m-notification--warning a:active, .m-notification--warning a.active, .m-notification--error a:active, .m-notification--error a.active {\n border-color: var(--navy-dark);\n color: var(--navy-dark);\n}\n.m-notification--visible {\n display: block;\n}\n.m-notification__content {\n max-width: 41.875rem;\n}\n.cf-icon-svg + .m-notification__content {\n padding-left: 1.5625rem;\n}\n.m-notification__message {\n font-size: 1rem;\n line-height: 1.25;\n font-weight: 500;\n}\n@media only all and (min-width: 37.5625em) {\n .m-notification__message {\n font-size: 1.125rem;\n }\n}\n.m-notification__explanation {\n margin-top: 0.3125rem;\n margin-bottom: 0.9375rem;\n}\n.m-notification__message + .m-list {\n margin-top: 0.9375rem;\n}\n@media only all and (min-width: 37.5625em) {\n .m-notification .cf-icon-svg {\n font-size: 1.125rem;\n }\n .m-notification__explanation {\n margin-bottom: 0;\n }\n .m-notification .m-list {\n margin-top: 0.3125rem;\n }\n .m-notification .m-list__item {\n margin-bottom: 0.3125rem;\n }\n}\n\nhtml[lang=ar] .m-notification .cf-icon-svg + .m-notification__content {\n padding-left: initial;\n padding-right: 1.5625rem;\n}\nhtml[lang=ar] .m-notification .m-list {\n padding-right: 0;\n}"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
package/dist/components/cfpb-notifications/index.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../packages/cfpb-design-system/src/components/cfpb-notifications/banner.scss", "../../../../../packages/cfpb-design-system/src/components/cfpb-notifications/notification.scss"],
4
- "sourcesContent": ["/* ==========================================================================\n Design System\n Notifications Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Utilities\n ========================================================================== */\n.no-js .u-js-only {\n display: none !important;\n}\n\n.u-hide-if-js {\n display: none !important;\n}\n.no-js .u-hide-if-js {\n display: block !important;\n}\n\n.u-clearfix::after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n.u-visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n border: 0;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n}\n\n@media only all and (max-width: 37.5em) {\n .u-hide-on-mobile {\n display: none;\n }\n}\n\n.u-show-on-mobile {\n display: none;\n}\n@media only all and (max-width: 37.5em) {\n .u-show-on-mobile {\n display: block;\n }\n}\n\n.u-hidden {\n display: none !important;\n}\n\n.u-invisible {\n visibility: hidden;\n}\n\n.u-right {\n float: right;\n}\n\n.u-nowrap {\n white-space: nowrap;\n}\n\n/* stylelint-disable selector-class-pattern */\n.u-flexible-container {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 56.25%;\n height: 0;\n}\n.u-flexible-container__inner {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n.u-flexible-container--4-3 {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 75%;\n height: 0;\n}\n\n/*\nLink text and underline, unless otherwise specified.\n$c: Link color.\n$v: Link visited color.\n$h: Link hover color.\n$f: Link focus color.\n$a: Link active color.\n\n// Separate out a different underline color.\n$bc: Link underline color.\n$bv: Link underline visited color.\n$bh: Link underline hover color.\n$bf: Link underline focus color.\n$ba: Link underline active color.\n*/\n/* stylelint-disable selector-class-pattern */\n/* stylelint-enable */\n.u-mt0 {\n margin-top: 0 !important;\n}\n\n.u-mb0 {\n margin-bottom: 0 !important;\n}\n\n.u-mt5 {\n margin-top: 5px !important;\n}\n\n.u-mb5 {\n margin-bottom: 5px !important;\n}\n\n.u-mt10 {\n margin-top: 10px !important;\n}\n\n.u-mb10 {\n margin-bottom: 10px !important;\n}\n\n.u-mt15 {\n margin-top: 15px !important;\n}\n\n.u-mb15 {\n margin-bottom: 15px !important;\n}\n\n.u-mt20 {\n margin-top: 20px !important;\n}\n\n.u-mb20 {\n margin-bottom: 20px !important;\n}\n\n.u-mt30 {\n margin-top: 30px !important;\n}\n\n.u-mb30 {\n margin-bottom: 30px !important;\n}\n\n.u-mt45 {\n margin-top: 45px !important;\n}\n\n.u-mb45 {\n margin-bottom: 45px !important;\n}\n\n.u-mt60 {\n margin-top: 60px !important;\n}\n\n.u-mb60 {\n margin-bottom: 60px !important;\n}\n\n.u-w100pct {\n width: 100%;\n}\n\n.u-w90pct {\n width: 90%;\n}\n\n.u-w80pct {\n width: 80%;\n}\n\n.u-w70pct {\n width: 70%;\n}\n\n.u-w60pct {\n width: 60%;\n}\n\n.u-w50pct {\n width: 50%;\n}\n\n.u-w40pct {\n width: 40%;\n}\n\n.u-w30pct {\n width: 30%;\n}\n\n.u-w20pct {\n width: 20%;\n}\n\n.u-w10pct {\n width: 10%;\n}\n\n.u-w75pct {\n width: 75%;\n}\n\n.u-w65pct {\n width: 65%;\n}\n\n.u-w25pct {\n width: 25%;\n}\n\n.u-w15pct {\n width: 15%;\n}\n\n.u-w66pct {\n width: 66.6666666667%;\n}\n\n.u-w33pct {\n width: 33.3333333333%;\n}\n\n/* stylelint-disable selector-class-pattern */\nsmall,\n.u-small-text {\n /* stylelint-enable */\n font-size: 0.875em;\n}\nsmall--subtle,\n.u-small-text--subtle {\n color: var(--gray);\n}\n\n/* ==========================================================================\n Utility classes for transitions.\n\n Adds transitions utilty classes for transform, opacity,\n and for the removing the transition duration.\n ========================================================================== */\n.u-no-animation {\n transition-duration: 0s !important;\n}\n\n.u-move-transition {\n transition: transform 0.25s ease-out;\n}\n\n.u-move-to-origin {\n transform: translate3d(0, 0, 0);\n}\n\n.u-move-left {\n transform: translate3d(-100%, 0, 0);\n}\n\n.u-move-left-2x {\n transform: translate3d(-200%, 0, 0);\n}\n\n.u-move-left-3x {\n transform: translate3d(-300%, 0, 0);\n}\n\n.u-move-right {\n transform: translate3d(100%, 0, 0);\n}\n\n.u-move-up {\n transform: translate3d(0, -100%, 0);\n}\n\n.u-alpha-transition {\n transition: opacity 0.25s linear;\n}\n\n.u-alpha-100 {\n opacity: 1;\n}\n\n.u-alpha-0 {\n opacity: 0;\n}\n\n.u-max-height-transition {\n overflow: hidden;\n contain: paint;\n transition: max-height 0.2s ease-out;\n}\n\n/*\n.u-max-height-default {\n This class is kept for documentation completeness.\n The actual max-height is set in the JavaScript,\n so that we know what the actual height of the content is for easing purposes.\n}\n*/\n.u-max-height-zero {\n max-height: 0 !important;\n}\n\n.u-max-height-summary {\n /* The value set here should show 4 lines of text at our standard 16px\n base font size. The calculation comes from the following:\n 88px = 16 * 5.5em.\n 5.5em = base-line-height (22px) * 4 / base-font-size (16px)\n */\n max-height: 88px !important;\n}\n\n.o-banner {\n padding: 0.9375em 0;\n background: var(--gold-10);\n border-bottom: 1px solid var(--gray-40);\n font-size: 0.875em;\n}\n.o-banner .m-notification {\n border: none;\n padding: 0;\n}\n.o-banner .m-notification__icon {\n left: 0;\n top: 0;\n}\n.o-banner--dark {\n background: var(--teal-dark);\n border-color: var(--teal-dark);\n color: var(--white);\n}\n.o-banner--dark .m-notification {\n background: var(--teal-dark);\n}\n.o-banner--dark .m-notification .cf-icon-svg {\n fill: var(--white);\n}\n.o-banner--dark .m-notification a {\n color: var(--white);\n border-color: var(--white);\n}\n.o-banner--dark .m-notification a:visited, .o-banner--dark .m-notification a.visited {\n border-color: var(--teal-40);\n color: var(--teal-40);\n}\n.o-banner--dark .m-notification a:hover, .o-banner--dark .m-notification a.hover {\n border-color: var(--gray-15);\n color: var(--gray-15);\n}\n.o-banner--dark .m-notification a:focus, .o-banner--dark .m-notification a.focus {\n border-color: var(--white);\n color: var(--white);\n}\n.o-banner--dark .m-notification a:active, .o-banner--dark .m-notification a.active {\n border-color: var(--gray-15);\n color: var(--gray-15);\n}\n@media only all and (min-width: 37.5625em) {\n .o-banner {\n font-size: 1em;\n }\n}", "/* ==========================================================================\n Design System\n Notifications Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Utilities\n ========================================================================== */\n.no-js .u-js-only {\n display: none !important;\n}\n\n.u-hide-if-js {\n display: none !important;\n}\n.no-js .u-hide-if-js {\n display: block !important;\n}\n\n.u-clearfix::after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n.u-visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n border: 0;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n}\n\n@media only all and (max-width: 37.5em) {\n .u-hide-on-mobile {\n display: none;\n }\n}\n\n.u-show-on-mobile {\n display: none;\n}\n@media only all and (max-width: 37.5em) {\n .u-show-on-mobile {\n display: block;\n }\n}\n\n.u-hidden {\n display: none !important;\n}\n\n.u-invisible {\n visibility: hidden;\n}\n\n.u-right {\n float: right;\n}\n\n.u-nowrap {\n white-space: nowrap;\n}\n\n/* stylelint-disable selector-class-pattern */\n.u-flexible-container {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 56.25%;\n height: 0;\n}\n.u-flexible-container__inner {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n.u-flexible-container--4-3 {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 75%;\n height: 0;\n}\n\n/*\nLink text and underline, unless otherwise specified.\n$c: Link color.\n$v: Link visited color.\n$h: Link hover color.\n$f: Link focus color.\n$a: Link active color.\n\n// Separate out a different underline color.\n$bc: Link underline color.\n$bv: Link underline visited color.\n$bh: Link underline hover color.\n$bf: Link underline focus color.\n$ba: Link underline active color.\n*/\n/* stylelint-disable selector-class-pattern */\n/* stylelint-enable */\n.u-mt0 {\n margin-top: 0 !important;\n}\n\n.u-mb0 {\n margin-bottom: 0 !important;\n}\n\n.u-mt5 {\n margin-top: 5px !important;\n}\n\n.u-mb5 {\n margin-bottom: 5px !important;\n}\n\n.u-mt10 {\n margin-top: 10px !important;\n}\n\n.u-mb10 {\n margin-bottom: 10px !important;\n}\n\n.u-mt15 {\n margin-top: 15px !important;\n}\n\n.u-mb15 {\n margin-bottom: 15px !important;\n}\n\n.u-mt20 {\n margin-top: 20px !important;\n}\n\n.u-mb20 {\n margin-bottom: 20px !important;\n}\n\n.u-mt30 {\n margin-top: 30px !important;\n}\n\n.u-mb30 {\n margin-bottom: 30px !important;\n}\n\n.u-mt45 {\n margin-top: 45px !important;\n}\n\n.u-mb45 {\n margin-bottom: 45px !important;\n}\n\n.u-mt60 {\n margin-top: 60px !important;\n}\n\n.u-mb60 {\n margin-bottom: 60px !important;\n}\n\n.u-w100pct {\n width: 100%;\n}\n\n.u-w90pct {\n width: 90%;\n}\n\n.u-w80pct {\n width: 80%;\n}\n\n.u-w70pct {\n width: 70%;\n}\n\n.u-w60pct {\n width: 60%;\n}\n\n.u-w50pct {\n width: 50%;\n}\n\n.u-w40pct {\n width: 40%;\n}\n\n.u-w30pct {\n width: 30%;\n}\n\n.u-w20pct {\n width: 20%;\n}\n\n.u-w10pct {\n width: 10%;\n}\n\n.u-w75pct {\n width: 75%;\n}\n\n.u-w65pct {\n width: 65%;\n}\n\n.u-w25pct {\n width: 25%;\n}\n\n.u-w15pct {\n width: 15%;\n}\n\n.u-w66pct {\n width: 66.6666666667%;\n}\n\n.u-w33pct {\n width: 33.3333333333%;\n}\n\n/* stylelint-disable selector-class-pattern */\nsmall,\n.u-small-text {\n /* stylelint-enable */\n font-size: 0.875em;\n}\nsmall--subtle,\n.u-small-text--subtle {\n color: var(--gray);\n}\n\n/* ==========================================================================\n Utility classes for transitions.\n\n Adds transitions utilty classes for transform, opacity,\n and for the removing the transition duration.\n ========================================================================== */\n.u-no-animation {\n transition-duration: 0s !important;\n}\n\n.u-move-transition {\n transition: transform 0.25s ease-out;\n}\n\n.u-move-to-origin {\n transform: translate3d(0, 0, 0);\n}\n\n.u-move-left {\n transform: translate3d(-100%, 0, 0);\n}\n\n.u-move-left-2x {\n transform: translate3d(-200%, 0, 0);\n}\n\n.u-move-left-3x {\n transform: translate3d(-300%, 0, 0);\n}\n\n.u-move-right {\n transform: translate3d(100%, 0, 0);\n}\n\n.u-move-up {\n transform: translate3d(0, -100%, 0);\n}\n\n.u-alpha-transition {\n transition: opacity 0.25s linear;\n}\n\n.u-alpha-100 {\n opacity: 1;\n}\n\n.u-alpha-0 {\n opacity: 0;\n}\n\n.u-max-height-transition {\n overflow: hidden;\n contain: paint;\n transition: max-height 0.2s ease-out;\n}\n\n/*\n.u-max-height-default {\n This class is kept for documentation completeness.\n The actual max-height is set in the JavaScript,\n so that we know what the actual height of the content is for easing purposes.\n}\n*/\n.u-max-height-zero {\n max-height: 0 !important;\n}\n\n.u-max-height-summary {\n /* The value set here should show 4 lines of text at our standard 16px\n base font size. The calculation comes from the following:\n 88px = 16 * 5.5em.\n 5.5em = base-line-height (22px) * 4 / base-font-size (16px)\n */\n max-height: 88px !important;\n}\n\n.m-notification {\n display: none;\n position: relative;\n padding: 15px;\n background: var(--gray-5);\n border: 1px solid var(--gray-40);\n}\n.m-notification > .cf-icon-svg {\n position: absolute;\n fill: var(--gray);\n}\n.m-notification--success {\n background: var(--green-10);\n border-color: var(--green);\n}\n.m-notification--success > .cf-icon-svg {\n fill: var(--green);\n}\n.m-notification--warning {\n background: var(--gold-10);\n border-color: var(--gold);\n}\n.m-notification--warning > .cf-icon-svg {\n fill: var(--gold);\n}\n.m-notification--error {\n background: var(--red-10);\n border-color: var(--red);\n}\n.m-notification--error > .cf-icon-svg {\n fill: var(--red);\n}\n.m-notification--success a, .m-notification--warning a, .m-notification--error a {\n color: var(--pacific-mid-dark);\n border-color: var(--pacific-mid-dark);\n}\n.m-notification--success a:visited, .m-notification--success a.visited, .m-notification--warning a:visited, .m-notification--warning a.visited, .m-notification--error a:visited, .m-notification--error a.visited {\n border-color: var(--teal);\n color: var(--teal);\n}\n.m-notification--success a:hover, .m-notification--success a.hover, .m-notification--warning a:hover, .m-notification--warning a.hover, .m-notification--error a:hover, .m-notification--error a.hover {\n border-color: var(--pacific-dark);\n color: var(--pacific-dark);\n}\n.m-notification--success a:focus, .m-notification--success a.focus, .m-notification--warning a:focus, .m-notification--warning a.focus, .m-notification--error a:focus, .m-notification--error a.focus {\n border-color: var(--pacific-mid-dark);\n color: var(--pacific-mid-dark);\n}\n.m-notification--success a:active, .m-notification--success a.active, .m-notification--warning a:active, .m-notification--warning a.active, .m-notification--error a:active, .m-notification--error a.active {\n border-color: var(--navy-dark);\n color: var(--navy-dark);\n}\n.m-notification--visible {\n display: block;\n}\n.cf-icon-svg + .m-notification__content {\n padding-left: 1.5625rem;\n}\n.m-notification__message {\n font-size: 1rem;\n line-height: 1.25;\n font-weight: 500;\n}\n@media only all and (min-width: 37.5625em) {\n .m-notification__message {\n font-size: 1.125rem;\n }\n}\n.m-notification__explanation {\n margin-top: 0.3125rem;\n margin-bottom: 0.9375rem;\n}\n.m-notification__message + .m-list {\n margin-top: 0.9375rem;\n}\n@media only all and (min-width: 37.5625em) {\n .m-notification .cf-icon-svg {\n font-size: 1.125rem;\n }\n .m-notification__explanation {\n margin-bottom: 0;\n }\n .m-notification .m-list {\n margin-top: 0.3125rem;\n }\n .m-notification .m-list__item {\n margin-bottom: 0.3125rem;\n }\n}\n\nhtml[lang=ar] .m-notification .cf-icon-svg + .m-notification__content {\n padding-left: initial;\n padding-right: 1.5625rem;\n}\nhtml[lang=ar] .m-notification .m-list {\n padding-right: 0;\n}"],
4
+ "sourcesContent": ["/* ==========================================================================\n Design System\n Notifications Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Utilities\n ========================================================================== */\n.no-js .u-js-only {\n display: none !important;\n}\n\n.u-hide-if-js {\n display: none !important;\n}\n.no-js .u-hide-if-js {\n display: block !important;\n}\n\n.u-clearfix::after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n.u-visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n border: 0;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n}\n\n@media only all and (max-width: 37.5em) {\n .u-hide-on-mobile {\n display: none;\n }\n}\n\n.u-show-on-mobile {\n display: none;\n}\n@media only all and (max-width: 37.5em) {\n .u-show-on-mobile {\n display: block;\n }\n}\n\n.u-hidden {\n display: none !important;\n}\n\n.u-invisible {\n visibility: hidden;\n}\n\n.u-right {\n float: right;\n}\n\n.u-nowrap {\n white-space: nowrap;\n}\n\n/* stylelint-disable selector-class-pattern */\n.u-flexible-container {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 56.25%;\n height: 0;\n}\n.u-flexible-container__inner {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n.u-flexible-container--4-3 {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 75%;\n height: 0;\n}\n\n/*\nLink text and underline, unless otherwise specified.\n$c: Link color.\n$v: Link visited color.\n$h: Link hover color.\n$f: Link focus color.\n$a: Link active color.\n\n// Separate out a different underline color.\n$bc: Link underline color.\n$bv: Link underline visited color.\n$bh: Link underline hover color.\n$bf: Link underline focus color.\n$ba: Link underline active color.\n*/\n/* stylelint-disable selector-class-pattern */\n/* stylelint-enable */\n.u-mt0 {\n margin-top: 0 !important;\n}\n\n.u-mb0 {\n margin-bottom: 0 !important;\n}\n\n.u-mt5 {\n margin-top: 5px !important;\n}\n\n.u-mb5 {\n margin-bottom: 5px !important;\n}\n\n.u-mt10 {\n margin-top: 10px !important;\n}\n\n.u-mb10 {\n margin-bottom: 10px !important;\n}\n\n.u-mt15 {\n margin-top: 15px !important;\n}\n\n.u-mb15 {\n margin-bottom: 15px !important;\n}\n\n.u-mt20 {\n margin-top: 20px !important;\n}\n\n.u-mb20 {\n margin-bottom: 20px !important;\n}\n\n.u-mt30 {\n margin-top: 30px !important;\n}\n\n.u-mb30 {\n margin-bottom: 30px !important;\n}\n\n.u-mt45 {\n margin-top: 45px !important;\n}\n\n.u-mb45 {\n margin-bottom: 45px !important;\n}\n\n.u-mt60 {\n margin-top: 60px !important;\n}\n\n.u-mb60 {\n margin-bottom: 60px !important;\n}\n\n.u-w100pct {\n width: 100%;\n}\n\n.u-w90pct {\n width: 90%;\n}\n\n.u-w80pct {\n width: 80%;\n}\n\n.u-w70pct {\n width: 70%;\n}\n\n.u-w60pct {\n width: 60%;\n}\n\n.u-w50pct {\n width: 50%;\n}\n\n.u-w40pct {\n width: 40%;\n}\n\n.u-w30pct {\n width: 30%;\n}\n\n.u-w20pct {\n width: 20%;\n}\n\n.u-w10pct {\n width: 10%;\n}\n\n.u-w75pct {\n width: 75%;\n}\n\n.u-w65pct {\n width: 65%;\n}\n\n.u-w25pct {\n width: 25%;\n}\n\n.u-w15pct {\n width: 15%;\n}\n\n.u-w66pct {\n width: 66.6666666667%;\n}\n\n.u-w33pct {\n width: 33.3333333333%;\n}\n\n/* stylelint-disable selector-class-pattern */\nsmall,\n.u-small-text {\n /* stylelint-enable */\n font-size: 0.875em;\n}\nsmall--subtle,\n.u-small-text--subtle {\n color: var(--gray);\n}\n\n/* ==========================================================================\n Utility classes for transitions.\n\n Adds transitions utilty classes for transform, opacity,\n and for the removing the transition duration.\n ========================================================================== */\n.u-no-animation {\n transition-duration: 0s !important;\n}\n\n.u-move-transition {\n transition: transform 0.25s ease-out;\n}\n\n.u-move-to-origin {\n transform: translate3d(0, 0, 0);\n}\n\n.u-move-left {\n transform: translate3d(-100%, 0, 0);\n}\n\n.u-move-left-2x {\n transform: translate3d(-200%, 0, 0);\n}\n\n.u-move-left-3x {\n transform: translate3d(-300%, 0, 0);\n}\n\n.u-move-right {\n transform: translate3d(100%, 0, 0);\n}\n\n.u-move-up {\n transform: translate3d(0, -100%, 0);\n}\n\n.u-alpha-transition {\n transition: opacity 0.25s linear;\n}\n\n.u-alpha-100 {\n opacity: 1;\n}\n\n.u-alpha-0 {\n opacity: 0;\n}\n\n.u-max-height-transition {\n overflow: hidden;\n contain: paint;\n transition: max-height 0.2s ease-out;\n}\n\n/*\n.u-max-height-default {\n This class is kept for documentation completeness.\n The actual max-height is set in the JavaScript,\n so that we know what the actual height of the content is for easing purposes.\n}\n*/\n.u-max-height-zero {\n max-height: 0 !important;\n}\n\n.u-max-height-summary {\n /* The value set here should show 4 lines of text at our standard 16px\n base font size. The calculation comes from the following:\n 88px = 16 * 5.5em.\n 5.5em = base-line-height (22px) * 4 / base-font-size (16px)\n */\n max-height: 88px !important;\n}\n\n.o-banner {\n padding: 0.9375em 0;\n background: var(--gold-10);\n border-bottom: 1px solid var(--gray-40);\n font-size: 0.875em;\n}\n.o-banner .m-notification {\n border: none;\n padding: 0;\n}\n.o-banner .m-notification__icon {\n left: 0;\n top: 0;\n}\n.o-banner--dark {\n background: var(--teal-dark);\n border-color: var(--teal-dark);\n color: var(--white);\n}\n.o-banner--dark .m-notification {\n background: var(--teal-dark);\n}\n.o-banner--dark .m-notification .cf-icon-svg {\n fill: var(--white);\n}\n.o-banner--dark .m-notification a {\n color: var(--white);\n border-color: var(--white);\n}\n.o-banner--dark .m-notification a:visited, .o-banner--dark .m-notification a.visited {\n border-color: var(--teal-40);\n color: var(--teal-40);\n}\n.o-banner--dark .m-notification a:hover, .o-banner--dark .m-notification a.hover {\n border-color: var(--gray-15);\n color: var(--gray-15);\n}\n.o-banner--dark .m-notification a:focus, .o-banner--dark .m-notification a.focus {\n border-color: var(--white);\n color: var(--white);\n}\n.o-banner--dark .m-notification a:active, .o-banner--dark .m-notification a.active {\n border-color: var(--gray-15);\n color: var(--gray-15);\n}\n@media only all and (min-width: 37.5625em) {\n .o-banner {\n font-size: 1em;\n }\n}", "/* ==========================================================================\n Design System\n Notifications Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Utilities\n ========================================================================== */\n.no-js .u-js-only {\n display: none !important;\n}\n\n.u-hide-if-js {\n display: none !important;\n}\n.no-js .u-hide-if-js {\n display: block !important;\n}\n\n.u-clearfix::after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n.u-visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n border: 0;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n}\n\n@media only all and (max-width: 37.5em) {\n .u-hide-on-mobile {\n display: none;\n }\n}\n\n.u-show-on-mobile {\n display: none;\n}\n@media only all and (max-width: 37.5em) {\n .u-show-on-mobile {\n display: block;\n }\n}\n\n.u-hidden {\n display: none !important;\n}\n\n.u-invisible {\n visibility: hidden;\n}\n\n.u-right {\n float: right;\n}\n\n.u-nowrap {\n white-space: nowrap;\n}\n\n/* stylelint-disable selector-class-pattern */\n.u-flexible-container {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 56.25%;\n height: 0;\n}\n.u-flexible-container__inner {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n.u-flexible-container--4-3 {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 75%;\n height: 0;\n}\n\n/*\nLink text and underline, unless otherwise specified.\n$c: Link color.\n$v: Link visited color.\n$h: Link hover color.\n$f: Link focus color.\n$a: Link active color.\n\n// Separate out a different underline color.\n$bc: Link underline color.\n$bv: Link underline visited color.\n$bh: Link underline hover color.\n$bf: Link underline focus color.\n$ba: Link underline active color.\n*/\n/* stylelint-disable selector-class-pattern */\n/* stylelint-enable */\n.u-mt0 {\n margin-top: 0 !important;\n}\n\n.u-mb0 {\n margin-bottom: 0 !important;\n}\n\n.u-mt5 {\n margin-top: 5px !important;\n}\n\n.u-mb5 {\n margin-bottom: 5px !important;\n}\n\n.u-mt10 {\n margin-top: 10px !important;\n}\n\n.u-mb10 {\n margin-bottom: 10px !important;\n}\n\n.u-mt15 {\n margin-top: 15px !important;\n}\n\n.u-mb15 {\n margin-bottom: 15px !important;\n}\n\n.u-mt20 {\n margin-top: 20px !important;\n}\n\n.u-mb20 {\n margin-bottom: 20px !important;\n}\n\n.u-mt30 {\n margin-top: 30px !important;\n}\n\n.u-mb30 {\n margin-bottom: 30px !important;\n}\n\n.u-mt45 {\n margin-top: 45px !important;\n}\n\n.u-mb45 {\n margin-bottom: 45px !important;\n}\n\n.u-mt60 {\n margin-top: 60px !important;\n}\n\n.u-mb60 {\n margin-bottom: 60px !important;\n}\n\n.u-w100pct {\n width: 100%;\n}\n\n.u-w90pct {\n width: 90%;\n}\n\n.u-w80pct {\n width: 80%;\n}\n\n.u-w70pct {\n width: 70%;\n}\n\n.u-w60pct {\n width: 60%;\n}\n\n.u-w50pct {\n width: 50%;\n}\n\n.u-w40pct {\n width: 40%;\n}\n\n.u-w30pct {\n width: 30%;\n}\n\n.u-w20pct {\n width: 20%;\n}\n\n.u-w10pct {\n width: 10%;\n}\n\n.u-w75pct {\n width: 75%;\n}\n\n.u-w65pct {\n width: 65%;\n}\n\n.u-w25pct {\n width: 25%;\n}\n\n.u-w15pct {\n width: 15%;\n}\n\n.u-w66pct {\n width: 66.6666666667%;\n}\n\n.u-w33pct {\n width: 33.3333333333%;\n}\n\n/* stylelint-disable selector-class-pattern */\nsmall,\n.u-small-text {\n /* stylelint-enable */\n font-size: 0.875em;\n}\nsmall--subtle,\n.u-small-text--subtle {\n color: var(--gray);\n}\n\n/* ==========================================================================\n Utility classes for transitions.\n\n Adds transitions utilty classes for transform, opacity,\n and for the removing the transition duration.\n ========================================================================== */\n.u-no-animation {\n transition-duration: 0s !important;\n}\n\n.u-move-transition {\n transition: transform 0.25s ease-out;\n}\n\n.u-move-to-origin {\n transform: translate3d(0, 0, 0);\n}\n\n.u-move-left {\n transform: translate3d(-100%, 0, 0);\n}\n\n.u-move-left-2x {\n transform: translate3d(-200%, 0, 0);\n}\n\n.u-move-left-3x {\n transform: translate3d(-300%, 0, 0);\n}\n\n.u-move-right {\n transform: translate3d(100%, 0, 0);\n}\n\n.u-move-up {\n transform: translate3d(0, -100%, 0);\n}\n\n.u-alpha-transition {\n transition: opacity 0.25s linear;\n}\n\n.u-alpha-100 {\n opacity: 1;\n}\n\n.u-alpha-0 {\n opacity: 0;\n}\n\n.u-max-height-transition {\n overflow: hidden;\n contain: paint;\n transition: max-height 0.2s ease-out;\n}\n\n/*\n.u-max-height-default {\n This class is kept for documentation completeness.\n The actual max-height is set in the JavaScript,\n so that we know what the actual height of the content is for easing purposes.\n}\n*/\n.u-max-height-zero {\n max-height: 0 !important;\n}\n\n.u-max-height-summary {\n /* The value set here should show 4 lines of text at our standard 16px\n base font size. The calculation comes from the following:\n 88px = 16 * 5.5em.\n 5.5em = base-line-height (22px) * 4 / base-font-size (16px)\n */\n max-height: 88px !important;\n}\n\n.m-notification {\n display: none;\n position: relative;\n padding: 15px;\n background: var(--gray-5);\n border: 1px solid var(--gray-40);\n}\n.m-notification > .cf-icon-svg {\n position: absolute;\n fill: var(--gray);\n}\n.m-notification--success {\n background: var(--green-10);\n border-color: var(--green);\n}\n.m-notification--success > .cf-icon-svg {\n fill: var(--green);\n}\n.m-notification--warning {\n background: var(--gold-10);\n border-color: var(--gold);\n}\n.m-notification--warning > .cf-icon-svg {\n fill: var(--gold);\n}\n.m-notification--error {\n background: var(--red-10);\n border-color: var(--red);\n}\n.m-notification--error > .cf-icon-svg {\n fill: var(--red);\n}\n.m-notification--success a, .m-notification--warning a, .m-notification--error a {\n color: var(--pacific-mid-dark);\n border-color: var(--pacific-mid-dark);\n}\n.m-notification--success a:visited, .m-notification--success a.visited, .m-notification--warning a:visited, .m-notification--warning a.visited, .m-notification--error a:visited, .m-notification--error a.visited {\n border-color: var(--teal);\n color: var(--teal);\n}\n.m-notification--success a:hover, .m-notification--success a.hover, .m-notification--warning a:hover, .m-notification--warning a.hover, .m-notification--error a:hover, .m-notification--error a.hover {\n border-color: var(--pacific-dark);\n color: var(--pacific-dark);\n}\n.m-notification--success a:focus, .m-notification--success a.focus, .m-notification--warning a:focus, .m-notification--warning a.focus, .m-notification--error a:focus, .m-notification--error a.focus {\n border-color: var(--pacific-mid-dark);\n color: var(--pacific-mid-dark);\n}\n.m-notification--success a:active, .m-notification--success a.active, .m-notification--warning a:active, .m-notification--warning a.active, .m-notification--error a:active, .m-notification--error a.active {\n border-color: var(--navy-dark);\n color: var(--navy-dark);\n}\n.m-notification--visible {\n display: block;\n}\n.m-notification__content {\n max-width: 41.875rem;\n}\n.cf-icon-svg + .m-notification__content {\n padding-left: 1.5625rem;\n}\n.m-notification__message {\n font-size: 1rem;\n line-height: 1.25;\n font-weight: 500;\n}\n@media only all and (min-width: 37.5625em) {\n .m-notification__message {\n font-size: 1.125rem;\n }\n}\n.m-notification__explanation {\n margin-top: 0.3125rem;\n margin-bottom: 0.9375rem;\n}\n.m-notification__message + .m-list {\n margin-top: 0.9375rem;\n}\n@media only all and (min-width: 37.5625em) {\n .m-notification .cf-icon-svg {\n font-size: 1.125rem;\n }\n .m-notification__explanation {\n margin-bottom: 0;\n }\n .m-notification .m-list {\n margin-top: 0.3125rem;\n }\n .m-notification .m-list__item {\n margin-bottom: 0.3125rem;\n }\n}\n\nhtml[lang=ar] .m-notification .cf-icon-svg + .m-notification__content {\n padding-left: initial;\n padding-right: 1.5625rem;\n}\nhtml[lang=ar] .m-notification .m-list {\n padding-right: 0;\n}"],
5
5
  "mappings": "gGAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,IAAAA,EAAA,GCAA,IAAAC,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,IAAAA,EAAA",
6
6
  "names": ["banner_exports", "__export", "banner_default", "notification_exports", "__export", "notification_default"]
7
7
  }