search

aurelia / ux

A user experience framework with higher-level capabilities, designed to bring simplicity and elegance to building cross-device, rich experiences.
MIT License
366 stars 56 forks source link

Fix ripple position for rtl on ux-checkbox and ux-radio #316

Open glyad opened 4 years ago

glyad commented 4 years ago

I'm submitting a bug report

Library Version: latest

Operating System: macOS 10.15.5 Catalina

Node Version: 10.19.0

NPM Version: 6.14.6

Webpack Latest

Browser: Chrome Latest

Language: TypeScript 3.9.5

Current behaviour:

image

image

Desired behaviour:

image

image

Proposed fix:

  1. Add to ux-checkbox.css:

[dir="rtl"] .ux-checkbox .paper-ripple { right: -13px; }

[dir="rtl"] .ux-checkbox .ripple { right: -13px; }

  1. Add to ux-radio.css:

[dir="rtl"] .ux-radio .paper-ripple { right: -13px; }

[dir="rtl"] .ux-radio .ripple { right: -13px; }

glyad commented 4 years ago

Also possible to fix it adding direction: ltr !important; rule, since it has a symmetric glyph.