Skip to content

Commit

Permalink
add start of polygon vertex rounding
Browse files Browse the repository at this point in the history
  • Loading branch information
astearns committed Sep 11, 2024
1 parent 5571070 commit ce3f2ac
Showing 1 changed file with 26 additions and 5 deletions.
31 changes: 26 additions & 5 deletions css-shapes-1/Overview.bs
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ Abstract: CSS Shapes describe geometric shapes for use in CSS. For Level 1, CSS
<pre class='link-defaults'>
spec:css2; type:property; text:margin
spec:css-backgrounds-3; type:property; text:border-radius
spec:css-inline; type:dfn; text:initial letter box
spec:css-masking-1; type: value
text: nonzero
text: evenodd
Expand Down Expand Up @@ -352,7 +353,8 @@ Supported Shapes</h3>
)
<<polygon()>> = polygon(
<<'fill-rule'>>? ,
<<'fill-rule'>>?
[ round <<length>> ]? ,
[<<length-percentage>> <<length-percentage>>]#
)
Expand Down Expand Up @@ -461,7 +463,7 @@ Supported Shapes</h3>
* The <<radial-size>> argument defines
the circle's radius.
Rather than referring to the [=gradient box=],
values are resolved against the [=<basic-shape>/reference box=].
values are resolved against the [=reference box=].

* Two <<length-percentage>> values are invalid.

Expand All @@ -475,7 +477,7 @@ Supported Shapes</h3>
* The <<radial-size>> argument defines
the horizontal and vertical radiuses of the ellipse.
Rather than referring to the [=gradient box=],
values are resolved against the [=<basic-shape>/reference box=].
values are resolved against the [=reference box=].

* The <<position>> argument defines
the center of the ellipse.
Expand All @@ -488,10 +490,29 @@ Supported Shapes</h3>
to determine the interior
Defaults to ''nonzero'' if omitted.

* An optional <<length>> after a <css>round</css> keyword
defines rounding for each vertex of the polygon.
The length is the radius of a circle
whose center lies on the bisector
of the smaller angle of the vertex,
and that is tangential
to both sides of the vertex.

To avoid rounding more
than half of any line segment,
the rounding of each vertex
must be clamped separately
such that the radius is never more than
the smaller of <code>tan(angle/2) segment / 2</code>
evaluated against both vertex line segments.


Note: vertex rounding needs examples and tests.

* Each <<length-percentage>> pair
specifies a vertex of the polygon,
as a horizontal and vertical offset
from the left and top edges of the [=<basic-shape>/reference box=].
from the left and top edges of the [=reference box=].

The UA must close a polygon
by connecting the last vertex
Expand Down Expand Up @@ -1129,7 +1150,7 @@ Change Log</h2>
Since <a href="https://www.w3.org/TR/2022/CRD-css-shapes-1-20221115/">15 November 2022</a></h3>

<ul>
<li></li>
<li>Added vertex rounding for polygon() for <a href="https://github.com/w3c/csswg-drafts/issues/9843">issue #9843</a> </li>
</ul>

<h3 class="no-num" id="20140320">
Expand Down

0 comments on commit ce3f2ac

Please sign in to comment.