From 773882cd104a5d55221c0b86733efb2a509421b9 Mon Sep 17 00:00:00 2001 From: Andrew Duthie Date: Wed, 29 Mar 2023 12:38:06 -0400 Subject: [PATCH 01/16] Upgrade to Login.gov Design System v7 changelog: Internal, Dependencies, Upgrade Login.gov Design System to v7 --- app/assets/config/manifest.js | 4 +- app/assets/stylesheets/_required.scss | 23 ++++++++++- app/assets/stylesheets/application.css.scss | 20 +++++----- .../components/_account-header.scss | 2 + app/assets/stylesheets/components/_alert.scss | 2 + .../stylesheets/components/_banner.scss | 2 + .../stylesheets/components/_block-link.scss | 2 + app/assets/stylesheets/components/_btn.scss | 2 + app/assets/stylesheets/components/_card.scss | 3 ++ .../stylesheets/components/_file-input.scss | 2 + .../stylesheets/components/_footer.scss | 2 + .../stylesheets/components/_form-steps.scss | 2 + app/assets/stylesheets/components/_form.scss | 2 + .../stylesheets/components/_full-screen.scss | 2 + app/assets/stylesheets/components/_hr.scss | 2 + app/assets/stylesheets/components/_icon.scss | 3 ++ .../components/_language-picker.scss | 8 ++-- .../components/_memorable-date.scss | 2 + app/assets/stylesheets/components/_modal.scss | 3 ++ app/assets/stylesheets/components/_nav.scss | 2 + .../components/_one-time-code-input.scss | 2 + .../stylesheets/components/_page-heading.scss | 2 + .../components/_password-toggle.scss | 2 + .../stylesheets/components/_personal-key.scss | 2 + .../stylesheets/components/_phone-input.scss | 2 + .../components/_profile-section.scss | 3 ++ .../components/_spinner-button.scss | 2 + .../components/_step-indicator.scss | 2 + app/assets/stylesheets/components/_tag.scss | 2 + .../components/_troubleshooting-options.scss | 3 ++ .../stylesheets/document-capture.css.scss | 4 +- app/assets/stylesheets/email.css.scss | 5 ++- .../stylesheets/utilities/_background.scss | 2 + app/assets/stylesheets/utilities/_border.scss | 2 + .../stylesheets/utilities/_typography.scss | 3 ++ app/assets/stylesheets/utilities/_util.scss | 2 +- app/assets/stylesheets/variables/_vendor.scss | 20 ---------- app/helpers/asset_helper.rb | 2 +- app/helpers/script_helper.rb | 2 +- .../build-sass/get-error-sass-stack-paths.js | 8 ++-- .../get-error-sass-stack-paths.spec.js | 16 ++++---- app/javascript/packages/components/icon.tsx | 2 +- .../components/acuant-capture.scss | 1 + .../components/location-collection-item.scss | 2 + .../packages/document-capture/styles.scss | 1 - app/javascript/packs/application.ts | 2 +- app/javascript/packs/navigation.ts | 4 +- config/initializers/assets.rb | 2 +- package.json | 4 +- spec/helpers/asset_helper_spec.rb | 4 +- spec/helpers/script_helper_spec.rb | 10 ++--- yarn.lock | 39 +++++++------------ 52 files changed, 155 insertions(+), 94 deletions(-) delete mode 100644 app/assets/stylesheets/variables/_vendor.scss diff --git a/app/assets/config/manifest.js b/app/assets/config/manifest.js index 7b77d811d49..6b147d7d533 100644 --- a/app/assets/config/manifest.js +++ b/app/assets/config/manifest.js @@ -5,6 +5,6 @@ //= link intl-tel-input/build/img/flags.png //= link intl-tel-input/build/img/flags@2x.png -//= link_tree ../../../node_modules/identity-style-guide/dist/assets/img -//= link_tree ../../../node_modules/identity-style-guide/dist/assets/fonts +//= link_tree ../../../node_modules/@18f/identity-design-system/dist/assets/img +//= link_tree ../../../node_modules/@18f/identity-design-system/dist/assets/fonts //= link_tree ../builds diff --git a/app/assets/stylesheets/_required.scss b/app/assets/stylesheets/_required.scss index f07e6942c03..ce59f8926dd 100644 --- a/app/assets/stylesheets/_required.scss +++ b/app/assets/stylesheets/_required.scss @@ -1 +1,22 @@ -@import 'variables/vendor'; +@use '@18f/identity-design-system/dist/assets/scss/uswds-theme' with ( + $theme-body-font-size: 'sm', + $theme-font-path: '.', + $theme-image-path: '@18f/identity-design-system/dist/assets/img', + $theme-global-border-box-sizing: true, + $theme-global-link-styles: true, + $theme-grid-container-max-width: 'tablet-lg', + $theme-header-min-width: 'tablet', + $theme-link-visited-color: 'primary', + $theme-style-body-element: true, + $theme-utility-breakpoints: ( + 'card': false, + 'card-lg': false, + 'mobile': false, + 'mobile-lg': false, + 'tablet': true, + 'tablet-lg': false, + 'desktop': false, + 'desktop-lg': false, + 'widescreen': false, + ) +); diff --git a/app/assets/stylesheets/application.css.scss b/app/assets/stylesheets/application.css.scss index 4b83d93d31c..a252cdd28cf 100644 --- a/app/assets/stylesheets/application.css.scss +++ b/app/assets/stylesheets/application.css.scss @@ -1,10 +1,10 @@ -@import 'variables/app'; -@import 'required'; -@import 'identity-style-guide/dist/assets/scss/packages/required'; -@import 'design-system-waiting-room'; -@import 'identity-style-guide/dist/assets/scss/packages/global'; -@import 'identity-style-guide/dist/assets/scss/packages/components'; -@import 'components/all'; -@import 'identity-style-guide/dist/assets/scss/packages/utilities'; -@import 'utilities/all'; -@import 'print'; +@forward 'required'; +@forward '@18f/identity-design-system/dist/assets/scss/packages/required'; +@forward 'design-system-waiting-room'; +@forward '@18f/identity-design-system/dist/assets/scss/uswds-theme'; +@forward '@18f/identity-design-system/dist/assets/scss/packages/global'; +@forward '@18f/identity-design-system/dist/assets/scss/packages/components'; +@forward 'components/all'; +@forward '@18f/identity-design-system/dist/assets/scss/packages/utilities'; +@forward 'utilities/all'; +@forward 'print'; diff --git a/app/assets/stylesheets/components/_account-header.scss b/app/assets/stylesheets/components/_account-header.scss index 66a1a7fb2e6..578e8587e33 100644 --- a/app/assets/stylesheets/components/_account-header.scss +++ b/app/assets/stylesheets/components/_account-header.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + .account-header__badges { @include at-media-max('tablet') { @include u-pin-x; diff --git a/app/assets/stylesheets/components/_alert.scss b/app/assets/stylesheets/components/_alert.scss index 9fe7191669d..76775f0b113 100644 --- a/app/assets/stylesheets/components/_alert.scss +++ b/app/assets/stylesheets/components/_alert.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + .usa-alert--info-important { @include u-bg('accent-cool-darker'); color: color('white'); diff --git a/app/assets/stylesheets/components/_banner.scss b/app/assets/stylesheets/components/_banner.scss index 3a3fc6a8876..5fdca668e76 100644 --- a/app/assets/stylesheets/components/_banner.scss +++ b/app/assets/stylesheets/components/_banner.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + .usa-banner__inner { @include at-media('tablet') { justify-content: center; diff --git a/app/assets/stylesheets/components/_block-link.scss b/app/assets/stylesheets/components/_block-link.scss index 0b370bbfd8d..52fd59731a9 100644 --- a/app/assets/stylesheets/components/_block-link.scss +++ b/app/assets/stylesheets/components/_block-link.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + .block-link { @include u-position('relative'); @include u-display('block'); diff --git a/app/assets/stylesheets/components/_btn.scss b/app/assets/stylesheets/components/_btn.scss index ef7815d1b7c..40a40929554 100644 --- a/app/assets/stylesheets/components/_btn.scss +++ b/app/assets/stylesheets/components/_btn.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + .usa-button { // Temporary: To be backported to design system. Margins should be applied at the button element, // or at the very least (a) we don't want the margins to offset full-width buttons on mobile, and diff --git a/app/assets/stylesheets/components/_card.scss b/app/assets/stylesheets/components/_card.scss index 116d9f274dc..da275bb1d68 100644 --- a/app/assets/stylesheets/components/_card.scss +++ b/app/assets/stylesheets/components/_card.scss @@ -1,3 +1,6 @@ +@use 'uswds-core' as *; +@use '../variables/app' as *; + .card { background-color: color('white'); max-width: $container-skinny-width; diff --git a/app/assets/stylesheets/components/_file-input.scss b/app/assets/stylesheets/components/_file-input.scss index a313b69dc97..a8c626ef081 100644 --- a/app/assets/stylesheets/components/_file-input.scss +++ b/app/assets/stylesheets/components/_file-input.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + // =============================================== // Pending upstream Login Design System revisions: // =============================================== diff --git a/app/assets/stylesheets/components/_footer.scss b/app/assets/stylesheets/components/_footer.scss index a72e951a516..fe1bb21e5f0 100644 --- a/app/assets/stylesheets/components/_footer.scss +++ b/app/assets/stylesheets/components/_footer.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + html, body { height: 100%; diff --git a/app/assets/stylesheets/components/_form-steps.scss b/app/assets/stylesheets/components/_form-steps.scss index a00777b8dfe..a083b1e02e5 100644 --- a/app/assets/stylesheets/components/_form-steps.scss +++ b/app/assets/stylesheets/components/_form-steps.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + .form-steps__focus-anchor[tabindex='-1']:focus { outline: none; diff --git a/app/assets/stylesheets/components/_form.scss b/app/assets/stylesheets/components/_form.scss index 8c2e7599494..4278ec6d631 100644 --- a/app/assets/stylesheets/components/_form.scss +++ b/app/assets/stylesheets/components/_form.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { /* stylelint-disable-next-line property-no-vendor-prefix */ diff --git a/app/assets/stylesheets/components/_full-screen.scss b/app/assets/stylesheets/components/_full-screen.scss index bac859c1c90..17f229fcc5b 100644 --- a/app/assets/stylesheets/components/_full-screen.scss +++ b/app/assets/stylesheets/components/_full-screen.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + .has-full-screen-overlay { overflow: hidden; } diff --git a/app/assets/stylesheets/components/_hr.scss b/app/assets/stylesheets/components/_hr.scss index aecfc015677..70c57ce0aa8 100644 --- a/app/assets/stylesheets/components/_hr.scss +++ b/app/assets/stylesheets/components/_hr.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + hr { border: 0; border-bottom: 1px solid color('primary-light'); diff --git a/app/assets/stylesheets/components/_icon.scss b/app/assets/stylesheets/components/_icon.scss index 2e464637836..05b22f6a71d 100644 --- a/app/assets/stylesheets/components/_icon.scss +++ b/app/assets/stylesheets/components/_icon.scss @@ -1,3 +1,6 @@ +@use 'uswds-core' as *; +@use '../variables/app' as *; + $icon-min-padding: 2px; // Upstream: https://github.com/uswds/uswds/pull/4493 diff --git a/app/assets/stylesheets/components/_language-picker.scss b/app/assets/stylesheets/components/_language-picker.scss index 3d8037993d5..e6d14f6823b 100644 --- a/app/assets/stylesheets/components/_language-picker.scss +++ b/app/assets/stylesheets/components/_language-picker.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + .language-picker { position: relative; width: auto; @@ -64,10 +66,10 @@ } &::after { - background-image: url(identity-style-guide/dist/assets/img/angle-arrow-up.svg); + background-image: url(@18f/identity-design-system/dist/assets/img/angle-arrow-up.svg); @include at-media('tablet') { - background-image: url(identity-style-guide/dist/assets/img/angle-arrow-up-white.svg); + background-image: url(@18f/identity-design-system/dist/assets/img/angle-arrow-up-white.svg); } } } @@ -77,7 +79,7 @@ color: color('white'); &::after { - background-image: url(identity-style-guide/dist/assets/img/angle-arrow-down-white.svg); + background-image: url(@18f/identity-design-system/dist/assets/img/angle-arrow-down-white.svg); } } } diff --git a/app/assets/stylesheets/components/_memorable-date.scss b/app/assets/stylesheets/components/_memorable-date.scss index 6c353de0045..5f4dc92c801 100644 --- a/app/assets/stylesheets/components/_memorable-date.scss +++ b/app/assets/stylesheets/components/_memorable-date.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + .usa-memorable-date input[type='text'] { @include u-padding-x(1); } diff --git a/app/assets/stylesheets/components/_modal.scss b/app/assets/stylesheets/components/_modal.scss index e70f729faa8..6b91a43c05d 100644 --- a/app/assets/stylesheets/components/_modal.scss +++ b/app/assets/stylesheets/components/_modal.scss @@ -1,3 +1,6 @@ +@use 'uswds-core' as *; +@use '../variables/app' as *; + .usa-modal-overlay { // Temporary styles to avoid inheriting too much of the USWDS opinionated modal styling until // modal styles are settled in the Login.gov Design System. diff --git a/app/assets/stylesheets/components/_nav.scss b/app/assets/stylesheets/components/_nav.scss index 9ee550f61a6..95e6f8756c7 100644 --- a/app/assets/stylesheets/components/_nav.scss +++ b/app/assets/stylesheets/components/_nav.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + .page-header--basic { @include u-flex('align-center', 'justify-center'); @include u-display('flex'); diff --git a/app/assets/stylesheets/components/_one-time-code-input.scss b/app/assets/stylesheets/components/_one-time-code-input.scss index 709714730f9..6bbf026d0e2 100644 --- a/app/assets/stylesheets/components/_one-time-code-input.scss +++ b/app/assets/stylesheets/components/_one-time-code-input.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + lg-one-time-code-input { display: block; diff --git a/app/assets/stylesheets/components/_page-heading.scss b/app/assets/stylesheets/components/_page-heading.scss index 3edf953d8a5..c71999ea2fe 100644 --- a/app/assets/stylesheets/components/_page-heading.scss +++ b/app/assets/stylesheets/components/_page-heading.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + .page-heading { @include u-margin-top(0); @include u-margin-bottom(2); diff --git a/app/assets/stylesheets/components/_password-toggle.scss b/app/assets/stylesheets/components/_password-toggle.scss index 469b26d5cb3..13f472f8ed8 100644 --- a/app/assets/stylesheets/components/_password-toggle.scss +++ b/app/assets/stylesheets/components/_password-toggle.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + lg-password-toggle { display: block; diff --git a/app/assets/stylesheets/components/_personal-key.scss b/app/assets/stylesheets/components/_personal-key.scss index 3dcf488795b..27d55bc560e 100644 --- a/app/assets/stylesheets/components/_personal-key.scss +++ b/app/assets/stylesheets/components/_personal-key.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + .personal-key-block { @include u-padding-y(2); background-image: url('personal-key/pkey-block.svg'); diff --git a/app/assets/stylesheets/components/_phone-input.scss b/app/assets/stylesheets/components/_phone-input.scss index 6cea19c5b13..07f0e973b95 100644 --- a/app/assets/stylesheets/components/_phone-input.scss +++ b/app/assets/stylesheets/components/_phone-input.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + lg-phone-input { display: block; diff --git a/app/assets/stylesheets/components/_profile-section.scss b/app/assets/stylesheets/components/_profile-section.scss index 05472dafb6e..497c10edf9e 100644 --- a/app/assets/stylesheets/components/_profile-section.scss +++ b/app/assets/stylesheets/components/_profile-section.scss @@ -1,3 +1,6 @@ +@use 'uswds-core' as *; +@use '../variables/app' as *; + .profile-info-box { border: 0; border-radius: 0; diff --git a/app/assets/stylesheets/components/_spinner-button.scss b/app/assets/stylesheets/components/_spinner-button.scss index 467521ae8cf..5d931537a15 100644 --- a/app/assets/stylesheets/components/_spinner-button.scss +++ b/app/assets/stylesheets/components/_spinner-button.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + lg-spinner-button { display: block; diff --git a/app/assets/stylesheets/components/_step-indicator.scss b/app/assets/stylesheets/components/_step-indicator.scss index c56e753d614..95a3835e984 100644 --- a/app/assets/stylesheets/components/_step-indicator.scss +++ b/app/assets/stylesheets/components/_step-indicator.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + $step-indicator-current-step-border-width: 3px; $step-indicator-line-height: 4px; diff --git a/app/assets/stylesheets/components/_tag.scss b/app/assets/stylesheets/components/_tag.scss index 155568cfb7a..8b64ca8851e 100644 --- a/app/assets/stylesheets/components/_tag.scss +++ b/app/assets/stylesheets/components/_tag.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + // =============================================== // Pending upstream Login Design System revisions: // =============================================== diff --git a/app/assets/stylesheets/components/_troubleshooting-options.scss b/app/assets/stylesheets/components/_troubleshooting-options.scss index 41a823e9440..61a965b589b 100644 --- a/app/assets/stylesheets/components/_troubleshooting-options.scss +++ b/app/assets/stylesheets/components/_troubleshooting-options.scss @@ -1,3 +1,6 @@ +@use 'uswds-core' as *; +@use '../utilities/typography' as *; + .troubleshooting-options { @include u-margin-y(4); diff --git a/app/assets/stylesheets/document-capture.css.scss b/app/assets/stylesheets/document-capture.css.scss index 5fc7f686456..e96206b0dd6 100644 --- a/app/assets/stylesheets/document-capture.css.scss +++ b/app/assets/stylesheets/document-capture.css.scss @@ -1,2 +1,2 @@ -@import 'required'; -@import '../../javascript/packages/document-capture/styles'; +@forward 'required'; +@forward '../../javascript/packages/document-capture/styles'; diff --git a/app/assets/stylesheets/email.css.scss b/app/assets/stylesheets/email.css.scss index 84102adbf4b..b0456ecf384 100644 --- a/app/assets/stylesheets/email.css.scss +++ b/app/assets/stylesheets/email.css.scss @@ -1,7 +1,8 @@ -@import 'required'; +@forward 'required'; +@use '@18f/identity-design-system/dist/assets/scss/uswds-theme' as *; +@import 'variables/app'; @import 'variables/email'; @import 'foundation-emails/scss/foundation-emails'; -@import 'identity-style-guide/dist/assets/scss/packages/required'; .gray { &:active, diff --git a/app/assets/stylesheets/utilities/_background.scss b/app/assets/stylesheets/utilities/_background.scss index 9265d8de4a6..9fb4e2f9211 100644 --- a/app/assets/stylesheets/utilities/_background.scss +++ b/app/assets/stylesheets/utilities/_background.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + @include at-media('tablet') { /* stylelint-disable-next-line selector-class-pattern */ .tablet\:bg-primary-lighter { diff --git a/app/assets/stylesheets/utilities/_border.scss b/app/assets/stylesheets/utilities/_border.scss index 9cbf075ca4c..fff06e145e0 100644 --- a/app/assets/stylesheets/utilities/_border.scss +++ b/app/assets/stylesheets/utilities/_border.scss @@ -1,3 +1,5 @@ +@use '../variables/app' as *; + .rounded-xl { border-radius: $border-radius-xl; } diff --git a/app/assets/stylesheets/utilities/_typography.scss b/app/assets/stylesheets/utilities/_typography.scss index 3b5b0307f32..3b52fa8b0f4 100644 --- a/app/assets/stylesheets/utilities/_typography.scss +++ b/app/assets/stylesheets/utilities/_typography.scss @@ -1,3 +1,6 @@ +@use 'uswds-core' as *; +@use '../variables/app' as *; + body { -webkit-font-smoothing: antialiased; } diff --git a/app/assets/stylesheets/utilities/_util.scss b/app/assets/stylesheets/utilities/_util.scss index ab017797ef5..804be19afaa 100644 --- a/app/assets/stylesheets/utilities/_util.scss +++ b/app/assets/stylesheets/utilities/_util.scss @@ -1,4 +1,4 @@ -// supplemental utility classes +@use 'uswds-core' as *; html.no-js .js { display: none; diff --git a/app/assets/stylesheets/variables/_vendor.scss b/app/assets/stylesheets/variables/_vendor.scss deleted file mode 100644 index d1bb16c2ed2..00000000000 --- a/app/assets/stylesheets/variables/_vendor.scss +++ /dev/null @@ -1,20 +0,0 @@ -$theme-body-font-size: 'sm'; -$theme-font-path: '.'; -$theme-image-path: 'identity-style-guide/dist/assets/img'; -$theme-global-border-box-sizing: true; -$theme-global-link-styles: true; -$theme-grid-container-max-width: 'tablet-lg'; -$theme-header-min-width: 'tablet'; -$theme-link-visited-color: 'primary'; -$theme-style-body-element: true; -$theme-utility-breakpoints: ( - 'card': false, - 'card-lg': false, - 'mobile': false, - 'mobile-lg': false, - 'tablet': true, - 'tablet-lg': false, - 'desktop': false, - 'desktop-lg': false, - 'widescreen': false, -); diff --git a/app/helpers/asset_helper.rb b/app/helpers/asset_helper.rb index 3fb76b7456b..4a4d013ca9c 100644 --- a/app/helpers/asset_helper.rb +++ b/app/helpers/asset_helper.rb @@ -1,5 +1,5 @@ module AssetHelper - DESIGN_SYSTEM_ASSET_ROOT = 'identity-style-guide/dist/assets'.freeze + DESIGN_SYSTEM_ASSET_ROOT = '@18f/identity-design-system/dist/assets'.freeze def design_system_asset_path(path) File.join(DESIGN_SYSTEM_ASSET_ROOT, path) diff --git a/app/helpers/script_helper.rb b/app/helpers/script_helper.rb index 2a25870c853..1f7ba137b16 100644 --- a/app/helpers/script_helper.rb +++ b/app/helpers/script_helper.rb @@ -39,7 +39,7 @@ def render_javascript_pack_once_tags(*names) private SAME_ORIGIN_ASSETS = %w[ - identity-style-guide/dist/assets/img/sprite.svg + @18f/identity-design-system/dist/assets/img/sprite.svg ].to_set.freeze def local_crossorigin_sources? diff --git a/app/javascript/packages/build-sass/get-error-sass-stack-paths.js b/app/javascript/packages/build-sass/get-error-sass-stack-paths.js index ec24c482b3c..e7044fcb776 100644 --- a/app/javascript/packages/build-sass/get-error-sass-stack-paths.js +++ b/app/javascript/packages/build-sass/get-error-sass-stack-paths.js @@ -4,15 +4,15 @@ * @example * ``` * getErrorSassStackPaths( - * 'node_modules/identity-style-guide/dist/assets/scss/uswds/core/_functions.scss 35:8 divide()\n' + - * 'node_modules/identity-style-guide/dist/assets/scss/uswds/core/mixins/_icon.scss 77:12 add-color-icon()\n' + + * 'node_modules/@18f/identity-design-system/dist/assets/scss/uswds/core/_functions.scss 35:8 divide()\n' + + * 'node_modules/@18f/identity-design-system/dist/assets/scss/uswds/core/mixins/_icon.scss 77:12 add-color-icon()\n' + * 'app/assets/stylesheets/components/_alert.scss 13:5 @import\n' + * 'app/assets/stylesheets/components/all.scss 3:9 @import\n' + * 'app/assets/stylesheets/application.css.scss 7:9 root stylesheet\n', * ); * // [ - * // 'node_modules/identity-style-guide/dist/assets/scss/uswds/core/_functions.scss', - * // 'node_modules/identity-style-guide/dist/assets/scss/uswds/core/mixins/_icon.scss', + * // 'node_modules/@18f/identity-design-system/dist/assets/scss/uswds/core/_functions.scss', + * // 'node_modules/@18f/identity-design-system/dist/assets/scss/uswds/core/mixins/_icon.scss', * // 'app/assets/stylesheets/components/_alert.scss', * // 'app/assets/stylesheets/components/all.scss', * // 'app/assets/stylesheets/application.css.scss', diff --git a/app/javascript/packages/build-sass/get-error-sass-stack-paths.spec.js b/app/javascript/packages/build-sass/get-error-sass-stack-paths.spec.js index e1d43c3e3b8..c27615993ac 100644 --- a/app/javascript/packages/build-sass/get-error-sass-stack-paths.spec.js +++ b/app/javascript/packages/build-sass/get-error-sass-stack-paths.spec.js @@ -3,16 +3,16 @@ import getErrorSassStackPaths from './get-error-sass-stack-paths.js'; describe('getErrorSassStackPaths', () => { it('returns an array of paths from a sass stack message', () => { const stackPaths = getErrorSassStackPaths( - 'node_modules/identity-style-guide/dist/assets/scss/uswds/core/_functions.scss 35:8 divide()\n' + - 'node_modules/identity-style-guide/dist/assets/scss/uswds/core/mixins/_icon.scss 77:12 add-color-icon()\n' + + 'node_modules/@18f/identity-design-system/dist/assets/scss/uswds/core/_functions.scss 35:8 divide()\n' + + 'node_modules/@18f/identity-design-system/dist/assets/scss/uswds/core/mixins/_icon.scss 77:12 add-color-icon()\n' + 'app/assets/stylesheets/components/_alert.scss 13:5 @import\n' + 'app/assets/stylesheets/components/all.scss 3:9 @import\n' + 'app/assets/stylesheets/application.css.scss 7:9 root stylesheet\n', ); expect(stackPaths).to.deep.equal([ - 'node_modules/identity-style-guide/dist/assets/scss/uswds/core/_functions.scss', - 'node_modules/identity-style-guide/dist/assets/scss/uswds/core/mixins/_icon.scss', + 'node_modules/@18f/identity-design-system/dist/assets/scss/uswds/core/_functions.scss', + 'node_modules/@18f/identity-design-system/dist/assets/scss/uswds/core/mixins/_icon.scss', 'app/assets/stylesheets/components/_alert.scss', 'app/assets/stylesheets/components/all.scss', 'app/assets/stylesheets/application.css.scss', @@ -22,16 +22,16 @@ describe('getErrorSassStackPaths', () => { context('with a stack path containing a space', () => { it('returns an array of paths from a sass stack message', () => { const stackPaths = getErrorSassStackPaths( - 'node_modules/identity-style-guide/dist/assets/scss/uswds/core/_functions.scss 35:8 divide()\n' + - 'node_modules/identity-style-guide/dist/assets/scss/uswds/core/mixins/_icon.scss 77:12 add-color-icon()\n' + + 'node_modules/@18f/identity-design-system/dist/assets/scss/uswds/core/_functions.scss 35:8 divide()\n' + + 'node_modules/@18f/identity-design-system/dist/assets/scss/uswds/core/mixins/_icon.scss 77:12 add-color-icon()\n' + 'app/assets/stylesheets/components/_alert example.scss 13:5 @import\n' + 'app/assets/stylesheets/components/all.scss 3:9 @import\n' + 'app/assets/stylesheets/application.css.scss 7:9 root stylesheet\n', ); expect(stackPaths).to.deep.equal([ - 'node_modules/identity-style-guide/dist/assets/scss/uswds/core/_functions.scss', - 'node_modules/identity-style-guide/dist/assets/scss/uswds/core/mixins/_icon.scss', + 'node_modules/@18f/identity-design-system/dist/assets/scss/uswds/core/_functions.scss', + 'node_modules/@18f/identity-design-system/dist/assets/scss/uswds/core/mixins/_icon.scss', 'app/assets/stylesheets/components/_alert example.scss', 'app/assets/stylesheets/components/all.scss', 'app/assets/stylesheets/application.css.scss', diff --git a/app/javascript/packages/components/icon.tsx b/app/javascript/packages/components/icon.tsx index 887bafcf70b..5bd6d85083c 100644 --- a/app/javascript/packages/components/icon.tsx +++ b/app/javascript/packages/components/icon.tsx @@ -1,6 +1,6 @@ import { getAssetPath } from '@18f/identity-assets'; -const SPRITE_URL = getAssetPath('identity-style-guide/dist/assets/img/sprite.svg'); +const SPRITE_URL = getAssetPath('@18f/identity-design-system/dist/assets/img/sprite.svg'); export type DesignSystemIcon = | 'accessibility_new' diff --git a/app/javascript/packages/document-capture/components/acuant-capture.scss b/app/javascript/packages/document-capture/components/acuant-capture.scss index d02e8e8f6ba..2ed7922a445 100644 --- a/app/javascript/packages/document-capture/components/acuant-capture.scss +++ b/app/javascript/packages/document-capture/components/acuant-capture.scss @@ -1,3 +1,4 @@ +@use 'uswds-core' as *; @use 'sass:math'; .document-capture-acuant-capture { diff --git a/app/javascript/packages/document-capture/components/location-collection-item.scss b/app/javascript/packages/document-capture/components/location-collection-item.scss index 4ae9cf06257..aefbc37d3e9 100644 --- a/app/javascript/packages/document-capture/components/location-collection-item.scss +++ b/app/javascript/packages/document-capture/components/location-collection-item.scss @@ -1,3 +1,5 @@ +@use 'uswds-core' as *; + .location-collection-item { max-width: 64ex; list-style-type: none; diff --git a/app/javascript/packages/document-capture/styles.scss b/app/javascript/packages/document-capture/styles.scss index 7fad52a07e8..1bf22932693 100644 --- a/app/javascript/packages/document-capture/styles.scss +++ b/app/javascript/packages/document-capture/styles.scss @@ -1,4 +1,3 @@ -@import 'identity-style-guide/dist/assets/scss/packages/required'; @import './components/acuant-capture'; @import './components/acuant-capture-canvas'; @import './components/location-collection-item'; diff --git a/app/javascript/packs/application.ts b/app/javascript/packs/application.ts index 227b3ade7f2..6cd8cb725d5 100644 --- a/app/javascript/packs/application.ts +++ b/app/javascript/packs/application.ts @@ -1,4 +1,4 @@ -import { accordion, banner, skipnav } from 'identity-style-guide'; +import { accordion, banner, skipnav } from '@18f/identity-design-system'; const components = [accordion, banner, skipnav]; components.forEach((component) => component.on()); diff --git a/app/javascript/packs/navigation.ts b/app/javascript/packs/navigation.ts index 7bf8dffa242..727d252c7b0 100644 --- a/app/javascript/packs/navigation.ts +++ b/app/javascript/packs/navigation.ts @@ -1,3 +1,3 @@ -import { navigation } from 'identity-style-guide'; +import { skipnav } from '@18f/identity-design-system'; -navigation.on(); +skipnav.on(); diff --git a/config/initializers/assets.rb b/config/initializers/assets.rb index 4cc032b324d..cc0cc161230 100644 --- a/config/initializers/assets.rb +++ b/config/initializers/assets.rb @@ -6,7 +6,7 @@ # Add additional assets to the asset load path Rails.application.config.assets.paths.push( 'node_modules', - 'node_modules/identity-style-guide/dist/assets/fonts', + 'node_modules/@18f/identity-design-system/dist/assets/fonts', ) # Fix sassc sometimes segfaulting diff --git a/package.json b/package.json index 0a582219ca5..6631f892ff4 100644 --- a/package.json +++ b/package.json @@ -18,7 +18,7 @@ "clean": "rm -rf public/packs/*", "prebuild": "yarn run clean", "build": "webpack && yarn generate-browsers-json", - "build:css": "build-sass app/assets/stylesheets/*.css.scss --out-dir=app/assets/builds" + "build:css": "build-sass app/assets/stylesheets/*.css.scss --load-path=node_modules/@uswds/uswds/packages --out-dir=app/assets/builds" }, "dependencies": { "@babel/core": "^7.20.7", @@ -33,7 +33,7 @@ "core-js": "^3.21.1", "fast-glob": "^3.2.7", "foundation-emails": "^2.3.1", - "identity-style-guide": "^6.7.0", + "@18f/identity-design-system": "file:../identity-style-guide", "intl-tel-input": "^17.0.19", "react": "^17.0.2", "react-dom": "^17.0.2", diff --git a/spec/helpers/asset_helper_spec.rb b/spec/helpers/asset_helper_spec.rb index ecd6e5a7d24..3952a2b34f2 100644 --- a/spec/helpers/asset_helper_spec.rb +++ b/spec/helpers/asset_helper_spec.rb @@ -9,14 +9,14 @@ subject(:asset_path) { design_system_asset_path(path) } it 'produces an asset path' do - expect(asset_path).to eq('identity-style-guide/dist/assets/img/example.png') + expect(asset_path).to eq('@18f/identity-design-system/dist/assets/img/example.png') end context 'with leading slash' do let(:path) { '/img/example.png' } it 'produces an asset path' do - expect(asset_path).to eq('identity-style-guide/dist/assets/img/example.png') + expect(asset_path).to eq('@18f/identity-design-system/dist/assets/img/example.png') end end end diff --git a/spec/helpers/script_helper_spec.rb b/spec/helpers/script_helper_spec.rb index 347a41a8a3f..f0abd0d6489 100644 --- a/spec/helpers/script_helper_spec.rb +++ b/spec/helpers/script_helper_spec.rb @@ -32,7 +32,7 @@ allow(AssetSources).to receive(:get_sources).with('application', 'document-capture'). and_return(['/application.js', '/document-capture.js']) allow(AssetSources).to receive(:get_assets).with('application', 'document-capture'). - and_return(['clock.svg', 'identity-style-guide/dist/assets/img/sprite.svg']) + and_return(['clock.svg', '@18f/identity-design-system/dist/assets/img/sprite.svg']) end it 'prints asset paths sources' do @@ -43,8 +43,8 @@ visible: :all, text: { 'clock.svg' => 'http://test.host/clock.svg', - 'identity-style-guide/dist/assets/img/sprite.svg' => - 'http://test.host/identity-style-guide/dist/assets/img/sprite.svg', + '@18f/identity-design-system/dist/assets/img/sprite.svg' => + 'http://test.host/@18f/identity-design-system/dist/assets/img/sprite.svg', }.to_json, ) end @@ -66,8 +66,8 @@ visible: :all, text: { 'clock.svg' => 'http://assets.example.com/clock.svg', - 'identity-style-guide/dist/assets/img/sprite.svg' => - 'http://example.com/identity-style-guide/dist/assets/img/sprite.svg', + '@18f/identity-design-system/dist/assets/img/sprite.svg' => + 'http://example.com/@18f/identity-design-system/dist/assets/img/sprite.svg', }.to_json, ) end diff --git a/yarn.lock b/yarn.lock index 1885d6affa8..0601765adab 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2,6 +2,11 @@ # yarn lockfile v1 +"@18f/identity-design-system@file:../identity-style-guide": + version "6.7.0" + dependencies: + "@uswds/uswds" "^3.4.1" + "@ampproject/remapping@^2.1.0": version "2.2.0" resolved "https://registry.yarnpkg.com/@ampproject/remapping/-/remapping-2.2.0.tgz#56c133824780de3174aed5ab6834f3026790154d" @@ -1684,6 +1689,16 @@ resolved "https://registry.yarnpkg.com/@ungap/promise-all-settled/-/promise-all-settled-1.1.2.tgz#aa58042711d6e3275dd37dc597e5d31e8c290a44" integrity sha512-sL/cEvJWAnClXw0wHk85/2L0G6Sj8UB0Ctc1TEMbKSsmpRosqhwj9gWgFRZSrBr2f9tiXISwNhCPmlfqUqyb9Q== +"@uswds/uswds@^3.4.1": + version "3.4.1" + resolved "https://registry.yarnpkg.com/@uswds/uswds/-/uswds-3.4.1.tgz#dd15644d791e1969dff2394d9d2ec2ea1e795128" + integrity sha512-eLYbWUqf9eWUa2P6CO3ckIjtQyM3AylrIOHxN5gYG3P62TDd3FzRDyoACfvOe6CNk0w0PqXWJnuPzxpNoOgWNA== + dependencies: + classlist-polyfill "1.0.3" + object-assign "4.1.1" + receptor "1.0.0" + resolve-id-refs "0.1.0" + "@webassemblyjs/ast@1.11.1": version "1.11.1" resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.11.1.tgz#2bfd767eae1a6996f432ff7e8d7fc75679c0b6a7" @@ -2909,11 +2924,6 @@ domhandler@^4.2.0, domhandler@^4.3.0: dependencies: domelementtype "^2.2.0" -domready@1.0.8: - version "1.0.8" - resolved "https://registry.yarnpkg.com/domready/-/domready-1.0.8.tgz#91f252e597b65af77e745ae24dd0185d5e26d58c" - integrity sha1-kfJS5Ze2Wvd+dFriTdAYXV4m1Yw= - domutils@^2.8.0: version "2.8.0" resolved "https://registry.yarnpkg.com/domutils/-/domutils-2.8.0.tgz#4437def5db6e2d1f5d6ee859bd95ca7d02048135" @@ -3969,14 +3979,6 @@ iconv-lite@0.6.3, iconv-lite@^0.6.3: dependencies: safer-buffer ">= 2.1.2 < 3.0.0" -identity-style-guide@^6.7.0: - version "6.7.0" - resolved "https://registry.yarnpkg.com/identity-style-guide/-/identity-style-guide-6.7.0.tgz#2901c72deee7e1f30c4a784b0f07b12b9cd6a1de" - integrity sha512-kXITvbEJWlj7fjSLVbeqZ7hnQ20RL51VFFoANojbVChVeVebOeyb3NIAX9mQ1sIVS34ycnKypM/jdoHmj4Dh/g== - dependencies: - domready "1.0.8" - uswds "^2.13.3" - ieee754@^1.1.13: version "1.2.1" resolved "https://registry.yarnpkg.com/ieee754/-/ieee754-1.2.1.tgz#8eb7a10a63fff25d15a57b001586d177d1b0d352" @@ -6678,17 +6680,6 @@ use-sync-external-store@^1.2.0: resolved "https://registry.yarnpkg.com/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz#7dbefd6ef3fe4e767a0cf5d7287aacfb5846928a" integrity sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA== -uswds@^2.13.3: - version "2.13.3" - resolved "https://registry.yarnpkg.com/uswds/-/uswds-2.13.3.tgz#f2a0623b496941ff30ad3a0ea1610407d35a6b14" - integrity sha512-qCblljeaRvS3+PrSxoHqQwmMnp746+Y1YZA34BkTzJknvo2bhhdzGE21yJaInumzIqV3glLD13TFdRwrwikMMQ== - dependencies: - classlist-polyfill "1.0.3" - domready "1.0.8" - object-assign "4.1.1" - receptor "1.0.0" - resolve-id-refs "0.1.0" - util-deprecate@^1.0.1, util-deprecate@^1.0.2, util-deprecate@~1.0.1: version "1.0.2" resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf" From 9bfeb5c7d9bd3c58ba0d9128796f6e72ed126f1c Mon Sep 17 00:00:00 2001 From: Andrew Duthie Date: Fri, 14 Apr 2023 15:23:18 -0400 Subject: [PATCH 02/16] Patch broken alerts --- app/assets/stylesheets/components/_alert.scss | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/app/assets/stylesheets/components/_alert.scss b/app/assets/stylesheets/components/_alert.scss index 76775f0b113..506cafceb76 100644 --- a/app/assets/stylesheets/components/_alert.scss +++ b/app/assets/stylesheets/components/_alert.scss @@ -29,3 +29,8 @@ .usa-alert__text > p:last-child { margin-bottom: 0; } + +// Upstream fix: https://github.com/uswds/uswds/pull/5187 +.usa-alert .usa-alert__body::before { + height: units(2); +} From 9be5192136fd1b564172fe33bfd9bf857ca498d9 Mon Sep 17 00:00:00 2001 From: Andrew Duthie Date: Fri, 14 Apr 2023 15:23:47 -0400 Subject: [PATCH 03/16] Update usage for package overrides --- app/assets/stylesheets/_required.scss | 2 +- app/assets/stylesheets/application.css.scss | 6 +----- app/assets/stylesheets/email.css.scss | 2 +- package.json | 2 +- 4 files changed, 4 insertions(+), 8 deletions(-) diff --git a/app/assets/stylesheets/_required.scss b/app/assets/stylesheets/_required.scss index ce59f8926dd..3a685e3f505 100644 --- a/app/assets/stylesheets/_required.scss +++ b/app/assets/stylesheets/_required.scss @@ -1,4 +1,4 @@ -@use '@18f/identity-design-system/dist/assets/scss/uswds-theme' with ( +@use 'uswds-core' with ( $theme-body-font-size: 'sm', $theme-font-path: '.', $theme-image-path: '@18f/identity-design-system/dist/assets/img', diff --git a/app/assets/stylesheets/application.css.scss b/app/assets/stylesheets/application.css.scss index a252cdd28cf..efa8abb2768 100644 --- a/app/assets/stylesheets/application.css.scss +++ b/app/assets/stylesheets/application.css.scss @@ -1,10 +1,6 @@ @forward 'required'; -@forward '@18f/identity-design-system/dist/assets/scss/packages/required'; +@forward 'uswds'; @forward 'design-system-waiting-room'; -@forward '@18f/identity-design-system/dist/assets/scss/uswds-theme'; -@forward '@18f/identity-design-system/dist/assets/scss/packages/global'; -@forward '@18f/identity-design-system/dist/assets/scss/packages/components'; @forward 'components/all'; -@forward '@18f/identity-design-system/dist/assets/scss/packages/utilities'; @forward 'utilities/all'; @forward 'print'; diff --git a/app/assets/stylesheets/email.css.scss b/app/assets/stylesheets/email.css.scss index b0456ecf384..3c3c523cb0e 100644 --- a/app/assets/stylesheets/email.css.scss +++ b/app/assets/stylesheets/email.css.scss @@ -1,5 +1,5 @@ @forward 'required'; -@use '@18f/identity-design-system/dist/assets/scss/uswds-theme' as *; +@use 'uswds-core' as *; @import 'variables/app'; @import 'variables/email'; @import 'foundation-emails/scss/foundation-emails'; diff --git a/package.json b/package.json index 6631f892ff4..7c41253aa44 100644 --- a/package.json +++ b/package.json @@ -18,7 +18,7 @@ "clean": "rm -rf public/packs/*", "prebuild": "yarn run clean", "build": "webpack && yarn generate-browsers-json", - "build:css": "build-sass app/assets/stylesheets/*.css.scss --load-path=node_modules/@uswds/uswds/packages --out-dir=app/assets/builds" + "build:css": "build-sass app/assets/stylesheets/*.css.scss --load-path=node_modules/@18f/identity-design-system/packages --out-dir=app/assets/builds" }, "dependencies": { "@babel/core": "^7.20.7", From be3fbe8e6369172746c3dd536dbfefc912e2468e Mon Sep 17 00:00:00 2001 From: Andrew Duthie Date: Fri, 14 Apr 2023 15:25:21 -0400 Subject: [PATCH 04/16] Remove unnecessary overrides --- app/assets/stylesheets/_required.scss | 13 +------------ 1 file changed, 1 insertion(+), 12 deletions(-) diff --git a/app/assets/stylesheets/_required.scss b/app/assets/stylesheets/_required.scss index 3a685e3f505..ac3bf384a30 100644 --- a/app/assets/stylesheets/_required.scss +++ b/app/assets/stylesheets/_required.scss @@ -7,16 +7,5 @@ $theme-grid-container-max-width: 'tablet-lg', $theme-header-min-width: 'tablet', $theme-link-visited-color: 'primary', - $theme-style-body-element: true, - $theme-utility-breakpoints: ( - 'card': false, - 'card-lg': false, - 'mobile': false, - 'mobile-lg': false, - 'tablet': true, - 'tablet-lg': false, - 'desktop': false, - 'desktop-lg': false, - 'widescreen': false, - ) + $theme-style-body-element: true ); From 8557efc41454be2ed90f4d4b2098f4b9efb41a5a Mon Sep 17 00:00:00 2001 From: Andrew Duthie Date: Thu, 20 Apr 2023 12:57:35 -0400 Subject: [PATCH 05/16] Use published beta --- package.json | 2 +- yarn.lock | 14 ++++++++------ 2 files changed, 9 insertions(+), 7 deletions(-) diff --git a/package.json b/package.json index 7c41253aa44..40c965fa818 100644 --- a/package.json +++ b/package.json @@ -21,6 +21,7 @@ "build:css": "build-sass app/assets/stylesheets/*.css.scss --load-path=node_modules/@18f/identity-design-system/packages --out-dir=app/assets/builds" }, "dependencies": { + "@18f/identity-design-system": "^7.0.0-beta.1", "@babel/core": "^7.20.7", "@babel/preset-env": "^7.15.6", "@babel/preset-react": "^7.14.5", @@ -33,7 +34,6 @@ "core-js": "^3.21.1", "fast-glob": "^3.2.7", "foundation-emails": "^2.3.1", - "@18f/identity-design-system": "file:../identity-style-guide", "intl-tel-input": "^17.0.19", "react": "^17.0.2", "react-dom": "^17.0.2", diff --git a/yarn.lock b/yarn.lock index 0601765adab..9487deac555 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2,8 +2,10 @@ # yarn lockfile v1 -"@18f/identity-design-system@file:../identity-style-guide": - version "6.7.0" +"@18f/identity-design-system@^7.0.0-beta.1": + version "7.0.0-beta.1" + resolved "https://registry.yarnpkg.com/@18f/identity-design-system/-/identity-design-system-7.0.0-beta.1.tgz#fcaacc290cd925616bed249358295c39781a550d" + integrity sha512-Pn3melHWURpjPqcwgcTn8cXyhlJKdR5jhjB1h2TyhWQxhOsRvI93qG9SSfHap+adl6gXZBUhAlomSRSCiSzOCQ== dependencies: "@uswds/uswds" "^3.4.1" @@ -2946,7 +2948,7 @@ electron-to-chromium@^1.4.284: element-closest@^2.0.1: version "2.0.2" resolved "https://registry.yarnpkg.com/element-closest/-/element-closest-2.0.2.tgz#72a740a107453382e28df9ce5dbb5a8df0f966ec" - integrity sha1-cqdAoQdFM4LijfnOXbtajfD5Zuw= + integrity sha512-QCqAWP3kwj8Gz9UXncVXQGdrhnWxD8SQBSeZp5pOsyCcQ6RpL738L1/tfuwBiMi6F1fYkxqPnBrFBR4L+f49Cg== emoji-regex@^8.0.0: version "8.0.0" @@ -4455,7 +4457,7 @@ just-extend@^4.0.2: keyboardevent-key-polyfill@^1.0.2: version "1.1.0" resolved "https://registry.yarnpkg.com/keyboardevent-key-polyfill/-/keyboardevent-key-polyfill-1.1.0.tgz#8a319d8e45a13172fca56286372f90c1d4c7014c" - integrity sha1-ijGdjkWhMXL8pWKGNy+QwdTHAUw= + integrity sha512-NTDqo7XhzL1fqmUzYroiyK2qGua7sOMzLav35BfNA/mPUSCtw8pZghHFMTYR9JdnJ23IQz695FcaM6EE6bpbFQ== kind-of@^6.0.2, kind-of@^6.0.3: version "6.0.3" @@ -5586,7 +5588,7 @@ readdirp@~3.6.0: receptor@1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/receptor/-/receptor-1.0.0.tgz#bf54477e0387e44bebf3855120bbda5adea08f8b" - integrity sha1-v1RHfgOH5Evr84VRILvaWt6gj4s= + integrity sha512-yvVEqVQDNzEmGkluCkEdbKSXqZb3WGxotI/VukXIQ+4/BXEeXVjWtmC6jWaR1BIsmEAGYQy3OTaNgDj2Svr01w== dependencies: element-closest "^2.0.1" keyboardevent-key-polyfill "^1.0.2" @@ -5705,7 +5707,7 @@ resolve-from@^5.0.0: resolve-id-refs@0.1.0: version "0.1.0" resolved "https://registry.yarnpkg.com/resolve-id-refs/-/resolve-id-refs-0.1.0.tgz#3126624b887489da8fc0ae889632f8413ac6c3ec" - integrity sha1-MSZiS4h0idqPwK6IljL4QTrGw+w= + integrity sha512-hNS03NEmVpJheF7yfyagNh57XuKc0z+NkSO0oBbeO67o6IJKoqlDfnNIxhjp7aTWwjmSWZQhtiGrOgZXVyM90w== resolve@^1.10.0, resolve@^1.14.2, resolve@^1.22.1, resolve@^1.9.0: version "1.22.1" From c58d5c8311e8f96ca597c7f7e6d3899a1e1863cb Mon Sep 17 00:00:00 2001 From: Andrew Duthie Date: Thu, 20 Apr 2023 15:40:38 -0400 Subject: [PATCH 06/16] Optimize USWDS imports --- app/assets/stylesheets/_required.scss | 41 ++++++++++++++++++++++++++- app/assets/stylesheets/_uswds.scss | 29 +++++++++++++++++++ 2 files changed, 69 insertions(+), 1 deletion(-) create mode 100644 app/assets/stylesheets/_uswds.scss diff --git a/app/assets/stylesheets/_required.scss b/app/assets/stylesheets/_required.scss index ac3bf384a30..248473430ec 100644 --- a/app/assets/stylesheets/_required.scss +++ b/app/assets/stylesheets/_required.scss @@ -7,5 +7,44 @@ $theme-grid-container-max-width: 'tablet-lg', $theme-header-min-width: 'tablet', $theme-link-visited-color: 'primary', - $theme-style-body-element: true + $theme-style-body-element: true, + $output-these-utilities: ( + 'add-list-reset', + 'align-items', + 'align-self', + 'background-color', + 'border', + 'border-color', + 'border-style', + 'border-width', + 'bottom', + 'clearfix', + 'color', + 'display', + 'flex', + 'flex-direction', + 'flex-wrap', + 'float', + 'font', + 'font-family', + 'font-feature', + 'font-style', + 'font-weight', + 'height', + 'justify-content', + 'left', + 'margin', + 'margin-horizontal', + 'margin-vertical', + 'maxw', + 'padding', + 'position', + 'right', + 'text-align', + 'text-transform', + 'top', + 'vertical-align', + 'whitespace', + 'width', + ) ); diff --git a/app/assets/stylesheets/_uswds.scss b/app/assets/stylesheets/_uswds.scss new file mode 100644 index 00000000000..86c132c1b9c --- /dev/null +++ b/app/assets/stylesheets/_uswds.scss @@ -0,0 +1,29 @@ +@use 'uswds-core' as *; + +@forward 'uswds-global'; +@forward 'uswds-helpers'; +@forward 'uswds-typography'; +@forward 'usa-accordion'; +@forward 'usa-alert'; +@forward 'usa-banner'; +@forward 'usa-button'; +@forward 'usa-form'; +@forward 'usa-header'; +@forward 'usa-icon-list'; +@forward 'usa-icon'; +@forward 'usa-layout-grid'; +@forward 'usa-modal'; +@forward 'usa-nav'; +@forward 'usa-process-list'; +@forward 'usa-sidenav'; +@forward 'usa-skipnav'; +@forward 'usa-step-indicator'; +@forward 'usa-tag'; +@forward 'usa-verification-badge'; +@forward 'uswds-form-controls'; +@forward 'uswds-utilities'; + +// TODO: Move this to uswds-global: +html { + background-color: color('primary-darker'); +} From 33059adcf0faaf08a2e236e2eb607decd11c5109 Mon Sep 17 00:00:00 2001 From: Andrew Duthie Date: Mon, 24 Apr 2023 15:24:23 -0400 Subject: [PATCH 07/16] Import missing core functions import Sass silently compiles missing functions as the verbatim original text --- app/assets/stylesheets/components/_password.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/stylesheets/components/_password.scss b/app/assets/stylesheets/components/_password.scss index 741656eece5..9b537c3e1fb 100644 --- a/app/assets/stylesheets/components/_password.scss +++ b/app/assets/stylesheets/components/_password.scss @@ -1,4 +1,4 @@ -// password strength module +@use 'uswds-core' as *; $weak: #e80e0e; $average: #ffac00; From a7ff279b338f867e9ad079900d13b1326a17ceaf Mon Sep 17 00:00:00 2001 From: Andrew Duthie Date: Mon, 24 Apr 2023 15:36:52 -0400 Subject: [PATCH 08/16] Restore subset of code styles Used for backup codes & TOTP setup --- app/assets/stylesheets/components/_code.scss | 7 +++++++ app/assets/stylesheets/components/all.scss | 1 + app/views/users/backup_code_setup/create.html.erb | 2 +- 3 files changed, 9 insertions(+), 1 deletion(-) create mode 100644 app/assets/stylesheets/components/_code.scss diff --git a/app/assets/stylesheets/components/_code.scss b/app/assets/stylesheets/components/_code.scss new file mode 100644 index 00000000000..23e7a0d549b --- /dev/null +++ b/app/assets/stylesheets/components/_code.scss @@ -0,0 +1,7 @@ +@use 'uswds-core' as *; + +code { + font-size: 0.875rem; + background-color: #fafafa; + border-radius: border-radius('sm'); +} diff --git a/app/assets/stylesheets/components/all.scss b/app/assets/stylesheets/components/all.scss index 951a5fd3e18..cbb2670331a 100644 --- a/app/assets/stylesheets/components/all.scss +++ b/app/assets/stylesheets/components/all.scss @@ -5,6 +5,7 @@ @import 'block-link'; @import 'btn'; @import 'card'; +@import 'code'; @import 'click-observer'; @import 'file-input'; @import 'form-steps'; diff --git a/app/views/users/backup_code_setup/create.html.erb b/app/views/users/backup_code_setup/create.html.erb index d7075858cc0..0bbec291653 100644 --- a/app/views/users/backup_code_setup/create.html.erb +++ b/app/views/users/backup_code_setup/create.html.erb @@ -19,7 +19,7 @@
<% section.each do |code| %>
- + <%= RandomPhrase.format(code, separator: '-') %>
From f4a179fc872c35bbd65407320590228078879f4b Mon Sep 17 00:00:00 2001 From: Andrew Duthie Date: Mon, 24 Apr 2023 16:33:07 -0400 Subject: [PATCH 09/16] Refine USWDS component imports Add missing media-block, collection Pair down typography, helpers regex: usa-(?!(accordion|alert|banner|button|collection|form|header|icon-list|icon|layout-grid|modal|nav|process-list|sidenav|skipnav|step-indicator|tag|verification-badge|success-message|character-count|checkbox|combo-box|date-picker|error-message|fieldset|file-input|form-group|form|hint|input-prefix-suffix|input|input-mask|label|legend|memorable-date|radio|range|select|textarea|time-picker|prose|list|sr-only|link)) --- app/assets/stylesheets/_uswds.scss | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/app/assets/stylesheets/_uswds.scss b/app/assets/stylesheets/_uswds.scss index 86c132c1b9c..620f27a8536 100644 --- a/app/assets/stylesheets/_uswds.scss +++ b/app/assets/stylesheets/_uswds.scss @@ -2,19 +2,23 @@ @forward 'uswds-global'; @forward 'uswds-helpers'; -@forward 'uswds-typography'; @forward 'usa-accordion'; @forward 'usa-alert'; @forward 'usa-banner'; @forward 'usa-button'; +@forward 'usa-collection'; @forward 'usa-form'; @forward 'usa-header'; @forward 'usa-icon-list'; @forward 'usa-icon'; @forward 'usa-layout-grid'; +@forward 'usa-link'; +@forward 'usa-list'; +@forward 'usa-media-block'; @forward 'usa-modal'; @forward 'usa-nav'; @forward 'usa-process-list'; +@forward 'usa-prose'; @forward 'usa-sidenav'; @forward 'usa-skipnav'; @forward 'usa-step-indicator'; From e99c8516d50448eae4f288364935f2a7faf3bb13 Mon Sep 17 00:00:00 2001 From: Andrew Duthie Date: Thu, 27 Apr 2023 10:09:01 -0400 Subject: [PATCH 10/16] Remove fix overrides --- app/assets/stylesheets/components/_form.scss | 1 - app/assets/stylesheets/components/_modal.scss | 3 --- 2 files changed, 4 deletions(-) diff --git a/app/assets/stylesheets/components/_form.scss b/app/assets/stylesheets/components/_form.scss index 4278ec6d631..3720422d42c 100644 --- a/app/assets/stylesheets/components/_form.scss +++ b/app/assets/stylesheets/components/_form.scss @@ -13,7 +13,6 @@ input::-webkit-inner-spin-button { .usa-form-group--error { border-left-style: none; - margin-top: units(3); // Remove after: https://github.com/uswds/uswds/issues/4189 padding-left: 0; @include at-media('desktop') { diff --git a/app/assets/stylesheets/components/_modal.scss b/app/assets/stylesheets/components/_modal.scss index 6b91a43c05d..7611bc77fc0 100644 --- a/app/assets/stylesheets/components/_modal.scss +++ b/app/assets/stylesheets/components/_modal.scss @@ -9,9 +9,6 @@ align-items: start; justify-content: center; - // Pending upstream Login Design System revision: - background: rgba(color('base-darker'), 50%); - @include at-media('tablet') { align-items: center; } From 683e76aa477b541a61846a07e63427fdbfed43d2 Mon Sep 17 00:00:00 2001 From: Andrew Duthie Date: Thu, 27 Apr 2023 14:21:04 -0400 Subject: [PATCH 11/16] Fix mobile navigation --- app/assets/stylesheets/components/_nav.scss | 13 ++++++++++++- app/javascript/packs/navigation.ts | 4 ++-- app/views/layouts/base.html.erb | 6 +++++- spec/features/users/user_profile_spec.rb | 14 ++++++++++++++ spec/support/features/browser_emulation_helper.rb | 15 +++++++++++++++ 5 files changed, 48 insertions(+), 4 deletions(-) create mode 100644 spec/support/features/browser_emulation_helper.rb diff --git a/app/assets/stylesheets/components/_nav.scss b/app/assets/stylesheets/components/_nav.scss index 95e6f8756c7..13fb1f091c6 100644 --- a/app/assets/stylesheets/components/_nav.scss +++ b/app/assets/stylesheets/components/_nav.scss @@ -12,8 +12,19 @@ } .sidenav-mobile .usa-nav__close { - @include add-background-svg('close-blue-60v-alt'); + @include add-background-svg('close-primary'); @include u-square(6); background-position: center center; background-repeat: no-repeat; } + +@media (prefers-reduced-motion) { + // The design system should be responsible for disabling inessential animations when user prefers + // reduced motion. This is not currently implemented, but the styles is implemented ad hoc here + // for use in feature specs (see BrowserEmulationHelper#emulate_reduced_motion). + // + // Upstream issue: https://github.com/uswds/uswds/issues/5256 + .usa-nav.is-visible { + animation: none; + } +} diff --git a/app/javascript/packs/navigation.ts b/app/javascript/packs/navigation.ts index 727d252c7b0..804c024e86a 100644 --- a/app/javascript/packs/navigation.ts +++ b/app/javascript/packs/navigation.ts @@ -1,3 +1,3 @@ -import { skipnav } from '@18f/identity-design-system'; +import { header } from '@18f/identity-design-system'; -skipnav.on(); +header.on(); diff --git a/app/views/layouts/base.html.erb b/app/views/layouts/base.html.erb index cdf71bb54c9..65bfd2a6b24 100644 --- a/app/views/layouts/base.html.erb +++ b/app/views/layouts/base.html.erb @@ -64,7 +64,11 @@ <%= link_to t('shared.skip_link'), '#main-content', class: 'usa-skipnav' %>
- <%= yield(:mobile_nav) if content_for?(:mobile_nav) %> + <% if content_for?(:mobile_nav) %> +
+ <%= yield(:mobile_nav) %> +
+ <% end %> <%= render 'shared/banner' %> <%= content_tag( local_assigns[:user_main_tag] == false ? 'div' : 'main', diff --git a/spec/features/users/user_profile_spec.rb b/spec/features/users/user_profile_spec.rb index a584bf1ec32..65404010c36 100644 --- a/spec/features/users/user_profile_spec.rb +++ b/spec/features/users/user_profile_spec.rb @@ -5,6 +5,7 @@ include NavigationHelper include PersonalKeyHelper include PushNotificationsHelper + include BrowserEmulationHelper context 'account status badges' do before do @@ -167,4 +168,17 @@ end end end + + context 'with a mobile device', js: true, driver: :headless_chrome_mobile do + before { sign_in_and_2fa_user } + + it 'allows a user to navigate between pages' do + # Emulate reduced motion to avoid timing issues with mobile menu flyout animation + emulate_reduced_motion + click_on t('account.navigation.menu') + click_link t('account.navigation.history') + + expect(current_path).to eq(account_history_path) + end + end end diff --git a/spec/support/features/browser_emulation_helper.rb b/spec/support/features/browser_emulation_helper.rb new file mode 100644 index 00000000000..2838be3d65f --- /dev/null +++ b/spec/support/features/browser_emulation_helper.rb @@ -0,0 +1,15 @@ +module BrowserEmulationHelper + def emulate_reduced_motion + # See: https://chromedevtools.github.io/devtools-protocol/tot/Emulation/#method-setEmulatedMedia + send_bridge_command( + 'Emulation.setEmulatedMedia', + features: [{ name: 'prefers-reduced-motion', value: 'reduce' }], + ) + end + + def send_bridge_command(command, params) + bridge = Capybara.current_session.driver.browser.send(:bridge) + path = "/session/#{bridge.session_id}/chromium/send_command" + bridge.http.call(:post, path, cmd: command, params:) + end +end From b8f92f06efcd0cf107803c9116da6a8d046246e5 Mon Sep 17 00:00:00 2001 From: Andrew Duthie Date: Thu, 27 Apr 2023 14:44:20 -0400 Subject: [PATCH 12/16] Fix singular / plural usage Co-authored-by: Zach Margolis --- app/assets/stylesheets/components/_nav.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/stylesheets/components/_nav.scss b/app/assets/stylesheets/components/_nav.scss index 13fb1f091c6..eda03137337 100644 --- a/app/assets/stylesheets/components/_nav.scss +++ b/app/assets/stylesheets/components/_nav.scss @@ -20,7 +20,7 @@ @media (prefers-reduced-motion) { // The design system should be responsible for disabling inessential animations when user prefers - // reduced motion. This is not currently implemented, but the styles is implemented ad hoc here + // reduced motion. This is not currently implemented, but the style is implemented ad hoc here // for use in feature specs (see BrowserEmulationHelper#emulate_reduced_motion). // // Upstream issue: https://github.com/uswds/uswds/issues/5256 From bf362da63d617aaea8609fbe0c7931178b1bef57 Mon Sep 17 00:00:00 2001 From: Andrew Duthie Date: Fri, 28 Apr 2023 15:11:37 -0400 Subject: [PATCH 13/16] Improve display of mobile footer external link icon --- app/views/shared/_footer_lite.html.erb | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/views/shared/_footer_lite.html.erb b/app/views/shared/_footer_lite.html.erb index 83c493405aa..6a312801634 100644 --- a/app/views/shared/_footer_lite.html.erb +++ b/app/views/shared/_footer_lite.html.erb @@ -5,7 +5,7 @@ <% end %> <%= render LanguagePickerComponent.new(class: 'footer__language-picker') %>
- <%= new_tab_link_to('https://www.gsa.gov', class: 'tablet:display-none margin-right-2') do %> + <%= new_tab_link_to('https://www.gsa.gov', class: 'tablet:display-none display-flex margin-right-2') do %> <%= image_tag asset_url('sp-logos/square-gsa-dark.svg'), size: 20, alt: t('shared.footer_lite.gsa') %> <% end %> <%= new_tab_link_to(t('links.help'), MarketingSite.help_url, class: 'margin-right-2') %> From 1368ef1cd2481112f18d10239ec9401f9f3d0449 Mon Sep 17 00:00:00 2001 From: Andrew Duthie Date: Mon, 1 May 2023 09:42:52 -0400 Subject: [PATCH 14/16] Upgrade to final release of LGDS 7 --- .github/dependabot.yml | 2 +- app/assets/stylesheets/_uswds.scss | 5 ----- app/assets/stylesheets/components/_tag.scss | 15 --------------- app/assets/stylesheets/components/all.scss | 1 - app/javascript/packages/components/README.md | 2 +- docs/frontend.md | 2 +- package.json | 2 +- yarn.lock | 8 ++++---- 8 files changed, 8 insertions(+), 29 deletions(-) delete mode 100644 app/assets/stylesheets/components/_tag.scss diff --git a/.github/dependabot.yml b/.github/dependabot.yml index ce8eab88f55..e5e0acd3c05 100644 --- a/.github/dependabot.yml +++ b/.github/dependabot.yml @@ -5,4 +5,4 @@ updates: schedule: interval: 'daily' allow: - - dependency-name: 'identity-style-guide' + - dependency-name: '@18f/identity-design-system' diff --git a/app/assets/stylesheets/_uswds.scss b/app/assets/stylesheets/_uswds.scss index 620f27a8536..0862381ea69 100644 --- a/app/assets/stylesheets/_uswds.scss +++ b/app/assets/stylesheets/_uswds.scss @@ -26,8 +26,3 @@ @forward 'usa-verification-badge'; @forward 'uswds-form-controls'; @forward 'uswds-utilities'; - -// TODO: Move this to uswds-global: -html { - background-color: color('primary-darker'); -} diff --git a/app/assets/stylesheets/components/_tag.scss b/app/assets/stylesheets/components/_tag.scss deleted file mode 100644 index 8b64ca8851e..00000000000 --- a/app/assets/stylesheets/components/_tag.scss +++ /dev/null @@ -1,15 +0,0 @@ -@use 'uswds-core' as *; - -// =============================================== -// Pending upstream Login Design System revisions: -// =============================================== - -.usa-tag { - display: inline-block; - text-transform: none; - font-weight: bold; -} - -.usa-tag--informative { - @include u-bg('accent-cool-darker'); -} diff --git a/app/assets/stylesheets/components/all.scss b/app/assets/stylesheets/components/all.scss index cbb2670331a..8e5f74236e7 100644 --- a/app/assets/stylesheets/components/all.scss +++ b/app/assets/stylesheets/components/all.scss @@ -29,6 +29,5 @@ @import 'spinner-button'; @import 'spinner-dots'; @import 'step-indicator'; -@import 'tag'; @import 'troubleshooting-options'; @import 'memorable-date'; diff --git a/app/javascript/packages/components/README.md b/app/javascript/packages/components/README.md index 99abc5b09c4..5f94e09d6f2 100644 --- a/app/javascript/packages/components/README.md +++ b/app/javascript/packages/components/README.md @@ -4,7 +4,7 @@ React components for common UI interactions. These components are intended to be reusable, whereas domain-specific React components should be found in the package corresponding to the specific page or feature. -Many of these components are React implementations for components of the [Login.gov Design System](https://github.com/18f/identity-style-guide). +Many of these components are React implementations for components of the [Login.gov Design System](https://github.com/18f/identity-design-system). ## Example diff --git a/docs/frontend.md b/docs/frontend.md index b62ebf17f9d..f10fec8b4c5 100644 --- a/docs/frontend.md +++ b/docs/frontend.md @@ -4,7 +4,7 @@ ### At a Glance -- Leverages components and utilities from the [Login.gov Design System](https://github.com/18f/identity-style-guide), +- Leverages components and utilities from the [Login.gov Design System](https://github.com/18f/identity-design-system), which is based on the [U.S. Web Design System](https://designsystem.digital.gov/). - Uses [Sass](https://sass-lang.com/) as the CSS preprocessor and [Stylelint](https://stylelint.io/) to keep files tidy. diff --git a/package.json b/package.json index 40c965fa818..7e65cc7cb46 100644 --- a/package.json +++ b/package.json @@ -21,7 +21,7 @@ "build:css": "build-sass app/assets/stylesheets/*.css.scss --load-path=node_modules/@18f/identity-design-system/packages --out-dir=app/assets/builds" }, "dependencies": { - "@18f/identity-design-system": "^7.0.0-beta.1", + "@18f/identity-design-system": "^7.0.0", "@babel/core": "^7.20.7", "@babel/preset-env": "^7.15.6", "@babel/preset-react": "^7.14.5", diff --git a/yarn.lock b/yarn.lock index 9487deac555..5c0497b7839 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2,10 +2,10 @@ # yarn lockfile v1 -"@18f/identity-design-system@^7.0.0-beta.1": - version "7.0.0-beta.1" - resolved "https://registry.yarnpkg.com/@18f/identity-design-system/-/identity-design-system-7.0.0-beta.1.tgz#fcaacc290cd925616bed249358295c39781a550d" - integrity sha512-Pn3melHWURpjPqcwgcTn8cXyhlJKdR5jhjB1h2TyhWQxhOsRvI93qG9SSfHap+adl6gXZBUhAlomSRSCiSzOCQ== +"@18f/identity-design-system@^7.0.0": + version "7.0.0" + resolved "https://registry.yarnpkg.com/@18f/identity-design-system/-/identity-design-system-7.0.0.tgz#ea57464f6407eb74122dcd3d3deaaa923f565032" + integrity sha512-rLw1oTK7qzGw+A2B7gYLjEOqX49MOkbe/yyK3M8e+DXpqFOxU1/GjxVzVOr/RuyzhsOeoIT+//xaqPr4dxZA5Q== dependencies: "@uswds/uswds" "^3.4.1" From e2934d32b88b5d3f188bfb7af339d2942a143738 Mon Sep 17 00:00:00 2001 From: Andrew Duthie Date: Tue, 2 May 2023 16:16:33 -0400 Subject: [PATCH 15/16] Bump LGDS to 7.0.1-beta.1 --- package.json | 2 +- yarn.lock | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index 7e65cc7cb46..e55ce91ff5d 100644 --- a/package.json +++ b/package.json @@ -21,7 +21,7 @@ "build:css": "build-sass app/assets/stylesheets/*.css.scss --load-path=node_modules/@18f/identity-design-system/packages --out-dir=app/assets/builds" }, "dependencies": { - "@18f/identity-design-system": "^7.0.0", + "@18f/identity-design-system": "^7.0.1-beta.1", "@babel/core": "^7.20.7", "@babel/preset-env": "^7.15.6", "@babel/preset-react": "^7.14.5", diff --git a/yarn.lock b/yarn.lock index 5c0497b7839..bcb993f9db4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2,10 +2,10 @@ # yarn lockfile v1 -"@18f/identity-design-system@^7.0.0": - version "7.0.0" - resolved "https://registry.yarnpkg.com/@18f/identity-design-system/-/identity-design-system-7.0.0.tgz#ea57464f6407eb74122dcd3d3deaaa923f565032" - integrity sha512-rLw1oTK7qzGw+A2B7gYLjEOqX49MOkbe/yyK3M8e+DXpqFOxU1/GjxVzVOr/RuyzhsOeoIT+//xaqPr4dxZA5Q== +"@18f/identity-design-system@^7.0.1-beta.1": + version "7.0.1-beta.1" + resolved "https://registry.yarnpkg.com/@18f/identity-design-system/-/identity-design-system-7.0.1-beta.1.tgz#58647efedf11a16bd4fa8f0d28715d5182641346" + integrity sha512-blJhBPG7QXZH3B8CaMR95DWDfRDy9KLYKUkJzgzUkN+w5NVUovJmdv1B/SaEw6Vvr8cBV1/Ovo1h/jLq50+mPA== dependencies: "@uswds/uswds" "^3.4.1" From 0fec4d24bb534fd1665ad0f7b9b63d920cc69653 Mon Sep 17 00:00:00 2001 From: Andrew Duthie Date: Fri, 5 May 2023 08:53:57 -0400 Subject: [PATCH 16/16] Update to LGDS 7.0.1 stable --- package.json | 2 +- yarn.lock | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index e55ce91ff5d..93ff8e877a3 100644 --- a/package.json +++ b/package.json @@ -21,7 +21,7 @@ "build:css": "build-sass app/assets/stylesheets/*.css.scss --load-path=node_modules/@18f/identity-design-system/packages --out-dir=app/assets/builds" }, "dependencies": { - "@18f/identity-design-system": "^7.0.1-beta.1", + "@18f/identity-design-system": "^7.0.1", "@babel/core": "^7.20.7", "@babel/preset-env": "^7.15.6", "@babel/preset-react": "^7.14.5", diff --git a/yarn.lock b/yarn.lock index bcb993f9db4..766a6bbeba0 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2,10 +2,10 @@ # yarn lockfile v1 -"@18f/identity-design-system@^7.0.1-beta.1": - version "7.0.1-beta.1" - resolved "https://registry.yarnpkg.com/@18f/identity-design-system/-/identity-design-system-7.0.1-beta.1.tgz#58647efedf11a16bd4fa8f0d28715d5182641346" - integrity sha512-blJhBPG7QXZH3B8CaMR95DWDfRDy9KLYKUkJzgzUkN+w5NVUovJmdv1B/SaEw6Vvr8cBV1/Ovo1h/jLq50+mPA== +"@18f/identity-design-system@^7.0.1": + version "7.0.1" + resolved "https://registry.yarnpkg.com/@18f/identity-design-system/-/identity-design-system-7.0.1.tgz#5303dbf27aff48b5ed14cffd6e21cc39d44595e5" + integrity sha512-5KblBGmHLrsLGsF0cCThnkBWG0ZK+sP9NQln4FyEYXs0dzzGr0duhtqnMfGUZr6dj6ziZZjFCTmP8WNlkkpclA== dependencies: "@uswds/uswds" "^3.4.1"