Make WordPress Core

Opened 12 years ago

Closed 12 years ago

Last modified 12 years ago

#26082 closed enhancement (fixed)

Enhancing Cancel Links & Dropdowns in Publish Box

Reported by: aubreypwd's profile aubreypwd Owned by: iammattthomas's profile iammattthomas
Milestone: 3.8 Priority: normal
Severity: normal Version: 3.8
Component: Administration Keywords: has-patch 2nd-opinion needs-testing
Focuses: ui Cc:

Description

While I was working on http://core.trac.wordpress.org/ticket/26081#comment:2 I noticed that the dropdowns were a bit off and the cancel links were not aligned.

https://cloudup.com/c5Ozt4QNAcr

So I did some edits and made the cancel links buttons in #####-1.patch

https://cloudup.com/ceLNSNC2A4M (Ch) and https://cloudup.com/cMkdeIfGGHl (FF)

But, if the cancel-as-links are intentional, then #####-2.patch at least fixes the alignment issues from https://cloudup.com/c5Ozt4QNAcr to https://cloudup.com/cJX52hjmyTv

This is all Chrome/Firefox it needs-testing in IE.

Attachments (2)

26082-1.patch (2.1 KB) - added by aubreypwd 12 years ago.
Modifications to dropdowns with cancel links as buttons
26082-2.patch (2.4 KB) - added by aubreypwd 12 years ago.
Modifications to dropdowns with cancel links as links more centered

Download all attachments as: .zip

Change History (5)

@aubreypwd
12 years ago

Modifications to dropdowns with cancel links as buttons

@aubreypwd
12 years ago

Modifications to dropdowns with cancel links as links more centered

#1 @SergeyBiryukov
12 years ago

  • Component changed from General to Administration
  • Keywords ui-focus added
  • Milestone changed from Awaiting Review to 3.8

#2 @iammattthomas
12 years ago

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

In 26247:

Style and positioning fixes to form elements in the Publish box:

  • Make select element text #555 to match others
  • Make Cancel links vertically align with buttons
  • Make sure the spacing between buttons and cancel links is always consistent
  • Override active button styles for responsive states so button size doesn't change when active
  • Reduce font size of date select element to match date text inputs

Fixes #26082, props aubreypwd.

#3 @iammattthomas
12 years ago

I think we've historically styled Cancel links as text rather than buttons to visually de-emphasize them, to make it more clear which is and isn't the primary action. For that reason I've used 26082-2.patch as the starting off point, with a few modifications:

  • Removed the styling from the select element, since most browsers don't allow styling selects (except for text color).
  • Set the line height on cancel links to 2 so they vertically align with buttons.
  • Unified the amount of margin between buttons and cancel links.
  • Added responsive adjustments where needed
Last edited 12 years ago by iammattthomas (previous) (diff)
Note: See TracTickets for help on using tickets.