WordPress.org

Make WordPress Core

Opened 6 years ago

Closed 6 years ago

Last modified 6 years ago

#27778 closed defect (bug) (fixed)

Feature pointer problems in RTL and in color schemes

Reported by: nacin Owned by: nacin
Milestone: 3.9 Priority: low
Severity: minor Version:
Component: Help/About Keywords: has-patch commit
Focuses: ui, rtl Cc:

Description

  • RTL issue: The arrow:before needs something like transform: rotate(180deg).
  • Color scheme issue: he outer border is the default blue when it needs to be some kind of color scheme color.
  • RTL placement issue: Seems my themes.php pointer from #27777. Looks off-center. It's not pointing at the correct edge. This could be an issue with my logic in [28090], but let's try to deal with it here.

Attachments (5)

Screen Shot 2014-04-12 at 3.54.01 PM.png (41.6 KB) - added by nacin 6 years ago.
27778.themes-screen-layout.png (835.6 KB) - added by SergeyBiryukov 6 years ago.
27778.diff (419 bytes) - added by ryelle 6 years ago.
27778.2.diff (1.3 KB) - added by SergeyBiryukov 6 years ago.
27778.3.diff (1.7 KB) - added by ocean90 6 years ago.

Download all attachments as: .zip

Change History (18)

#1 @nacin
6 years ago

Screenshot uploaded demonstrating all three issues.

#2 @nacin
6 years ago

Asked ryelle to look into this, but if anyone is able to help, please do.

#3 follow-up: @SergeyBiryukov
6 years ago

I also see an issue with Themes screen layout in RTL in Firefox: 27778.themes-screen-layout.png.

@ryelle
6 years ago

#4 @ryelle
6 years ago

27778.diff adds the border color to _admin.scss, so each color scheme defines that border color.

I think the pointer issue is something being flipped when it shouldn't be in wp-pointer.css, I can look at it later tonight or tomorrow if no one else has gotten to it.

#5 in reply to: ↑ 3 @SergeyBiryukov
6 years ago

  • Focuses rtl added

Replying to SergeyBiryukov:

I also see an issue with Themes screen layout in RTL in Firefox: 27778.themes-screen-layout.png.

Moved to a separate ticket: #27779.

#6 @SergeyBiryukov
6 years ago

27778.2.diff fixes the arrow positioning for me (but not the pointer positioning).

#7 @nacin
6 years ago

In 28098:

Fix feature pointer border when using a color scheme.

props ryelle.
see #27778.

#8 follow-up: @nacin
6 years ago

I don't really care about pointer positioning, as it's not off by much. Let's just resolve he pointer styling issue.

At least on chrome in LTR, margin-left: -14px; for .wp-pointer-left .wp-pointer-arrow:before seems to break it.

@ocean90
6 years ago

#9 @ocean90
6 years ago

  • Keywords has-patch commit added; needs-patch removed

27778.3.diff includes the CSS changes by SergeyBiryukov from 27778.2.diff. For the RTL positioning I simply set my to right-13px. That makes it look the same as in LTR.
I also changed the align value for the customize.php selector. It looks a bit off if the pointer links to the top edge. If it was by design, we can revert this change.

#10 @nacin
6 years ago

For whatever reason it was pointing at the bottom edge for me. Your patch seems to work now. I was probably just tired.

The Dismiss x-it is off by a pixel, so handling that too.

Thanks everyone!

#11 @nacin
6 years ago

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

In 28107:

Fix feature pointer RTL placement.

props SergeyBiryukov, ocean90.
fixes #27778.

#12 in reply to: ↑ 8 @georgestephanis
6 years ago

Replying to nacin:

I don't really care about pointer positioning, as it's not off by much. Let's just resolve he pointer styling issue.

At least on chrome in LTR, margin-left: -14px; for .wp-pointer-left .wp-pointer-arrow:before seems to break it.

It looks like [28107] actually broke .wp-pointer-right for normal LTR --

https://i.cloudup.com/7xng_FG6KB.png

If I switch it back to 14px, it looks correct. Have not tested it against RTL, though, merely speaking for pointer-right in LTR.

https://i.cloudup.com/QNIAzasT4Z.png

@nacin -- Would you prefer to reopen, or should I make a new ticket?

Last edited 6 years ago by georgestephanis (previous) (diff)

#13 @nacin
6 years ago

This ticket was closed on a completed milestone.
If you have a bug or enhancement to report, please open a new ticket. Be sure to mention this ticket, #27778.

Note: See TracTickets for help on using tickets.