|
8 | 8 | "name": "determine pairs of gap decoration endpoints", |
9 | 9 | "href": "https://drafts.csswg.org/css-gaps-1/#determine-pairs-of-gap-decoration-endpoints", |
10 | 10 | "html": "To <dfn class=\"dfn-paneled has-dfn-panel\" data-dfn-type=\"dfn\" data-noexport=\"\" id=\"determine-pairs-of-gap-decoration-endpoints\" role=\"button\" aria-expanded=\"false\" tabindex=\"0\">determine pairs of gap decoration endpoints</dfn> within a given <var>gap</var>:", |
11 | | - "rationale": "let", |
| 11 | + "rationale": ".algorithm", |
12 | 12 | "steps": [ |
13 | 13 | { |
14 | | - "html": "Let <var>pairs</var> be an empty list.\n\t\t\tLet <var>endpoints</var> be the list of <a data-link-type=\"dfn\" href=\"https://drafts.csswg.org/css-gaps-1/#gap-intersection-point\" id=\"ref-for-gap-intersection-point①①\">gap intersection points</a> that fall along the centerline of <var>gap</var>,\n\t\t\tordered from start to end along <var>gap</var>’s axis.\n\t\t\tLet <var>break</var> be the used value of either <a class=\"property css\" data-link-type=\"property\" href=\"https://drafts.csswg.org/css-gaps-1/#propdef-column-rule-break\" id=\"ref-for-propdef-column-rule-break④\">column-rule-break</a> or <a class=\"property css\" data-link-type=\"property\" href=\"https://drafts.csswg.org/css-gaps-1/#propdef-row-rule-break\" id=\"ref-for-propdef-row-rule-break③\">row-rule-break</a>,\n\t\t\twhichever applies to <var>gap</var>." |
| 14 | + "html": "Let <var>pairs</var> be an empty list.\n\t\t\t\tLet <var>endpoints</var> be the list of <a data-link-type=\"dfn\" href=\"https://drafts.csswg.org/css-gaps-1/#gap-intersection-point\" id=\"ref-for-gap-intersection-point①②\">gap intersection points</a> that fall along the centerline of <var>gap</var>,\n\t\t\t\tordered from start to end along <var>gap</var>’s axis.\n\t\t\t\tLet <var>break</var> be the used value of either <a class=\"property css\" data-link-type=\"property\" href=\"https://drafts.csswg.org/css-gaps-1/#propdef-column-rule-break\" id=\"ref-for-propdef-column-rule-break④\">column-rule-break</a> or <a class=\"property css\" data-link-type=\"property\" href=\"https://drafts.csswg.org/css-gaps-1/#propdef-row-rule-break\" id=\"ref-for-propdef-row-rule-break③\">row-rule-break</a>,\n\t\t\t\twhichever applies to <var>gap</var>." |
15 | 15 | }, |
16 | 16 | { |
17 | 17 | "html": "If <var>endpoints</var> contains fewer than 2 items, return <var>pairs</var>." |
18 | 18 | }, |
19 | 19 | { |
20 | | - "html": "Remove the first item from <var>endpoints</var>.\n\t\t\tLet <var>start</var> be equal to that item." |
| 20 | + "html": "If <var>break</var> is other than <a class=\"css\" data-link-type=\"maybe\" href=\"https://drafts.csswg.org/css-gaps-1/#valdef-column-rule-break-none\" id=\"ref-for-valdef-column-rule-break-none①\">none</a>,\n\t\t\t\tand the first two items in <var>endpoints</var> are <a data-link-type=\"dfn\" href=\"https://drafts.csswg.org/css-gaps-1/#discontiguous\" id=\"ref-for-discontiguous①\">discontiguous</a>,\n\t\t\t\tremove the first item from <var>endpoints</var>, then go back to step 2." |
21 | 21 | }, |
22 | 22 | { |
23 | | - "html": "Remove the first item from <var>endpoints</var>.\n\t\t\tLet <var>end</var> be equal to that item." |
| 23 | + "html": "Remove the first item from <var>endpoints</var>.\n\t\t\t\tLet <var>start</var> be equal to that item." |
24 | 24 | }, |
25 | 25 | { |
26 | | - "html": "If <var>endpoints</var> is non-empty, and either of the following conditions is true... \n \n ...then go back to step 4.", |
| 26 | + "html": "Remove the first item from <var>endpoints</var>.\n\t\t\t\tLet <var>end</var> be equal to that item." |
| 27 | + }, |
| 28 | + { |
| 29 | + "html": "If <var>endpoints</var> is non-empty, and any of the following conditions are true... \n \n ...then go back to step 5.", |
27 | 30 | "ignored": [ |
28 | | - "break is spanning-item, and a line segment from start to the first item in endpoints, with the same width as gap, does not intersect a child item in the container break is none" |
| 31 | + "break is none. break is spanning-item, and start is not discontiguous with the first item in endpoints. break is intersection, and start is not discontiguous with the first item in endpoints, and the intersection is flanked by spanning items on opposing sides." |
29 | 32 | ] |
30 | 33 | }, |
31 | 34 | { |
32 | | - "html": "<a data-link-type=\"dfn\" href=\"https://drafts.csswg.org/css-gaps-1/#compute-the-offset\" id=\"ref-for-compute-the-offset\">Compute the offset</a> for <var>start</var> within <var>gap</var>.\n\t\t\tOffset <var>start</var> by the result,\n\t\t\tin the forward direction along <var>gap</var>’s axis." |
| 35 | + "html": "<a data-link-type=\"dfn\" href=\"https://drafts.csswg.org/css-gaps-1/#compute-the-offset\" id=\"ref-for-compute-the-offset\">Compute the offset</a> for <var>start</var> within <var>gap</var>.\n\t\t\t\tOffset <var>start</var> by the result,\n\t\t\t\tin the forward direction along <var>gap</var>’s axis." |
33 | 36 | }, |
34 | 37 | { |
35 | | - "html": "<a data-link-type=\"dfn\" href=\"https://drafts.csswg.org/css-gaps-1/#compute-the-offset\" id=\"ref-for-compute-the-offset①\">Compute the offset</a> for <var>end</var> within <var>gap</var>.\n\t\t\tOffset <var>end</var> by the result,\n\t\t\tin the reverse direction along <var>gap</var>’s axis." |
| 38 | + "html": "<a data-link-type=\"dfn\" href=\"https://drafts.csswg.org/css-gaps-1/#compute-the-offset\" id=\"ref-for-compute-the-offset①\">Compute the offset</a> for <var>end</var> within <var>gap</var>.\n\t\t\t\tOffset <var>end</var> by the result,\n\t\t\t\tin the reverse direction along <var>gap</var>’s axis." |
36 | 39 | }, |
37 | 40 | { |
38 | 41 | "html": "Add to <var>pairs</var> a tuple consisting of <var>start</var> and <var>end</var>." |
|
45 | 48 | { |
46 | 49 | "name": "compute the offset", |
47 | 50 | "href": "https://drafts.csswg.org/css-gaps-1/#compute-the-offset", |
48 | | - "html": "To <dfn class=\"dfn-paneled has-dfn-panel\" data-dfn-type=\"dfn\" data-noexport=\"\" id=\"compute-the-offset\" role=\"button\" aria-expanded=\"false\" tabindex=\"0\">compute the offset</dfn> for a given <a data-link-type=\"dfn\" href=\"https://drafts.csswg.org/css-gaps-1/#gap-intersection-point\" id=\"ref-for-gap-intersection-point②⓪\">gap intersection point</a> <var>point</var> within a given <var>gap</var>:", |
49 | | - "rationale": "let", |
| 51 | + "html": "To <dfn class=\"dfn-paneled has-dfn-panel\" data-dfn-type=\"dfn\" data-noexport=\"\" id=\"compute-the-offset\" role=\"button\" aria-expanded=\"false\" tabindex=\"0\">compute the offset</dfn> for a given <a data-link-type=\"dfn\" href=\"https://drafts.csswg.org/css-gaps-1/#gap-intersection-point\" id=\"ref-for-gap-intersection-point①⑦\">gap intersection point</a> <var>point</var> within a given <var>gap</var>:", |
| 52 | + "rationale": ".algorithm", |
50 | 53 | "steps": [ |
51 | 54 | { |
52 | 55 | "html": "Let <var>width</var> be the <a data-link-type=\"dfn\" href=\"https://drafts.csswg.org/css-gaps-1/#crossing-gap-width\" id=\"ref-for-crossing-gap-width④\">crossing gap width</a> for <var>point</var>." |
53 | 56 | }, |
54 | 57 | { |
55 | | - "html": "Let <var>outset</var> be the computed value of either <a class=\"property css\" data-link-type=\"property\" href=\"https://drafts.csswg.org/css-gaps-1/#propdef-column-rule-outset\" id=\"ref-for-propdef-column-rule-outset④\">column-rule-outset</a> or <a class=\"property css\" data-link-type=\"property\" href=\"https://drafts.csswg.org/css-gaps-1/#propdef-row-rule-outset\" id=\"ref-for-propdef-row-rule-outset③\">row-rule-outset</a>,\n\t\t\twhichever applies to <var>gap</var>.\n\t\t\tResolve any percentages in <var>outset</var> against <var>width</var>." |
| 58 | + "html": "Let <var>outset</var> be the computed value of either <a class=\"property css\" data-link-type=\"property\" href=\"https://drafts.csswg.org/css-gaps-1/#propdef-column-rule-outset\" id=\"ref-for-propdef-column-rule-outset④\">column-rule-outset</a> or <a class=\"property css\" data-link-type=\"property\" href=\"https://drafts.csswg.org/css-gaps-1/#propdef-row-rule-outset\" id=\"ref-for-propdef-row-rule-outset③\">row-rule-outset</a>,\n\t\t\t\twhichever applies to <var>gap</var>.\n\t\t\t\tResolve any percentages in <var>outset</var> against <var>width</var>." |
56 | 59 | }, |
57 | 60 | { |
58 | | - "html": "Let <var>result</var> be <var>width</var> multiplied by 50%.\n\t\t\tSubtract <var>outset</var> from <var>result</var>." |
| 61 | + "html": "Let <var>result</var> be <var>width</var> multiplied by 50%.\n\t\t\t\tSubtract <var>outset</var> from <var>result</var>." |
59 | 62 | }, |
60 | 63 | { |
61 | 64 | "html": "Return <var>result</var>." |
|
66 | 69 | "name": "assign gap decoration values", |
67 | 70 | "href": "https://drafts.csswg.org/css-gaps-1/#assign-gap-decoration-values", |
68 | 71 | "html": "To <dfn class=\"dfn-paneled has-dfn-panel\" data-dfn-type=\"dfn\" data-noexport=\"\" id=\"assign-gap-decoration-values\" role=\"button\" aria-expanded=\"false\" tabindex=\"0\">assign gap decoration values</dfn> to a list of <var>gaps</var> using a list of <var>values</var>:", |
69 | | - "rationale": "replace", |
| 72 | + "rationale": ".algorithm", |
70 | 73 | "steps": [ |
71 | 74 | { |
72 | 75 | "html": "Replace any <a data-link-type=\"dfn\" href=\"https://drafts.csswg.org/css-gaps-1/#integer-repeater\" id=\"ref-for-integer-repeater①\">integer repeaters</a> in <var>values</var> with their expanded-out equivalents." |
|
76 | 79 | "rationale": "end", |
77 | 80 | "steps": [ |
78 | 81 | { |
79 | | - "html": "Beginning from the first item in <var>values</var> and the first item in <var>gaps</var>,\n\t\t\t\t\tassign each value to the corresponding gap.\n\t\t\t\t\tIf there are fewer values than gaps,\n\t\t\t\t\trepeat beginning from the first item in <var>values</var>,\n\t\t\t\t\tas many times as needed." |
| 82 | + "html": "Beginning from the first item in <var>values</var> and the first item in <var>gaps</var>,\n\t\t\t\t\t\tassign each value to the corresponding gap.\n\t\t\t\t\t\tIf there are fewer values than gaps,\n\t\t\t\t\t\trepeat beginning from the first item in <var>values</var>,\n\t\t\t\t\t\tas many times as needed." |
80 | 83 | }, |
81 | 84 | { |
82 | 85 | "html": "End this algorithm." |
83 | 86 | } |
84 | 87 | ] |
85 | 88 | }, |
86 | 89 | { |
87 | | - "html": "<var>values</var> contains an <a data-link-type=\"dfn\" href=\"https://drafts.csswg.org/css-gaps-1/#auto-repeater\" id=\"ref-for-auto-repeater③\">auto repeater</a>.\n\t\t\tLet <var>leading count</var> be the number of items in <var>values</var> before the <span id=\"ref-for-auto-repeater④\">auto repeater</span>.\n\t\t\tLet <var>trailing count</var> be the number of items in <var>values</var> after the <span id=\"ref-for-auto-repeater⑤\">auto repeater</span>." |
| 90 | + "html": "<var>values</var> contains an <a data-link-type=\"dfn\" href=\"https://drafts.csswg.org/css-gaps-1/#auto-repeater\" id=\"ref-for-auto-repeater③\">auto repeater</a>.\n\t\t\t\tLet <var>leading count</var> be the number of items in <var>values</var> before the <span id=\"ref-for-auto-repeater④\">auto repeater</span>.\n\t\t\t\tLet <var>trailing count</var> be the number of items in <var>values</var> after the <span id=\"ref-for-auto-repeater⑤\">auto repeater</span>." |
88 | 91 | }, |
89 | 92 | { |
90 | 93 | "html": "Partition <var>gaps</var> as follows:", |
|
94 | 97 | "html": "Let <var>leading gaps</var> contain the first <var>leading count</var> items in <var>gaps</var>." |
95 | 98 | }, |
96 | 99 | { |
97 | | - "html": "Let <var>trailing gaps</var> contain the last <var>trailing count</var> items in <var>gaps</var>,\n\t\t\t\t\texcluding any items in <var>leading gaps</var>." |
| 100 | + "html": "Let <var>trailing gaps</var> contain the last <var>trailing count</var> items in <var>gaps</var>,\n\t\t\t\t\t\texcluding any items in <var>leading gaps</var>." |
98 | 101 | }, |
99 | 102 | { |
100 | 103 | "html": "Let <var>auto gaps</var> contain any items in <var>gaps</var> that are not in either <var>leading gaps</var> or <var>trailing gaps</var>." |
|
0 commit comments