D8CORE-2761: reduced padding on filterby menu

[jenbreese]

READY FOR REVIEW

Summary

• Added and removed padding on the filter by menus
• The filter by menu is on news, publications, events, people
• updated the modular-spacing to the newer responsive-spacing

Review By (Date)

• When does this need to be reviewed by?

Criticality

• low

Urgency

• low

Review Tasks

Setup tasks and/or behavior to test

1. Check out this branch
2. Rebuild Cache and import config drush cr ; drush ci
3. Navigate to an example of each of the list pages
4. Verify the down caret doesn't fold under the label.
5. Try different responsive sizes.

Site Configuration Sync

• Is there a config:export in this PR that changes the config sync directory? NO

Front End Validation

• Design is approved by @ user?
• HTML validation: Is the markup using the appropriate semantic tags and passes validation? Or, QA request ticket created?
• Cross-browser testing: Has been performed? Or, QA request ticket created?
• Automated accessibility: Scans performed? Or, QA request ticket created?
• Manual accessibility: Manually tested? Or, QA request ticket created?

Backend / Functional Validation

Code

• Are the naming conventions following our standards?
• Does the code have sufficient inline comments?
• Is there anything in this code that would be hidden or hard to discover through the UI?
• Are there any code smells?
• Are tests provided? eg (unit, behat, or codeception)

Code security

• Are all forms properly sanitized?
• Any obvious security flaws or new areas for attack?

General

• Is there anything included in this PR that is not related to the problem it is trying to solve?
• Is the approach to the problem appropriate?

Affected Projects or Products

• Does this PR impact any particular projects, products, or modules?

Associated Issues and/or People

- D8CORE-2761

Resources

• AMP Tool
• Accessibility Manual Test Script
• HTML Validator
• Browserstack and link to Browserstack Credentials

[jdwjdwjdw]

I'm still seeing the down caret wrap under the label for some breakpoints. If you set the topics__collapsable-menu button to a flex display and add a margin-left: auto; to the caret, that may be a good way of addressing the issue.

[jenbreese]

@jdwjdwjdw Thanks! That idea worked perfect.

[jdwjdwjdw]

Great! Thanks @jenbreese, everything looking good now 🚀

[jenbreese]

Thanks @jdwjdwjdw. @pookmish Is it ok to merge this into 11.x?