CSS Chat Agenda: July 29, 2021

This is the agenda for the upcoming CSSCSS Cascading Style Sheets. meeting scheduled for Thursday July 29 at 21:00PM UTC. The meeting will be held in the #core-css channel in the Making WordPress SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/..

If there’s any topic you’d like to discuss, please leave a comment below!

#agenda, #core-css

CSS Chat Summary: 22 July 2021

The meeting took place here on Slack. @notlaura facilitated and @danfarrow wrote up these notes.

Housekeeping

  • No housekeeping items this week

Custom Properties (#49930)

  • @notlaura shared some background on the project for new participants and suggested another session of individual work time
  • @notlaura added a note to the trac ticket indicating who has “claimed” particular coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. CSSCSS Cascading Style Sheets. files

30 or so minutes later…

  • @Dave Ryan reported having made solid progress on login.css & finding some near-duplicate shades of blue, for which he added new custom properties. Work on colour unification can come later
  • @notlaura had a similar experience with shades of grey and agreed with the approach. @Dave Ryan added a note about it to the shared doc

CSS Link Share / Open Floor

Thanks everyone!

#core-css, #summary

CSS Chat Summary: 15 July 2021

The meeting took place here on Slack. @notlaura facilitated and @danfarrow wrote up these notes.

Housekeeping

  • @notlaura wondered how we could encourage participation at the chats, and get more help with the Custom Properties project. She suggested maybe some guidelines on how to get started contributing
  • @danfarrow offered to add some notes to the shared document
  • @notlaura also suggested a “Call for CSSCSS Cascading Style Sheets. contributors” Make post linking to the shared document and offered to work on writing that

Custom Properties (#49930)

  • @notlaura suggested spending some time working individually on the project which is something we’ve tried at previous meetings with great success

20 minutes later…

  • @notlaura used the time to write a draft of the previously mentioned Make post
  • @danfarrow started updating forms.css noting that some custom properties have a longer ancestry e.g. --wp-admin--button--text takes its value from --wp-admin--button-primary, which in turn takes its value from --wp-admin--theme--primary. He speculated that tooling could make it easier to traverse & understand this hierarchy

CSS Link Share / Open Floor

Thanks everyone!

#core-css, #summary

CSS Chat Agenda: July 22, 2021

This is the agenda for the upcoming CSSCSS Cascading Style Sheets. meeting scheduled for Thursday July 22 at 21:00PM UTC.

The meeting will be held in the #core-css channel in the Making WordPress SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/..

  • Housekeeping
  • Custom Properties (#49930)
    • Discussion as needed
    • Work time
  • Open Floor + CSS Link Share

If there’s any topic you’d like to discuss, please leave a comment below!

#agenda, #core-css

CSS Chat Summary: 08 July 2021

The meeting took place here on Slack. @ryelle facilitated and @danfarrow wrote up these notes.

Housekeeping

Discussion: Custom Properties (#49930)

  • @ryelle has updated her PR with some custom-property additions to common.css
  • @ryelle observed that a small subset of custom-properties are getting used very often, noting “…while it feels like a lot of variables to be adding, we also use the same concepts in many places”. For example:
--wp-admin--surface--background: #fff;
--wp-admin--surface--background-alternate: #f6f7f7;
--wp-admin--surface--border: #c3c4c7;
--wp-admin--surface--border-alternate: #f0f0f1;
  • @colorful-tones had a question about a particular chunk of core CSS defining somme custom-properties being loaded from multiple unique sources which seems redundant
  • @ryelle clarified that it’s added from a SASS mixin in base-styles and she thinks its there to allow each package to be standalone
  • We agreed that it does feel somewhat redundant when multiple packages are used together. Possibly it’s something that could be improved in future with coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. custom-properties

CSSCSS Cascading Style Sheets. Link Share / Open Floor

  • @ryelle shared a comment on the CSS deprecation ticketticket Created for both bug reports and feature development on the bug tracker. (#53070) that she wants to reply to. This led to a discussion about CSS deprecation which covered some of the following:
    • A wider discussion about CSS backwards compatibility needs to happen
    • Some kind of tooling might help to address the issue
    • In the ticket comment, @tellthemachines comments that, as moving redundant CSS into a deprecated.css file doesn’t offer a performance boost, it would be simpler to move it to a /* Deprecated */ section at the end of its file. @colorful-tones disagreed, noting that it deprecated.css existed it could be dequeued for a performance boost. @ryelle asked what would then happen if you installed a pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party that uses a deprecated style
    • @colorful-tones agreed with JJJs comment, adding that “Plugin developers need to keep up with changes. If their plugin breaks then it is on them to update.”
    • @ryelle noted that the deprecation issue centres more on “elements that don’t exist in core anymore but a plugin could be using that markup & expecting the CSS to just be there”
    • @colorful-tones observed that multiple deprecation paths might be needed for the various sources of CSS, which @ryelle summarised as theme CSS (the Twentys styles), wp-admin CSS (all the files in wp-admin/css and wp-includes/css) and 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/ CSS (“technically a subset of wp-admin CSS but also its own thing”)
    • @colorful-tones expressed support for the approach recommended in the TracTrac An open source project by Edgewall Software that serves as a bug tracker and project management tool for WordPress. ticket: “Create deprecated.css and perhaps even start appending --deprecated-5.8 to classes that are deprecated.”

With that we were out of time. Thanks everyone!

#core-css, #summary

CSS Chat Agenda: July 15, 2021

This is the agenda for the upcoming CSSCSS Cascading Style Sheets. meeting scheduled for Thursday July 15 at 21:00PM UTC.

The meeting will be held in the #core-css channel in the Making WordPress SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/..

  • Housekeeping
  • Discussion: Custom Properties (#49930)
    Continue discussing the workflow for adding Custom Properties to coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress..
  • Open Floor + CSS Link Share

If there’s any topic you’d like to discuss, please leave a comment below!

#agenda, #core-css

CSS Chat Agenda: July 8, 2021

This is the agenda for the upcoming CSSCSS Cascading Style Sheets. meeting scheduled for Thursday July 8 at 21:00PM UTC.

The meeting will be held in the #core-css channel in the Making WordPress SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/..

  • Housekeeping
  • Discussion: Custom Properties (#49930)
    Continue discussing the workflow for adding Custom Properties to coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress..
  • Open Floor + CSS Link Share

If there’s any topic you’d like to discuss, please leave a comment below!

#agenda

CSS Chat Agenda: July 1, 2021

This is the agenda for the upcoming CSSCSS Cascading Style Sheets. meeting scheduled for Thursday July 1 at 21:00PM UTC.

The meeting will be held in the #core-css channel in the Making WordPress SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/..

  • Housekeeping
  • Discussion: Custom Properties (#49930)
    Continue discussing the workflow for adding Custom Properties to coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress..
  • Open Floor + CSS Link Share

If there’s any topic you’d like to discuss, please leave a comment below!

#agenda

CSS Chat Summary: 24 June 2021

The meeting took place here on Slack. @danfarrow facilitated and wrote up these notes.

Housekeeping

Discussion: Custom Properties (#49930)

hsl colours exploration

--wp-admin--color-neutral-h: 0;
--wp-admin--color-neutral-s: 0%;
--wp-admin--color-neutral-l: 100%;
--wp-admin--color-neutral-hsl:
   var(--wp-admin-color-neutral-h),
   var(--wp-admin-color-neutral-s),
   var(--wp-admin-color-neutral-l));
  • @ryelle pointed out that, as the WordPress colour palette doesn’t follow hsl we would need 3 distinct variables for each colour
  • @colorful-tones expressed a wish to see the core palette streamlined to the central column of colours and then for the other values to be generated using hsl variants using a core set of custom-properties, or new colours altogether
  • @ryelle reported having explored implementing dark mode by inverting colour values e.g. neutral-100 becomes neutral-0, but the results were unsatisfactory
    6
  • Perhaps the upcoming lch CSS colour feature will more readily enable this kind of approach

Crossover with editor (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/) custom-properties

  • @joyously asked if the custom-properties would apply to the UIUI User interface editor, and if the custom-property naming would follow the same convention
  • @ryelle clarified that currently the editor generates custom-properties like --wp-admin-theme-color for each colour scheme. These properties names will hopefully eventually converge with the new Custom Properties we are proposing

Performance

  • @joyously & @colorful-tones wondered if a large number of custom-properties could slow down browsers
  • @ryelle suggested that unchanging custom properties (which ours will mostly be) are less likely to have a negative impact

Workflow

  • @notlaura had asked about @ryelle’s workflow for adding custom properties has been. @ryelle clarified that she has been going through the values in common.css
  • As a way forward to working collaboratively on the PR she suggested each claiming a different file to work through

Cascading custom properties

  • @joyously asked if having many :root level properties is better than having a smaller number of properties which are then overwritten with specific selectors for each location
  • @ryelle responded that she would like to see how an inheritance based system would work
  • @danfarrow observed that the PR uses a form of inheritance by populating some properties with the values of others e.g. --wp-admin-menu--link--background--hover: var(--wp-admin-menu--background);
  • @ryelle explained that this will allow adminadmin (and super admin) schemes to set as few variables as possible, but also have the ability for more granular control if they need it
  • @joyously clarified that she was thinking more of “a small set of properties that are set for each class representing an area of the page”

CSS Link Share / Open Floor

Thanks everyone!

#core-css, #summary

CSS Chat Agenda: June 24, 2021

This is the agenda for the upcoming CSSCSS Cascading Style Sheets. meeting scheduled for Thursday June 24 at 21:00 PM UTC.

The meeting will be held in the #core-css channel in the Making WordPress SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/..

  • Housekeeping
  • Discussion: Custom Properties (#49930)
    Discuss the workflow for adding Custom Properties to coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress..
    Cross-reference with related Gutenberg discussion (thanks @colorful-tones!)
  • Open Floor + CSS Link Share

If there’s any topic you’d like to discuss, please leave a comment below!

#agenda