Skip to content

[css-backgrounds-3] Define properties with animation type #8417

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Feb 27, 2023
Merged

[css-backgrounds-3] Define properties with animation type #8417

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
ddbdc4e
[css-backgrounds-3] Define properties with animation type
cdoublev Feb 8, 2023
df4bb62
Merge branch 'main' into animation-type-issue-2
tabatkins Feb 27, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
32 changes: 10 additions & 22 deletions css-backgrounds-3/Overview.bs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -104,18 +104,6 @@ Value Definitions</h3>
also accept the <a>CSS-wide keywords</a> as their property value.
For readability they have not been repeated explicitly.

<h3 id=animations>Animated Values</h3>

<p><!-- <a href="http://www.w3.org/Style/CSS/Tracker/issues/210">ISSUE-210.]</a> -->
It is expected that CSS will include ways to
animate transitions between styles. (The
section <a href="https://www.w3.org/TR/css-transitions-1/#animatable-types">“Animation of property types”</a>
of the <cite>CSS Transitions
module</cite> [[CSS3-TRANSITIONS]] is expected to define how different
kinds of values are interpolated during a transition.) In anticipation
of that, this module includes a line “Animatable” for each property,
which specifies whether and how values of the property can be animated.

<h2 id="backgrounds">
Backgrounds</h2>

Expand Down Expand Up @@ -1221,7 +1209,7 @@ Applies to: all elements except [=ruby base containers=] and [=ruby annotation c
Inherited: no
Percentages: N/A
Computed value: see individual properties
Animatable: see individual properties
Animation Type: see individual properties
</pre>

<p>These properties set the foreground color of the border specified
Expand Down Expand Up @@ -1383,7 +1371,7 @@ Applies to: all elements except [=ruby base containers=] and [=ruby annotation c
Inherited: no
Percentages: N/A
Computed value: absolute length, [=snapped as a border width=]; zero if the border style is ''border-style/none'' or ''hidden''
Animatable: by computed value
Animation Type: by computed value
</pre>

<pre class="propdef">
Expand All @@ -1394,7 +1382,7 @@ Applies to: all elements except [=ruby base containers=] and [=ruby annotation c
Inherited: no
Percentages: see individual properties
Computed value: see individual properties
Animatable: see individual properties
Animation Type: see individual properties
</pre>

<p>These properties set the thickness of the border.
Expand Down Expand Up @@ -1436,7 +1424,7 @@ Applies to: all elements except [=ruby base containers=] and [=ruby annotation c
Inherited: no
Percentages: N/A
Computed value: see individual properties
Animatable: see individual properties
Animation Type: see individual properties
</pre>

<p>This is a shorthand property for setting the width, style, and
Expand All @@ -1451,7 +1439,7 @@ Applies to: all elements except [=ruby base containers=] and [=ruby annotation c
Inherited: no
Percentages: N/A
Computed value: see individual properties
Animatable: see individual properties
Animation Type: see individual properties
</pre>

<p>The 'border' property is a shorthand property for setting the same width,
Expand Down Expand Up @@ -1526,7 +1514,7 @@ Applies to: all elements (but see prose)
Inherited: no
Percentages: Refer to corresponding dimension of the <a>border box</a>.
Computed value: pair of computed <<length-percentage>> values
Animatable: by computed value
Animation Type: by computed value
</pre>

<pre class=propdef>
Expand All @@ -1537,7 +1525,7 @@ Applies to: all elements (but see prose)
Inherited: no
Percentages: Refer to corresponding dimension of the <a>border box</a>.
Computed value: see individual properties
Animatable: see individual properties
Animation Type: see individual properties
</pre>

<p>The two <<length-percentage>> values of the 'border-*-radius'
Expand Down Expand Up @@ -2226,7 +2214,7 @@ Applies to: See individual properties
Inherited: no
Percentages: N/A
Computed value: See individual properties
Animatable: See individual properties
Animation Type: See individual properties
</pre>

<p>This is a shorthand property for setting 'border-image-source',
Expand Down Expand Up @@ -2711,7 +2699,7 @@ Changes since the 24 July 2012 Candidate Recommendation</h3>
<li>Clarified how ''background-attachment: local'' is affected by scrolling.
<li>Simplified computed value of 'background-position'
to clarify that all 'background-position' values are interpolable.
<li>Added “Animatable” values to each property definition table.
<li>Added “Animation Type” values to each property definition table.
</ul>

<h3 id="changes-2012-04">
Expand Down Expand Up @@ -2841,7 +2829,7 @@ Candidate Recommendation</a>:
definition of keywords.
<li><a href="#animations">Section 2.3</a> (and all property definitions):
Added a section about expected an expected animations module.
Added "Animatable" line to property definition tables.
Added "Animation Type" line to property definition tables.
<li><a href="#the-background-position">Section 3.6</a>:
Renamed &lt;bg-position&gt; production to <i>&lt;position&gt;</i> for
easier re-use in other specifications and recast the grammar to be more
Expand Down