search

eBay / skin

Pure CSS framework designed & developed by eBay for a branded, e-commerce marketplace.
https://ebay.github.io/skin/
MIT License
178 stars 67 forks source link

230913 - Update image corner radius scaling #2153

Closed ratinsl closed 5 months ago

ratinsl commented 1 year ago

@saiponnada and I realized that the corner radius of images needs to be adjusted to match our radius strategy. Currently, it looks like the corner radius is 8px across all images - first spotted on the home page item tiles.

Image Corner Radius should follow:

image

Link to Figma documentation.

ianmcburnie commented 1 year ago

For fully responsive behavior, this will require CSS container queries, which not all browsers support. However, I think this is something we could consider as a progressive enhancement, i.e. in those browsers that do support it, they will get see the correct border radius as the container size changes, for those browsers that don't they will see a fixed border radius.

https://developer.mozilla.org/es/docs/Web/CSS/CSS_Container_Queries#