- From: Carlos Lopez via GitHub <sysbot+gh@w3.org>
- Date: Thu, 26 Jan 2023 03:34:02 +0000
- To: public-css-archive@w3.org
Here's my web implementation of Material Design 3 (Material You) cut corners:  Replicating Google's guidelines from here: https://m3.material.io/styles/shape/shape-scale-tokens I'm using [mask-border](https://www.w3.org/TR/css-masking-1/#propdef-mask-border) with `url(data:image/svg+xml;...` to accomplish it, which has no Firefox support. It has undersized element support. The `clip-path` route wouldn't work right for anything other than `full` because undersized elements (eg: `24px` border radius on `40px` element) would clip incorrectly. Regardless, even if I do find a solution with clip/mask, I can't use `box-shadow` and will have to use `filter: dropshadow()` for elevation. I also haven't tried getting outlines going, but it's probably going to get pretty complicated. -- GitHub Notification of comment by clshortfuse Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/6980#issuecomment-1404527433 using your GitHub account -- Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Thursday, 26 January 2023 03:34:04 UTC