Skip to content

Adding custom properties to forms.css#23

Closed
danfarrow wants to merge 4 commits into
ryelle:try/custom-propertiesfrom
danfarrow:try/custom-properties--forms-css
Closed

Adding custom properties to forms.css#23
danfarrow wants to merge 4 commits into
ryelle:try/custom-propertiesfrom
danfarrow:try/custom-properties--forms-css

Conversation

@danfarrow
Copy link
Copy Markdown

Working on adding custom properties to forms.css. I’ll move my new properties into custom-properties.css once I’ve finished adding them

Trac ticket: #49930 - Replace wp-admin color schemes with CSS custom properties


This Pull Request is for code review only. Please keep all other discussion in the Trac ticket. Do not merge this Pull Request. See GitHub Pull Requests for Code Review in the Core Handbook for more details.

@danfarrow danfarrow changed the title [WIP] Try/custom properties forms css Adding custom properties to forms.css Sep 10, 2021
@danfarrow
Copy link
Copy Markdown
Author

All hex colour values now changed to custom properties, and all custom properties moved to the bottom of custom-properties.css

I used the prefix --wp-admin--form-fields-- for most except where I found related custom-props that had already been defined in custom-properties.css. For example --wp-admin--input--color and --wp-admin--input--color--placeholder were already defined, so I added --wp-admin--input--color--disabled and --wp-admin--input--color--invalid

My strategy for deciding to either (A) use an existing custom-prop, (B) add a new custom prop aliasing an existing custom-prop or (C) use a new custom prop with the same value as an existing custom prop was a little random, so there are a couple of instances of (C) in the props I’ve added.

I’ve ignored rgba values for now!

@danfarrow danfarrow marked this pull request as ready for review September 10, 2021 17:30
textarea:focus {
border-color: #2271b1;
box-shadow: 0 0 0 1px #2271b1;
border-color: var(--wp-admin--form-fields--border--focus);
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@danfarrow is there a reason for separating --wp-admin--form-fields--border--focus and --wp-admin-theme-primary in this selector declaration?

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No there is no special reason, I think at that point I hadn’t decided whether to make aliases or not. I will try & remedy it!

@danfarrow danfarrow marked this pull request as draft September 15, 2021 05:54
@danfarrow danfarrow closed this Sep 15, 2021
@danfarrow
Copy link
Copy Markdown
Author

Closing this due to git confusion on my part. I’ve opened a new PR here #28

@danfarrow danfarrow deleted the try/custom-properties--forms-css branch September 27, 2021 12:41
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants