kirbydesign / designsystem

Kirby Design System
https://cookbook.kirby.design
MIT License
83 stars 22 forks source link

[BUG] - Kirby avatar inconsistent between browsers #3340

Open bdunkx opened 7 months ago

bdunkx commented 7 months ago

Describe the bug

When utilizing the kirby avatar on a svg of different country flags, it can be seen that a minor part of the bottom will be cut off when using Safari. The cut off does not happen on chrome, so its only related to the Safari browser.

Describe how to reproduce the bug

  1. Go to DRB in staging in safari, preferably jyskebank.
  2. Enable both feature toggles: RE2: Enable international transfer & RE2: Enable international transfer for native
  3. Go to the 'Transfer and pay' tab.
  4. Click on the 'Transfer abroad' 5.a. Accept Terms and conditions if needed. 5.b. The icons can be seen cut off a bit at the bottom in the countries list (Germany is very visible).

Which Kirby version was used?

Kirby version: 9.0.0

What was the expected behavior?

The icons (kirby avatar) should not have any cut off in safari, but be seen as a full circle as it is viewed in chrome.

Add any screenshots

Screen Shot 2024-01-18 at 11 29 43 AM

Please complete the following information:

Are there any additional context?


Checklist:

The following tasks should be carried out in sequence in order to follow the process of contributing correctly.

Verification

To make sure the bug is not intended behaviour; it should be verified by a member of team Kirby before moving on to implementation.

Implementation

The contributor who wants to implement this issue should:

Review

Once the issue has been implemented and is ready for review: