The discussion for *progress() functions is finished, with WebKit
already supporting it and Gecko implementing.
The warning is about *mix() functions and the discussion in the issue
is about only them as well.
среда, 19 февраля 2025 г. в 20:43:15 UTC+1, dan...@microsoft.com:
The spec section https://drafts.csswg.org/css-values-5/#progress
<https://drafts.csswg.org/css-values-5/#progress> still has this
warning at the top: /“This section is an exploratory draft, and
not yet approved by the CSSWG /[Issue #6245]
<https://github.com/w3c/csswg-drafts/issues/6245>/”./
//
Scanning through the linked issue I’m unclear on whether that
warning still applies or whether the CSSWG resolved at some point
on the subset of behavior that’s proposed to ship here. Can you
help me understand the degree to which the discussion around
these has reached a conclusion? I see that there are still new
posts happening in that issue in the past week.
Thanks,
Dan
*From:*'Penelope McLachlan' via blink-dev <blink-dev@chromium.org>
*Sent:* Wednesday, February 19, 2025 10:16 AM
*To:* Daniel Bratell <bratel...@gmail.com>
*Cc:* Daniil Sakhapov <sakha...@chromium.org>; blink-dev
<blink-dev@chromium.org>; Mike Taylor <miketa...@chromium.org>;
Chromestatus <ad...@cr-status.appspotmail.com
<mailto:ad...@cr-status.appspotmail.com>>
*Subject:* [EXTERNAL] Re: [blink-dev] Intent to Ship:
Interpolation progress functional notations: CSS *progress()
functions
Some other example use cases:
- Trigger layout changes as the user scrolls for storytelling or
creative direction e.g. Create gradients that smoothly shift
colors or positions based on scroll progress or container size,
or apply filter effects like blur or saturation based on scroll
position or container dimensions, creating dynamic visual effects.
- Progress bars based on scroll position or container layout
- Adjust font sizes based on the viewport width or container
size, for example to improve readability across different screen
sizes.
e.g. h1 { font-size: calc(1rem + 2rem * media-progress(width,
320px, 1200px)); }
On Wed, Feb 19, 2025 at 6:44 AM Daniel Bratell
<bratel...@gmail.com> wrote:
I also find it a bit hard to understand what it is meant to
accomplish and how it does so. I might be missing some basic
knowledge block here, but ... why?
Maybe when the tests are updated I can look at those, but if
you were to explain this to someone like ... I don't know, a
manager, how would you explain what it does?
/Daniel
On 2025-02-19 11:34, Daniil Sakhapov wrote:
I imagine the use case example would be using e.g.
container-progress inside color(), so that you can change
the color, based on some ancestor parent's size - 'color:
rgb(container-progress(width of my-container,
var(--container-min-size), var(--container-max-size)),
..., ...);'
Ah, for some reason we don't have 'In Progress' option
for Gecko, only for Webkit, and the tool didn't copy my
comment on that here, but they are working on it.
The test is failing as there has been minor synax change
and it's been addressed on Monday, WPT hasn't been
updated yet.
вторник, 18 февраля 2025 г. в 20:24:40 UTC+1, Mike Taylor:
On 2/18/25 12:15 PM, Chromestatus wrote:
Contact emails
sakha...@chromium.org
Explainer
None
Could you describe what these features allow for
(beyond what you have in the summary), maybe with
some example code? It's not obvious to me what it
means practically to represent proportional distance
of a container feature, for example.
Specification
https://drafts.csswg.org/css-values-5/#progress
<https://drafts.csswg.org/css-values-5/#progress>
Summary
The progress(), media-progress(), and
container-progress() functional notations
represent the proportional distance of a given
value (the progress value) from one value (the
progress start value) to another value (the
progress end value). They allow drawing a
progress ratio from math functions, media
features, and container features, respectively.
Blink component
Blink>CSS
<https://issues.chromium.org/issues?q=customfield1222907:%22Blink%3ECSS%22>
TAG review
None
TAG review status
Not applicable
Risks
Interoperability and Compatibility
None
/Gecko/: No signal
Can we request one please?
/WebKit/: Shipped/Shipping
/Web developers/: Strongly positive Mostly for
calc() hacks like getting rid of units
/Other signals/:
WebView application risks
/Does this intent deprecate or change behavior of
existing APIs, such that it has potentially high
risk for Android WebView-based applications?/
None
Debuggability
None
Will this feature be supported on all six
Blink platforms (Windows, Mac, Linux,
ChromeOS, Android, and Android WebView)?
Yes
Is this feature fully tested by
web-platform-tests
<https://chromium.googlesource.com/chromium/src/+/main/docs/testing/web_platform_tests.md>?
Yes
https://wpt.fyi/css/css-values/progress-computed.tentative.html
<https://wpt.fyi/css/css-values/progress-computed.tentative.html>
https://wpt.fyi/css/css-values/media-progress-computed.tentative.html
<https://wpt.fyi/css/css-values/media-progress-computed.tentative.html>
https://wpt.fyi/css/css-values/container-progress-computed.tentative.html
<https://wpt.fyi/css/css-values/container-progress-computed.tentative.html>
These tests are all failing in Chromium. Any reason
why? Also, they shouldn't be considered tentative
tests now, correct?
Flag name on about://flags
CSSProgressNotation
Finch feature name
None
Non-finch justification
None
Requires code in //chrome?
False
Tracking bug
https://issues.chromium.org/issues/40944203
<https://issues.chromium.org/issues/40944203>
Estimated milestones
Shipping on desktop
135
Shipping on Android
135
Shipping on WebView
135
Anticipated spec changes
/Open questions about a feature may be a source
of future web compat or interop issues. Please
list open issues (e.g. links to known github
issues in the project for the feature
specification) whose resolution may introduce web
compat/interop risk (e.g., changing to naming or
structure of the API in a non-backward-compatible
way)./
None
Link to entry on the Chrome Platform Status
https://chromestatus.com/feature/5112558941634560?gate=5096732792455168
<https://chromestatus.com/feature/5112558941634560?gate=5096732792455168>
This intent message was generated by Chrome
Platform Status <https://chromestatus.com/>.
--
You received this message because you are
subscribed to the Google Groups "blink-dev" group.
To unsubscribe from this group and stop receiving
emails from it, send an email to
blink-dev+unsubscr...@chromium.org
<mailto:blink-dev+unsubscr...@chromium.org>.
To view this discussion visit
https://groups.google.com/a/chromium.org/d/msgid/blink-dev/67b4c03b.2b0a0220.399c7e.014b.GAE%40google.com
<https://groups.google.com/a/chromium.org/d/msgid/blink-dev/67b4c03b.2b0a0220.399c7e.014b.GAE%40google.com?utm_medium=email&utm_source=footer>.
--
You received this message because you are subscribed to
the Google Groups "blink-dev" group.
To unsubscribe from this group and stop receiving emails
from it, send an email to
blink-dev+unsubscr...@chromium.org
<mailto:blink-dev+unsubscr...@chromium.org>.
To view this discussion visit
https://groups.google.com/a/chromium.org/d/msgid/blink-dev/ff893886-dbfb-4404-833b-384206d8a4edn%40chromium.org
<https://groups.google.com/a/chromium.org/d/msgid/blink-dev/ff893886-dbfb-4404-833b-384206d8a4edn%40chromium.org?utm_medium=email&utm_source=footer>.
--
You received this message because you are subscribed to the
Google Groups "blink-dev" group.
To unsubscribe from this group and stop receiving emails from
it, send an email to blink-dev+unsubscr...@chromium.org
<mailto:blink-dev+unsubscr...@chromium.org>.
To view this discussion visit
https://groups.google.com/a/chromium.org/d/msgid/blink-dev/4702f132-3736-4b4d-bb41-5d52d7f33e5d%40gmail.com
<https://groups.google.com/a/chromium.org/d/msgid/blink-dev/4702f132-3736-4b4d-bb41-5d52d7f33e5d%40gmail.com?utm_medium=email&utm_source=footer>.
--
*Penny McLachlan*
(she/her)
Senior Product Manager
pjmclach...@google.com <mailto:pjmclach...@google.com>
Google Chrome
--
You received this message because you are subscribed to the
Google Groups "blink-dev" group.
To unsubscribe from this group and stop receiving emails from it,
send an email to blink-dev+unsubscr...@chromium.org
<mailto:blink-dev+unsubscr...@chromium.org>.
To view this discussion visit
https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAFuQ4YtoM_-2eu8n%3DTNZJvVKTMRTVTn4iDffHHAfVsbq1MTN7g%40mail.gmail.com
<https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAFuQ4YtoM_-2eu8n%3DTNZJvVKTMRTVTn4iDffHHAfVsbq1MTN7g%40mail.gmail.com?utm_medium=email&utm_source=footer>.
