@@ -1904,81 +1904,94 @@ Color Stop “Fixup”</h4>
19041904 ██████ ██ ██ ██ ████ ██ ███████ ██████ ███ ███
19051905-->
19061906
1907- 1D Image Values: the ''stripes()'' notation {#stripes}
1908- ======================================================
1907+ 1D Image Values: the <<image-1D>> type and ''stripes()'' notation {#stripes}
1908+ =================================================================
19091909
1910- While most <<image>> values represent a 2-dimensional image,
1911- and <<color>> can be thought of as a " 0-dimensional" image
1910+ While <<image>> values represent a 2-dimensional (2D) image,
1911+ and <<color>> can be thought of as a 0-dimensional (0D) image
19121912 (unvarying in either axis),
1913- there are some contexts where a 1-dimensional image makes sense,
1914- specifying colors along a <dfn export>paint line</dfn>
1915- without defining a <em> direction</em> for the line.
1916- The <<1d-image>> type represents such images.
1917-
1913+ some contexts require a
1914+ <dfn export lt="1D image | one-dimensional image | 1-dimensional image">1-dimensional (1D) image</dfn> ,
1915+ which specifies colors along an abstract, directionless, single-axis <dfn export>paint line</dfn> .
1916+ The <dfn><<image-1D>></dfn> type represents such [=1D images=] ,
1917+ including the ''stripes()'' [=functional notation=] :
1918+
19181919 <pre class=prod>
1919- <dfn> <1d- image></dfn ><<stripes()>>
1920- <dfn> stripes()</dfn > = stripes( <<color-stripe>> # )
1921- <dfn>< color-stripe></dfn > = <<color>> && [ <<length-percentage>> | <<flex>> ]?
1920+ <image-1D > = <<stripes()>>
1921+ << stripes()> > = stripes( <<color-stripe>> # )
1922+ << color-stripe>> = <<color>> && [ <<length-percentage>> | <<flex>> ]?
19221923 </pre>
19231924
1924- The ''stripes()'' function defines a 1d-image
1925- as a number of colored stripes with different widths.
1925+ The <dfn>stripes()</dfn> function defines a [=1D image=]
1926+ as a comma-separated list of colored stripes,
1927+ each placed end-to-end on the [=paint line=] in the order given.
19261928
1927- Each comma-separated entry defines a solid-color stripe,
1928- each placed end-to-end on the [=paint line=] in the order given,
1929+ Each <dfn><<color-stripe>></dfn> entry defines a solid-color stripe
19291930 with the specified <<color>> and thickness.
19301931 If the thickness is omitted,
19311932 it defaults to ''1fr'' .
1932-
1933- In each entry, a <<percentage>> is relative to the |painting area|
1934- and must be between ''0%'' and ''100%'' inclusive
1935- or else the function is invalid.
1936- A <<flex>> is evaluated as a fraction of the |painting area|
1937- relative to the total sum of <<flex>> entries in the function,
1938- after subtracting the thickness of any non-<<flex>> entries
1939- (flooring the subtraction result at zero).
1940- If the sum of <<flex>> values is less than 1fr,
1941- the result of the subtraction is multiplied by the sum's value
1942- before being distributed.
1943-
1933+ Thickness values are intepreted as follows:
1934+
1935+ <dl dfn-type=value dfn-for="stripes()">
1936+ <dt> <dfn><<percentage [0,100]>></dfn>
1937+ <dd>
1938+ Percentage thicknesses are relative to the |total width|.
1939+ Only values between ''0%'' and ''100%'' (inclusive)
1940+ are valid.
1941+
1942+ <dt> <dfn><<length [0,Infinity]>></dfn>
1943+ <dd>
1944+ Negative length values are invalid.
1945+
1946+ <dt> <dfn><<flex>></dfn>
1947+ <dd>
1948+ A <<flex>> is evaluated as a fraction of the |total width|
1949+ relative to the total sum of <<flex>> entries in the function,
1950+ after subtracting the thickness of any non-<<flex>> entries
1951+ (flooring the subtraction result at zero).
1952+ If the sum of <<flex>> values is less than ''1fr'' ,
1953+ the result of the subtraction is multiplied by the sum's value
1954+ before being distributed.
1955+ </dl>
1956+
1957+ The |total width| is defined by the context in which the ''stripes()'' function is used.
1958+ If the sum of the stripes is smaller than the |total width|,
1959+ the [=paint line=] is [=transparent black=] for its remaining length,
1960+ as if a final ''transparent'' argument were given.
1961+ If the sum is larger,
1962+ any stripes or portions beyond the |total width| are truncated.
1963+
19441964 <div class=example>
19451965 For example,
1946- ''stripes(red 1fr, green 2fr, blue 100px)``
1947- with a |painting area | of '' 400px''
1966+ ''stripes(red 1fr, green 2fr, blue 100px)''
1967+ with a |total width | of ''400px''
19481968 will result in a 100px red stripe and 200px green stripe,
19491969 giving red 1 share and green 2 shares of the 300px remaining
19501970 after subtracting blue's 100px from the 400px total.
19511971
19521972 On the other hand,
1953- '' stripes(red .1fr, green .2fr, blue 100px)``
1954- with a |painting area | of ''400px''
1973+ ''stripes(red .1fr, green .2fr, blue 100px)''
1974+ with a |total width | of ''400px''
19551975 will instead give a 30px red stripe and 60px green stripe,
19561976 followed by 100px of blue and then 210px of transparent.
19571977 The 300px of leftover space is multiplied by .3,
19581978 the value of the sum of the <<flex>> values,
19591979 to obtain only 90px,
19601980 which is then distributed in the 1:2 ratio
1961- the <<flex>> values would dictate .
1981+ dictated by the <<flex>> values.
19621982
19631983 (This is similar to how [=flex layout=] deals with small <<flex>> sums on a line,
19641984 and ensures smoothly continuous behavior
19651985 as the <<flex>> values approach zero.)
19661986 </div>
19671987
1968- The |painting area| is defined by the context in which the ''stripes()'' function is used.
1969- If used generically as an <<image>> ,
1970- the |painting area| is the height of the [=concrete image size=] .
1971-
1972- If the sum thickness of the stripes is smaller than the |painting area|,
1973- the [=paint line=] is [=transparent black=] for its remaining length,
1974- as if a final ''transparent'' argument were given.
1975- If the sum thickness is larger,
1976- any stripes or portions thereof that would be past the end of the [=paint line=] have no effect.
1977-
19781988 The computed value of this function is the [=specified value=]
19791989 with all <<color>> s computed
19801990 and all <<length-percentage>> s absolutized and computed to the extent possible.
19811991
1992+ Issue: Do we actually want to compute everything through to an absolute length?
1993+ It might not make that much sense for inheritance that way.
1994+
19821995<!--
19831996 ██████ ████ ████████ ████ ██ ██ ██████
19841997██ ██ ██ ██ ██ ███ ██ ██ ██
0 commit comments