CSSCSS Cascading Style Sheets. Chat Summary: 26th May 2020

Full meeting transcript on Slack: https://wordpress.slack.com/archives/CQ7V4966Q/p1590699723150100

I (@notlaura) facilitated the meeting.

CSS audit updates

No CSS audit updates this week, but @joyously suggested we have a task list – perhaps we have enough direction now that updates are oriented around more concrete items vs. general updates.

Color Scheming updates

We discussed using GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ as a sandbox for color schemes since it already has PostCSS tooling setup, and it can be a good place to prototype what we would eventually change in wp-adminadmin (and super admin). @ryelle is working on a PostCSS plugin that would automate renaming colors to custom properties named based on their selectors. A current challenge is keep the property names to a reasonable length, and there may be a need for some human intervention there.

@joyously brought up some concerns with the second-level custom property names in the code-base. These “second-level names” are the variable names that would actually be used in the code-base, and the goal would be to minimize them as we figure out the conventions e.g. we can use --button-color in multiple places instead of both --super-specific-selector-button-colorand --another-super-specific-selector-button-color. The concern is that it this second level adds unnecessary complexity, and can make browser support more difficult.

@ryelle also shared some work on a high contrast color scheme shared in the a11yAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) meeting.

I mentioned that we should explicitly sync up with the design team to discuss the design tokens and how they are thinking about naming conventions and variations for the colors. I volunteered to attend the design chat this week.

Open Floor

I suggested that we conclude our CSS Chats with a recurring “Latest and greatest in CSS” knowledge share so that we can keep up with changes in the language and browser support. The intent would be simply knowledge sharing – not intent to implement new features per se, but discussing progressive enhancementenhancement Enhancements are simple improvements to WordPress, such as the addition of a hook, a new feature, or an improvement to an existing feature. / hypothetical implementation as well is welcome. We can start this next meeting!

That was all for this week!

#summary #core-css