Making WordPress.org

Opened 10 years ago

Closed 10 years ago

Last modified 13 months ago

#188 closed defect (bug) (fixed)

"Search WordPress.org" placeholder has too low contrast

Reported by: sergeybiryukov's profile SergeyBiryukov Owned by: coffee2code's profile coffee2code
Milestone: Priority: normal
Component: General Keywords: has-patch
Cc:

Description

"Search WordPress.org" placeholder in the WP.org header (see the screenshot) is barely visible on my screen. Maybe its brightness setting is too low, but perhaps the placeholder should have a higher contrast.

Attachments (1)

meta-188.png (5.4 KB) - added by SergeyBiryukov 10 years ago.

Download all attachments as: .zip

Change History (8)

#1 follow-up: @coffee2code
10 years ago

It seems that the color of the placeholder text is generally set by the browser. It looks as though you are using Firefox, which does have a poorer contrast than under Webkit.

How does this new CSS rule work for you?

#head-search input.text::-moz-placeholder { color: #ddd; }

Or let me know what color seems best. It should probably be a tad more subdued/darker than the text for text that is actually typed in.

#2 @coffee2code
10 years ago

  • Keywords reporter-feedback added

#3 in reply to: ↑ 1 @SergeyBiryukov
10 years ago

Replying to coffee2code:

How does this new CSS rule work for you?

Looks much better. I guess #fff would be more consistent with Chrome and Opera.

Also noticed that the header is broken in IE8, see #196.

#4 @SergeyBiryukov
10 years ago

  • Keywords reporter-feedback removed

#5 @coffee2code
10 years ago

  • Owner set to coffee2code
  • Resolution set to fixed
  • Status changed from new to closed

In 98:

Fix low contrast text color in search form placeholder for Firefox. Fixes #188.

This ticket was mentioned in PR #192 on WordPress/wporg-main-2022 by @adamwood.


13 months ago
#6

  • Keywords has-patch added

Fixes #188

### Screenshots

| Desktop | Tablet | Mobile |

|

| image | image | image |

### How to test the changes in this Pull Request:

1.
2.
3.

This ticket was mentioned in PR #201 on WordPress/wporg-main-2022 by @adamwood.


13 months ago
#7

The section headings in the About page need to align with the top of the adjacent body copy column

https://i0.wp.com/user-images.githubusercontent.com/1017872/217987983-24e4c5bb-6abe-4384-88fc-e0256bb32b9f.png

The font size of these headings is fluid so the margin adjustment to align the elements needs to be too.

Fixes #188

### Screenshots

| Monitor | Desktop | Tablet landscape |

|

| image | image | image |

### How to test the changes in this Pull Request:

  1. Ensure you have a page at about-2 and set the template to page-about
  2. View the page and check the alignment of the section headings at various screen sizes (design has desktop width at 1320px and monitor at 1920px). Below 782px the layout switched to stacked columns so there should be no margin set below that.
Note: See TracTickets for help on using tickets.