CSS Chat Summary: 6 August 2020

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

I (@notlaura) facilitated the meeting.


How can we help new meeting attendees get up to speed on initiatives?

We discussed that adding a note to the top of the agendas with the ticketticket Created for both bug reports and feature development on the bug tracker. links will be helpful, and in the future, we can make improvements to the CSS Coding Standards page in the handbook.

Structure for meeting agendas

This was a check-in to see if the current meeting structure was still working for everyone, and general response was yes, though we should ensure there is enough time for open floor each meeting.

CSSCSS Cascading Style Sheets. Audit Updates

We updated the location of the doc to (though there are some permissions with this one currently): https://docs.google.com/document/d/1S21GAVYLO9unCG8a16tqlZleB9UeMqEqYeX1MLNduHA/

@tellthemachines looked into the history of coding standards and stylelint, and found the CSS Coding Standards in the handbook (same as above reference) and the stylelint configuration which is only used in 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/ at the moment. She suggested that, once this piece is finished, we post a summary of the results and outline next steps, and perhaps take it to the dev chat for more visibility. Exciting!

Color Scheming Updates

I made a very quick visualization of the top 50 colors and counts based on the data from @ryelle‘s CSS Audit tool which can be viewed here. I also checked with the design channel about what they reference for color values, and that can be a few places:

  1. What is directly used in coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.
  2. This color palette in the handbook (which is what @melchoyce uses for core designs)
  3. This color proposal from @davewhitley
  4. And the Gutenberg colors, which are a bit different

I mentioned the possibility of programmatically comparing the colors from the audit with a list of approved colors and very fittingly, @ryelle started on something along those lines! Based on this CodePen of the colors from the Handbook, @ryelle has a wonderful start at grouping and comparing colors in core against these colors. Check out the comparisons here!

We discussed the possibilities of automating the replacement of colors in a certain categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging. with “approved” colors, and that it would be challenging given some blurry lines in the categorization and ensuring appropriate contrast.

CSS Link Share

@kburgoine shared a couple of amazing CodePens – this one animation, and this one a painting in CSS! And @tellthemachines posted a link to a talk by the artist / programmer who created the painting.

I shared a link about a potential option for grid-template-rows: masonry; that could be coming in CSS.

#core-css, #summary