USWDS 2.0 beta 6 has been released. Aside from the markup changes between v1 and v2, beta 6 updates all component classes to use the BEM naming scheme. This requires a sweeping change across all templates and preprocessor functions.

I have work on a project that integrates beta 6 to the theme. I'm ready to contribute what I have, just not sure how to contribute such huge change (involves 53 added/modified/deleted files). Thoughts? Could I possibly get Git access to merge the changes?

Comments

fskreuz created an issue. See original summary.

fskreuz’s picture

Issue summary: View changes
brockfanning’s picture

@fskreuz Thanks for the heads up. Are your changes based on the newly-created 8.x-2.0-alpha1 branch of this Drupal theme? Or are they based on the 8.x-1.0-beta3 branch? Just wanted to clarify that.

But either way you are always welcome to post a patch. That may be the best way to get the conversation started.

fskreuz’s picture

It's based on 8.x-2.0-alpha1. Attached is patch.

Summary of changes:

- Changed all component classes to BEM (because beta 6 changes).
- Removed the addition of the search box. See https://www.drupal.org/project/uswds/issues/3040374
- Removed the Paragraphs edge-to-edge logic. See https://www.drupal.org/project/uswds/issues/3039814.
- Removed the Mobile Menu region. See https://www.drupal.org/project/uswds/issues/3039817

Irisibk’s picture

@fskreuz, thanks for posting the patch & for all the work you've done on this. I also have a patch for integrating the beta-6 changes which I will post up here so we can review how to merge both patches.
I am still reviewing your patch but thanks for catching the section in page.html.twig that has the page.help region commented out. That was an oversight.
I have a question about the addition on the block.html.twig template. From my understanding, this will cause all blocks to be rendered with a USWDS accordion component by default. Is that the intention?

+++ b/templates/system/block/block.html.twig
@@ -0,0 +1,56 @@
+......
+#}
+{%
+  set classes = [
+    'block',
+    'block-' ~ configuration.provider|clean_class,
+    'block-' ~ plugin_id|clean_class,
+    'usa-accordion',
+  ]
+%}
+
+{%
+  set titleClasses = [
+    'usa-accordion__heading'
+  ]
+%}
+
+<div{{ attributes.addClass(classes) }}>
+  {{ title_prefix }}
+  {% if label %}
+    <h2{{ title_attributes.addClass(titleClasses) }}>
+      <button class="usa-accordion__button">{{ label }}</button>
+    </h2>
+  {% endif %}
+  {{ title_suffix }}
+  {% block content %}
+    <div class="usa-accordion__content usa-prose">
+      {{ content }}
+    </div>
+  {% endblock %}
+</div>
Irisibk’s picture

StatusFileSize
new12.83 KB

This patch is Work-in-progress. The ideal fix for this issue should probably be a combination of both patches in #4 and #6. I'm currently working on merging them.

Irisibk’s picture

fskreuz’s picture

@Irisibk yes, that was (sort of) the intention.

I needed to style blocks with a prominent header and bounded content in a way that fits with the USWDS scheme. In Bootstrap, cards would have been the perfect component for this. However, USWDS currently doesn't have cards. The closest the library has is an uncollapsible accordion. So I went with that.

As a side-effect, this would also easily give blocks the ability to collapse content, similar to what this module does https://www.drupal.org/project/collapsiblock

I'm not married to the idea tho. We can remove that in favor of overriding block templates as needed.

Irisibk’s picture

Thanks @fskreuz, that does make sense.
Making the blocks collapsible sounds like good feature to have. I will test it further locally.

Like @brockfanning suggested in other issues, it would be great to separate out the features like disabling the search box, collapsible blocks, removing the mobile menu region etc. into patches & attach them to their respective issues so they can be reviewed individually.

Once I am done with merging the 2 patches here into one patch that reflects just the USWDS beta-6 updates, I will create a new issue for collapsible blocks and add the new block template to it. Please let me know if you have some time to upload patches into any of the existing issues. If not, when I am done with the above 2 tasks I will also go ahead and try to separate the remaining code in your patch into the other issues.

fskreuz’s picture

@Irisibk I can look into creating the patches for the other issues after your merge. This way, I can work on top of the beta-6 stuff.

fskreuz’s picture

Title: USWDS 2.0 beta6 » USWDS 2.0 beta
fskreuz’s picture

Beta 7 just released today https://v2.designsystem.digital.gov/about/releases/#version-200-beta-7-r...

And it's an RC!

Was polishing up code for another patch submission this morning when I found out about the release. Will use beta 7 going forward.

fskreuz’s picture

StatusFileSize
new57.05 KB

Took me a while to realize that it's less effort to remove unneeded code first before applying beta changes, than the other way around (update the whole theme to the new beta changes only to remove some of it in the end).

Attached is the patch of beta 6 changes and works on top of the following patches (not included in this patch):

- https://www.drupal.org/project/uswds/issues/3039814
- https://www.drupal.org/project/uswds/issues/3040374
- https://www.drupal.org/project/uswds/issues/3039817

Will update to beta 7 soon. Still reading through what changed and if any apply to the theme.

fskreuz’s picture

Status: Active » Needs review
rromore’s picture

I've applied the 3 patches in 3039814, 3040374, and 3039817 as well as #13 and haven't seen any issues so far. I also went through the release changes for the beta 7 release on https://v2.designsystem.digital.gov/about/releases/ and didn't see any breaking changes in the code with the four patches applied. Thanks @fskreuz, @irisibk, and @brockfanning for all of the work you've done!

fskreuz’s picture

StatusFileSize
new58.13 KB
new2.72 KB

Attached is another patch including fixes related to search input, form grouping, and secondary menu region placement.

fskreuz’s picture

Title: USWDS 2.0 beta » USWDS 2.0
fskreuz’s picture

Version 2.0 has been released (https://v2.designsystem.digital.gov/about/releases/). Not a lot of changes since beta 7.

Attached is the patch for 2.0. It works on top of the following, so apply these first.
- https://www.drupal.org/project/uswds/issues/3040374 (removing core search)
- https://www.drupal.org/project/uswds/issues/3039817 (removing mobile menu)

The paragraphs removal patch was removed in favor of improving it in the theme. Apply both if you use uswds_paragraphs.
- https://www.drupal.org/project/uswds_paragraphs/issues/3046140 (remove styling from uswds_paragraphs)
- https://www.drupal.org/project/uswds/issues/3046222 (styling for uswds_paragraphs)

  • fskreuz authored 7b237c7 on 8.x-2.x
    Issue #3039824 by fskreuz, Irisibk: USWDS 2.0
    
Irisibk’s picture

Status: Needs review » Fixed

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.