WordPress.org

Make WordPress Core

Opened 7 years ago

Closed 7 years ago

#22248 closed defect (bug) (fixed)

Classic and Fresh admin styles are inconsistent

Reported by: melchoyce Owned by: nacin
Milestone: 3.5 Priority: low
Severity: minor Version:
Component: Administration Keywords: has-patch needs-ui audit
Focuses: Cc:
PR Number:

Description

There are a few inconsistencies between the classic and fresh admin themes that need to be brought up to speed.

Attachments (7)

22248.1.diff (1.1 KB) - added by pas5027 7 years ago.
22248.2.diff (16.9 KB) - added by melchoyce 7 years ago.
22248.3.diff (2.2 KB) - added by melchoyce 7 years ago.
22248.4.diff (6.8 KB) - added by melchoyce 7 years ago.
22248.diff (7.5 KB) - added by helenyhou 7 years ago.
22248.5.diff (7.9 KB) - added by helenyhou 7 years ago.
admin_menu_flyouts.png (81.4 KB) - added by helenyhou 7 years ago.

Download all attachments as: .zip

Change History (31)

@pas5027
7 years ago

#1 @pas5027
7 years ago

  • Keywords has-patch added

replaced 4 spaces to tabs, updated order of border rules to be consistant across classic and colors themes

#2 @helenyhou
7 years ago

  • Severity changed from normal to minor

I believe the color sheets are supposed to sync up line-for-line, with the exception of editor styles in blue (classic). If that's all that's needed to get them matching again, then hooray! If not, this might be the place to do it, although I will warn that patches may need refreshing often due to the frequency of changing code, and now that I took a quick look, is probably pretty involved. Blue could always use love, though.

Also, if we were to do a clean-up patch/commit, it might be a good time to make all the colors lowercase and shorthand where applicable as per the CSS coding standards (in the color sheets only, in this case). Just a thought. I wouldn't make a patch on that at the moment, though :)

#3 @DrewAPicture
7 years ago

  • Cc xoodrew@… added

@melchoyce
7 years ago

#4 @melchoyce
7 years ago

I went through and looked for more inconsistencies between the two stylesheets and am pretty sure I got the rest. There were a few cases where classic had some extra styles fresh doesn't have, but from what I could tell they all made sense and should stay. There were also a few elements in fresh had that were missing in classic (mostly gradients) so I went ahead and added those based on the pre-existing gradient styles.

Since I was already combing through, I also went ahead and made all of the colors lowercase/short where applicable in both stylesheets. I'm okay with going back later after more things are updated, just to make sure we continue to catch all of them. I also ended up finding a couple places in both fresh and classic where there was some odd formatting -- things with extra spaces, things without spaces that should have them, etc., so I went ahead and fixed those.

#5 @helenyhou
7 years ago

  • Component changed from UI to Administration
  • Keywords needs-ui added
  • Milestone changed from Awaiting Review to 3.5

Tossing this in to 3.5 as our usual "blue love" ticket.

#6 @nacin
7 years ago

  • Type changed from enhancement to defect (bug)

#7 @nacin
7 years ago

  • Keywords needs-refresh added

1 of 39 hunks fail.

#8 @nacin
7 years ago

In 22460:

Blue style fixes and updates. props melchoyce. see #22248.

#9 @nacin
7 years ago

  • Keywords close added; needs-refresh removed

Anything else?

#10 @melchoyce
7 years ago

There are some quick improvements I'd like to make tonight -- giving form fields blue borders, making the underlines in the "Right Now" blue, and switching the media uploader icons from grey to the blue version. Did empireoflight make blue versions of the Welcome Screen icons?

Also: props to pas5027 for taking the first pass at this patch.

#11 @melchoyce
7 years ago

Looks like both the field styles and the underlines in "Right Now" are in admin.css. Media buttons are in editor.css. Should I just leave everything as it is now? I personally find the grey lines in the blue theme pretty jarring, but I understand this is very low priority.

#12 @nacin
7 years ago

  • Priority changed from normal to low

Up to you — I would think it's probably not worth the effort.

@melchoyce
7 years ago

#13 @melchoyce
7 years ago

22248.3.diff makes some small cosmetic changes -- a few borders are changed from grey to blue.

@melchoyce
7 years ago

#14 @melchoyce
7 years ago

22248.4.diff continues to smooth some things out in classic. I transfered some border/background colors from admin.css so I could style them for classic, like the underlines in Right Now and various tab styles across the admin. I also styled input focus and autocomplete. The select fields are still a little wonky looking, but those are left mostly to browser default anyway.

If I missed anything or made an awkward choice somewhere, please let me know.

@helenyhou
7 years ago

#15 @helenyhou
7 years ago

  • Keywords commit added; close removed

Really nice work. The tab styles for blue are especially nice. The only things I caught were the autocomplete border color, select elements, and some extra unnecessary declarations for #postcustomstuff input/textarea in blue. Fixed in 22248.diff. Think it's good to go otherwise.

P.S. Can we get pas5027 props for the initial patch as well?

#16 @nacin
7 years ago

The collapsed admin menu in blue is really screwy: http://cl.ly/image/2K222G2M3Z1Z. The background should be a blue, and the text should not get the hover orange.

#17 @nacin
7 years ago

The menu tabs aren't the same color as the base of the tab: http://cl.ly/image/082a1U0J0L2S.

#18 follow-up: @nacin
7 years ago

  • Keywords commit removed

I don't think that we need to bother with removing colors and properties from wp-admin.css when moving stuff out into the colors files. Simply overriding the values in the colors files seem sufficient, even if a bit odd.

The patch seems fine, though I'm more concerned with the admin menu (see also #21998) for 3.5.

@helenyhou
7 years ago

#19 in reply to: ↑ 18 ; follow-up: @helenyhou
7 years ago

Collapsed admin menu problems happened in [21574]. Menu tabs have been that way since [16145] or [18258], seems like. Fixed in 22248.5.diff, but the collapsed header in blue has that optical illusion of overhang again that gray doesn't. Should we fix it?

Replying to nacin:

I don't think that we need to bother with removing colors and properties from wp-admin.css when moving stuff out into the colors files. Simply overriding the values in the colors files seem sufficient, even if a bit odd.

I disagree. We need to pick one way and stick to it, otherwise we end up with what's happening now - patches that move declarations back and forth, leaving less experienced contributors wondering what is wrong with us and less likely to contribute because they don't know where something is supposed to go. Some of the stuff (notably form elements) that is moving back out got moved into wp-admin.css during this cycle at some point, which should not have happened in the first place.

#20 in reply to: ↑ 19 @nacin
7 years ago

  • Keywords audit added

Replying to helenyhou:

but the collapsed header in blue has that optical illusion of overhang again that gray doesn't. Should we fix it?

Not sure I see what you mean.

#21 @helenyhou
7 years ago

I guess gray does have that overhang-look; it's just not as noticeable to me. It looks fine when it's the darker current color in both, hence my calling it an optical illusion.

http://core.trac.wordpress.org/raw-attachment/ticket/22248/admin_menu_flyouts.png

#22 @nacin
7 years ago

The corners do look more rounded in 3.5, for both schemes. I don't think I like it.

#23 @helenyhou
7 years ago

Should that be done on this ticket, or should we fix the colors up first and then look at the admin menu part separately?

#24 @nacin
7 years ago

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

In 22647:

Blue admin color scheme fixes. Fix admin menu styling. props melchoyce, helenyhou. fixes #22248.

Note: See TracTickets for help on using tickets.