WordPress.org

Make WordPress Core

Opened 6 years ago

Closed 6 years ago

#11502 closed defect (bug) (fixed)

Some buttons have gone square in 2.9

Reported by: caesarsgrunt Owned by: azaozz
Milestone: 2.9.1 Priority: normal
Severity: major Version: 2.9
Component: UI Keywords:
Focuses: Cc:

Description

After upgrading some of my live sites to 2.9, I see that some of the buttons have gone square with slightly rounded corners, as opposed to the capsule buttons which 2.8 had everywhere.

The change is not global, nor is there any apparent rule as to which buttons are square and which round - see attached screenshots.

The change did not appear at any point during the 2.9 beta and RC process - yesterday's nightly didn't even have it, so far as I am aware.

The buttons are now inconsistent throughout WP, and as a result the change is highly counter-intuitive and confusing.

Attachments (5)

11502 - Dashboard.png (41.1 KB) - added by caesarsgrunt 6 years ago.
Dashboard (all round)
11502 - Edit Posts.png (43.1 KB) - added by caesarsgrunt 6 years ago.
Edit Post - inconsistent
11502 - New Post.png (43.0 KB) - added by caesarsgrunt 6 years ago.
New Post - Inconsistent
11502 - Update.png (39.3 KB) - added by caesarsgrunt 6 years ago.
Update - Inconsistent
11502.diff (398 bytes) - added by caesarsgrunt 6 years ago.

Download all attachments as: .zip

Change History (30)

@caesarsgrunt6 years ago

Dashboard (all round)

@caesarsgrunt6 years ago

Edit Post - inconsistent

@caesarsgrunt6 years ago

New Post - Inconsistent

@caesarsgrunt6 years ago

Update - Inconsistent

comment:1 @caesarsgrunt6 years ago

Not even major action buttons (the blue ones) are one consistently the same shape - compare the publish buttons on QuickPress and New Post...

comment:2 @caesarsgrunt6 years ago

Seems to be caused by a conflict between

.submit input, .button, .button-primary, .button-secondary, .button-highlighted, #postcustomstuff .submit input {
    -moz-border-radius-bottomleft:11px;
    -moz-border-radius-bottomright:11px;
    -moz-border-radius-topleft:11px;
    -moz-border-radius-topright:11px;
    ...

and

textarea, input[type="text"], input[type="password"], input[type="file"], input[type="button"], input[type="submit"], input[type="reset"], select {
    -moz-border-radius-bottomleft:4px;
    -moz-border-radius-bottomright:4px;
    -moz-border-radius-topleft:4px;
    -moz-border-radius-topright:4px;
    ...

on line 379 and line 1, respectively, of admin.dev.css

comment:3 @caesarsgrunt6 years ago

Specifically, the latter snippet shouldn't apply to input[type="button"], input[type="submit"], input[type="reset"].

comment:4 @caesarsgrunt6 years ago

Introduced in changeset [12448] / [12449].

@caesarsgrunt6 years ago

comment:5 follow-ups: @caesarsgrunt6 years ago

  • Keywords has-patch added; needs-patch removed

Patch fixes the bug by removing the offending selectors.

(Side note : As it happens, I prefer the square buttons... but the shape should be consistent, and should not be changed without discussion.)

comment:6 in reply to: ↑ 5 @scribu6 years ago

Replying to caesarsgrunt:

Patch fixes the bug by removing the offending selectors.

(Side note : As it happens, I prefer the square buttons... but the shape should be consistent, and should not be changed without discussion.)

Tested the patch on Firefox 3.5 and Chrome latest.

I also like the square buttons more.

comment:7 @caesarsgrunt6 years ago

Thanks Scribu.

Also tested in Firefox 3.5 and Safari 4. Better test in Opera, I guess, since [12448] / [12449] was intended to fix a bug in Opera... Haven't go t time now but will test later.

comment:8 in reply to: ↑ 5 ; follow-up: @westi6 years ago

  • Owner set to azaozz
  • Status changed from new to assigned

Replying to caesarsgrunt:

Patch fixes the bug by removing the offending selectors.

(Side note : As it happens, I prefer the square buttons... but the shape should be consistent, and should not be changed without discussion.)

Indeed I believe the change was introduced by accident and we should switch this back to the rounded buttons for 2.9.1

comment:9 @caesarsgrunt6 years ago

  • Keywords commit added

Also now tested in Opera 10.

comment:10 in reply to: ↑ 8 @hakre6 years ago

Replying to westi:

Replying to caesarsgrunt:

Patch fixes the bug by removing the offending selectors.

(Side note : As it happens, I prefer the square buttons... but the shape should be consistent, and should not be changed without discussion.)

Indeed I believe the change was introduced by accident and we should switch this back to the rounded buttons for 2.9.1

You shure? The finer rounded-corner buttons were introduced for 2.9 weren't they? I thought this is one of the visual changes for the release.

comment:11 @caesarsgrunt6 years ago

This was certainly introduced by[12448] / [12449], and I'm fairly sure it was unintentional since it isn't mentioned in the commit description and nor is a ticket linked to which describes the change. Also, the change is not universal; it just depends on the type of button within the html and not on what the button does.

comment:12 @hakre6 years ago

azaozz should know and be able to clarify.

comment:13 @azaozz6 years ago

(In [12463]) Round back the buttons, see #11502

comment:14 @azaozz6 years ago

It wasn't intentional, sorry about that (some browsers really hate to update styles despite that all caches are disabled).

@caesarsgrunt removing these selectors would leave buttons without classes unstyled, better to make sure we apply the classes properly.

Can you confirm thunk looks as it should, before adding this to the 2.9 branch. Don't want to repeat the same mistake :)

comment:15 @scribu6 years ago

Working in trunk, but you busted the cache for globa.css instead of for wp-admin.css :)

