telus / tds-core

TELUS Design System Core Components

Home Page:https://tds.telus.com/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Hairline divider not being rendered in certain conditions.

pupoxtw opened this issue · comments

Description

When using the Hairline divider in Safari for relative low resolution screens, then zoom out, the hairline divider visually disappears.

  • Tested on Safari v15.0
  • Screen resolution 1920x1080

Reproduction Steps

  1. Add any product to the cart.

  2. Go tho the checkout page.

  3. Zoom out.

  4. View the right side summary component.

  5. Zoom out.

  6. Observe how the existing Hairline dividers some times disappear.

Workaround details

Make sure there's no sub-pixel rendering issue.

Recommendation

  • No recommendation

Meta

  • TDS component version: @tds/core-hailrine-divider@2.1.0
  • Willing to develop solution: No
  • High impact: No

Screenshots

  • With default zoom level ( dividers are present )
    image

  • When zooming out ( some dividers disappear )
    image