WordPress.org

Making WordPress.org

Opened 4 months ago

Last modified 3 months ago

#5008 new enhancement

Improve forum input fields' contrast and UI

Reported by: valentinbora Owned by:
Milestone: Priority: normal
Component: Support Forums Keywords: has-patch needs-design-feedback has-screenshots
Cc:

Description

Other areas of WordPress.org such as "Edit Forum Profile" and "Edit WP.org Profile" have input fields spanning the full width of the screen, as well as better contrast between label and field, plus their styling is nicer.

I propose improving the forum fields' styling to mostly match the other areas and improve UI experience.

Attachments (4)

5008-current.png (45.7 KB) - added by valentinbora 4 months ago.
Screenshot of the current styling of input fields on Support Forums
5008-wporg-profile.png (76.9 KB) - added by valentinbora 4 months ago.
Screenshot of the edit form for WP.org profile
5008-proposal.png (141.6 KB) - added by valentinbora 4 months ago.
New proposal for improving input fields
5008.diff (976 bytes) - added by valentinbora 4 months ago.
Patch containing the proposed changes to input fields

Download all attachments as: .zip

Change History (14)

@valentinbora
4 months ago

Screenshot of the current styling of input fields on Support Forums

@valentinbora
4 months ago

Screenshot of the edit form for WP.org profile

@valentinbora
4 months ago

New proposal for improving input fields

@valentinbora
4 months ago

Patch containing the proposed changes to input fields

#1 @valentinbora
4 months ago

  • Keywords has-patch needs-design-feedback added

#2 @valentinbora
4 months ago

  • Keywords has-screenshots added

This ticket was mentioned in Slack in #forums by dd32. View the logs.


4 months ago

This ticket was mentioned in Slack in #design by valentinbora. View the logs.


4 months ago

#5 follow-up: @tobifjellner
4 months ago

Looks good. In parallel with the increased font size, it would be good to have a possibility to select a smaller font, in order to see more of your text in one screen. Perhaps a tick box in the editing toolbar, next to "CLOSE TAGS"?

#6 in reply to: ↑ 5 @valentinbora
4 months ago

Replying to tobifjellner:

Looks good. In parallel with the increased font size, it would be good to have a possibility to select a smaller font, in order to see more of your text in one screen. Perhaps a tick box in the editing toolbar, next to "CLOSE TAGS"?

I believe the increase/decrease font size buttons in the reply editor would merit a separate ticket.

This ticket was mentioned in Slack in #design by valentinbora. View the logs.


4 months ago

This ticket was mentioned in Slack in #meta by valentinbora. View the logs.


4 months ago

This ticket was mentioned in Slack in #design by valentinbora. View the logs.


3 months ago

#10 @melchoyce
3 months ago

I would love if we could update all these form elements to match core's input elements, which were recently redesigned with color contrast in mind.

Could we even... use Gutenberg's form components on the front-end of these sites? (I understand if that's like, way, way out of scope here)

Note: See TracTickets for help on using tickets.