- From: Ana Tudor via GitHub <sysbot+gh@w3.org>
- Date: Fri, 14 Jun 2024 06:31:19 +0000
- To: public-css-archive@w3.org
The number of points of the shape inside shouldn't really affect the extra points needed to cut it out of the rectangular shape. Suppose the list of coordinates creating the n-point shape inside is `px1 py1, px2 py2, ... pxn, pyn` To cut it out of the element's rectangle you need to add in extra the four corners of the rectangle going either clockwise or the other way, starting from whichever corner's closer to the start point of the shape inside (let's say `0 0, 100% 0, 100% 100%, 0 100%` - 4 extra points so far), duplicate the first corner's coordinates after that (in this case `0 0` - 5 extra points), drop in the inner shape points from before and duplicate the coordinates of the first shape point at the end (`px1 py1` - 6 extra points). This is valid for any n-point shape. --- For circles/ ellipses, I've never bothered with `clip-path`. I've always used a `radial-gradient()` mask. Something like: `mask: radial-gradient(var(--r), #0000 100%, red)` This produces a jagged circle, but it can be [smoothed out](https://x.com/anatudor/status/1797648626556227914) with a `1px` transition between fully transparent and opaque. -- GitHub Notification of comment by thebabydino Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/10445#issuecomment-2167319006 using your GitHub account -- Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Friday, 14 June 2024 06:31:20 UTC