comment:16 @azaozz6 years ago

  • Resolution set to fixed
  • Status changed from assigned to closed

(In [12474]) Round back the buttons, fixes #11502

comment:17 follow-ups: @caesarsgrunt6 years ago

  • Keywords has-patch commit removed
  • Resolution fixed deleted
  • Status changed from closed to reopened

Still getting square buttons in 2.9.1.
Yes, I've cleared my cache.

comment:18 in reply to: ↑ 17 ; follow-up: @scribu6 years ago

Replying to caesarsgrunt:

Still getting square buttons in 2.9.1.
Yes, I've cleared my cache.

A little more details wouldn't hurt: browser, os, which admin page(s) etc.

comment:19 in reply to: ↑ 18 ; follow-up: @caesarsgrunt6 years ago

Replying to scribu:

A little more details wouldn't hurt: browser, os, which admin page(s) etc.

Browser: Firefox 3.5, Safari 4.0, Chrome 4.0...
OS: Doesn't make any difference, but if you're interested it's OS X 10.6.2.
Which pages: See the original ticket and screenshots.

Happy? :-p

comment:20 @caesarsgrunt6 years ago

And before you ask; WP latest nightly as of 22nd Dec at 14:00 GMT.

comment:21 in reply to: ↑ 19 @scribu6 years ago

Replying to caesarsgrunt:

Replying to scribu:

A little more details wouldn't hurt: browser, os, which admin page(s) etc.

Browser: Firefox 3.5, Safari 4.0, Chrome 4.0...
OS: Doesn't make any difference, but if you're interested it's OS X 10.6.2.
Which pages: See the original ticket and screenshots.

Happy? :-p

Yes, thanks. :P

comment:22 @ryan6 years ago

(In [12496]) Bump wp-admin css ver. see #11502

comment:23 in reply to: ↑ 17 @azaozz6 years ago

Replying to caesarsgrunt:

Still getting square buttons in 2.9.1.
Yes, I've cleared my cache.

Perhaps you're caught in the same "strange" behaviour that brought this bug. Quitting FF and deleting the cache manually would fix that.

comment:24 @bi0xid6 years ago

Just tested nightly build 3.0-alpha. It's working in dashboard, edit post, upgrade and new post.

Add New button in Write new post seems to use another font. (add-new-h2 class?)

Cannot upload image, TRAC says upload is broken :(

comment:25 @caesarsgrunt6 years ago

  • Resolution set to fixed
  • Status changed from reopened to closed

Working in latest nightly as of 23rd Dec.

Note: See TracTickets for help on using tickets.