Problem/Motivation

Single directory components (SDC) is a new way to theme Drupal. Instead of scattering related files around your theme, they're contained to one directory. The primary issue for SDC is at #3313520: Single directory components in core.

The Demo Umami team has decided that their theme can depend on an experimental module like SDC. This allows us to have the work in this ticket merged even when #3352256: [META] Move code from the experimental SDC module to core is not committed.

Disclaimer component

The disclaimer is a custom block type and content block that appears after the footer. It displays content from two text fields: disclaimer and copyright.

Screenshot of annotated Disclaimer and Copyright

As part of SDC's roadmap (see #3345922: Single Directory Components module roadmap: the path to beta and stable), we want to convert Umami components to use SDC. For this task I'm choosing the Disclaimer component, which includes markup and CSS.

This component is a good fit because: it is a simple introduction to creating a SDC that replaces nested CSS selectors with BEM syntax and preserves block field display configuration.

This component involves the following Twig templates, CSS, assets, and libraries:

  1. disclaimer.css
  2. disclaimer.twig
  3. block--bundle--disclaimer-block.html.twig

Testing instructions

  1. Set up site with Umami profile.
  2. View page and see that disclaimer and copyright are visible below footer.
  3. Inspect markup with twig debug enabled and verify that component is being used.
  4. Modify the disclaimer block settings and verify that the component works with the different settings, such as hiding the copyright, enabling the disclaimer field label, etc.

Issue fork drupal-3365451

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

Comments

amanire created an issue. See original summary.

amanire’s picture

Issue summary: View changes
StatusFileSize
new167.27 KB
amanire’s picture

Issue summary: View changes
amanire’s picture

Issue summary: View changes
amanire’s picture

Issue summary: View changes
amanire’s picture

Status: Active » Needs review
amanire’s picture

Category: Feature request » Task
amanire’s picture

Issue summary: View changes
StatusFileSize
new133.78 KB
amanire’s picture

smustgrave’s picture

Status: Needs review » Needs work
Issue tags: +Needs Review Queue Initiative

Great to see these start to come through.

But this caused some nightwatch failures https://dispatcher.drupalci.org/job/drupal_patches/186046/console

amanire’s picture

#block-umami-branding is missing? That's very odd, since I had started working on that component first but didn't think I had committed anything and the merge request diff only shows work on the disclaimer. I'll take a closer look when I can find time.

Gauravvvv made their first commit to this issue’s fork.

gauravvvv’s picture

Status: Needs work » Needs review

Removed disclaimer.css file from libraries and added description in schema file.

smustgrave’s picture

Status: Needs review » Needs work

Seemed to cause some nightwatch failures.

amanire’s picture

Status: Needs work » Needs review

This passed testing after enabling the SDC module.

smustgrave’s picture

Status: Needs review » Reviewed & tested by the community

Applied the MR and did a fresh install of umami profile.
Verified the disclaimer appeared at the bottom with the same styling as before.

lauriii’s picture

Status: Reviewed & tested by the community » Needs review
amanire’s picture

@lauriii I assume you mean in disclaimer.component.yml? Happy to do that if you can confirm.

lauriii’s picture

@amanire Yes, that's the file I thought we should edit 👍

smustgrave’s picture

Status: Needs review » Reviewed & tested by the community

Comment was removed.

  • lauriii committed 103b774c on 11.x
    Issue #3365451 by amanire, Gauravvvv, smustgrave: Create new SDC...

  • lauriii committed 8cdd75f5 on 10.1.x
    Issue #3365451 by amanire, Gauravvvv, smustgrave: Create new SDC...
lauriii’s picture

Status: Reviewed & tested by the community » Fixed

Committed 103b774 and pushed to 11.x. Also cherry-picked to 10.1.x because Umami is internal/experimental. Thanks!

Status: Fixed » Closed (fixed)

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