Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(10)

Side by Side Diff: third_party/WebKit/LayoutTests/css3/flexbox/multiline-align-content-horizontal-column.html

Issue 1419813004: Remove the "horizontal-bt" value from -webkit-writing-mode (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Add static_assert to ensure TransformedWritingMode matches to WritingMode Created 5 years, 1 month ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 <style> 3 <style>
4 .flexbox { 4 .flexbox {
5 position: relative; 5 position: relative;
6 display: flex; 6 display: flex;
7 background-color: grey; 7 background-color: grey;
8 width: 600px; 8 width: 600px;
9 height: 20px; 9 height: 20px;
10 } 10 }
11 .title { 11 .title {
12 margin-top: 1em; 12 margin-top: 1em;
13 } 13 }
14 .ltr { 14 .ltr {
15 direction: ltr; 15 direction: ltr;
16 } 16 }
17 .rtl { 17 .rtl {
18 direction: rtl; 18 direction: rtl;
19 } 19 }
20 .horizontal-tb { 20 .horizontal-tb {
21 -webkit-writing-mode: horizontal-tb; 21 -webkit-writing-mode: horizontal-tb;
22 } 22 }
23 .horizontal-bt {
24 -webkit-writing-mode: horizontal-bt;
25 }
26 .column { 23 .column {
27 flex-flow: column; 24 flex-flow: column;
28 } 25 }
29 .column-reverse { 26 .column-reverse {
30 flex-flow: column-reverse; 27 flex-flow: column-reverse;
31 } 28 }
32 .wrap { 29 .wrap {
33 flex-wrap: wrap; 30 flex-wrap: wrap;
34 } 31 }
35 .wrap-reverse { 32 .wrap-reverse {
(...skipping 101 matching lines...) Expand 10 before | Expand all | Expand 10 after
137 'flex-start': [0, 100], 134 'flex-start': [0, 100],
138 'flex-end': [400, 500], 135 'flex-end': [400, 500],
139 'center': [200, 300], 136 'center': [200, 300],
140 'space-between': [0, 500], 137 'space-between': [0, 500],
141 'space-around': [100, 400], 138 'space-around': [100, 400],
142 'stretch': [0, 300], 139 'stretch': [0, 300],
143 }, 140 },
144 }, 141 },
145 }, 142 },
146 }, 143 },
147 'horizontal-bt': {
148 // Same as horizontal-tb.
149 'column': {
150 'ltr': {
151 'wrap': {
152 'flex-start': [0, 100],
153 'flex-end': [400, 500],
154 'center': [200, 300],
155 'space-between': [0, 500],
156 'space-around': [100, 400],
157 'stretch': [0, 300],
158 },
159 'wrap-reverse': {
160 'flex-start': [500, 400],
161 'flex-end': [100, 0],
162 'center': [300, 200],
163 'space-between': [500, 0],
164 'space-around': [400, 100],
165 'stretch': [300, 0],
166 },
167 },
168 'rtl': {
169 'wrap': {
170 'flex-start': [500, 400],
171 'flex-end': [100, 0],
172 'center': [300, 200],
173 'space-between': [500, 0],
174 'space-around': [400, 100],
175 'stretch': [300, 0],
176 },
177 'wrap-reverse': {
178 'flex-start': [0, 100],
179 'flex-end': [400, 500],
180 'center': [200, 300],
181 'space-between': [0, 500],
182 'space-around': [100, 400],
183 'stretch': [0, 300],
184 },
185 },
186 },
187 'column-reverse': {
188 'ltr': {
189 'wrap': {
190 'flex-start': [0, 100],
191 'flex-end': [400, 500],
192 'center': [200, 300],
193 'space-between': [0, 500],
194 'space-around': [100, 400],
195 'stretch': [0, 300],
196 },
197 'wrap-reverse': {
198 'flex-start': [500, 400],
199 'flex-end': [100, 0],
200 'center': [300, 200],
201 'space-between': [500, 0],
202 'space-around': [400, 100],
203 'stretch': [300, 0],
204 },
205 },
206 'rtl': {
207 'wrap': {
208 'flex-start': [500, 400],
209 'flex-end': [100, 0],
210 'center': [300, 200],
211 'space-between': [500, 0],
212 'space-around': [400, 100],
213 'stretch': [300, 0],
214 },
215 'wrap-reverse': {
216 'flex-start': [0, 100],
217 'flex-end': [400, 500],
218 'center': [200, 300],
219 'space-between': [0, 500],
220 'space-around': [100, 400],
221 'stretch': [0, 300],
222 },
223 },
224 },
225 },
226 }; 144 };
227 145
228 function mainAxisDirection(writingMode, flexDirection) 146 function mainAxisDirection(writingMode, flexDirection)
229 { 147 {
230 if ((writingMode.indexOf('horizontal') != -1 && flexDirection.indexOf('row') != -1) 148 if ((writingMode.indexOf('horizontal') != -1 && flexDirection.indexOf('row') != -1)
231 || (writingMode.indexOf('vertical') != -1 && flexDirection.indexOf('colu mn') != -1)) 149 || (writingMode.indexOf('vertical') != -1 && flexDirection.indexOf('colu mn') != -1))
232 return 'width'; 150 return 'width';
233 return 'height'; 151 return 'height';
234 } 152 }
235 153
236 function addChild(flexbox, preferredSize, alignContent, expected_x_offset) 154 function addChild(flexbox, preferredSize, alignContent, expected_x_offset)
237 { 155 {
238 var child = document.createElement('div'); 156 var child = document.createElement('div');
239 child.setAttribute('style', 'flex: 1 ' + preferredSize + 'px;' 157 child.setAttribute('style', 'flex: 1 ' + preferredSize + 'px;'
240 + 'min-width: 100px'); 158 + 'min-width: 100px');
241 159
242 child.setAttribute("data-expected-width", alignContent == "stretch" ? "300" : "100"); 160 child.setAttribute("data-expected-width", alignContent == "stretch" ? "300" : "100");
243 child.setAttribute("data-expected-height", "20"); 161 child.setAttribute("data-expected-height", "20");
244 child.setAttribute("data-offset-y", "0"); 162 child.setAttribute("data-offset-y", "0");
245 child.setAttribute("data-offset-x", expected_x_offset); 163 child.setAttribute("data-offset-x", expected_x_offset);
246 164
247 flexbox.appendChild(child); 165 flexbox.appendChild(child);
248 } 166 }
249 167
250 var writingModes = ['horizontal-tb', 'horizontal-bt']; 168 var writingModes = ['horizontal-tb'];
251 var flexDirections = ['column', 'column-reverse']; 169 var flexDirections = ['column', 'column-reverse'];
252 var directions = ['ltr', 'rtl']; 170 var directions = ['ltr', 'rtl'];
253 var wraps = ['wrap', 'wrap-reverse']; 171 var wraps = ['wrap', 'wrap-reverse'];
254 var alignContents = ['flex-start', 'flex-end', 'center', 'space-between', 'space -around', 'stretch']; 172 var alignContents = ['flex-start', 'flex-end', 'center', 'space-between', 'space -around', 'stretch'];
255 173
256 writingModes.forEach(function(writingMode) { 174 writingModes.forEach(function(writingMode) {
257 flexDirections.forEach(function(flexDirection) { 175 flexDirections.forEach(function(flexDirection) {
258 directions.forEach(function(direction) { 176 directions.forEach(function(direction) {
259 wraps.forEach(function(wrap) { 177 wraps.forEach(function(wrap) {
260 alignContents.forEach(function(alignContent) { 178 alignContents.forEach(function(alignContent) {
(...skipping 17 matching lines...) Expand all
278 196
279 document.body.appendChild(flexbox); 197 document.body.appendChild(flexbox);
280 }) 198 })
281 }) 199 })
282 }) 200 })
283 }) 201 })
284 }) 202 })
285 </script> 203 </script>
286 </body> 204 </body>
287 </html> 205 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698