Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code

Delta Between Two Patch Sets: pages/grid.html

Issue 29491561: Issue 5413 - Create basic style guide for website-defaults (Closed)
Left Patch Set: Use includes for each demo Created Aug. 10, 2017, 9:52 a.m.
Right Patch Set: Separate Content and Developer Styleguides Created Aug. 21, 2017, 10:18 a.m.
Left:
Right:
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
Left: Side by side diff | Download
Right: Side by side diff | Download
« no previous file with change/comment | « pages/developer-styleguide.html ('k') | pages/index.html » ('j') | no next file with change/comment »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
LEFTRIGHT
1 title=Grid 1 title=Grid
2 2
3 <h1>Grid</h1> 3 <h1>Grid</h1>
4 <p>A grid is made up of rows of columns. Column widths are set by modifier class es and collapse on smaller screens. Columns may also appear in reverse order and right-to-left direction.</p> 4 <p>A grid is made up of rows of columns. Column widths are set by modifier class es and collapse on smaller screens. Columns may also appear in reverse order and right-to-left direction.</p>
5 5
6 <ol> 6 <ol>
7 <li><a href="#desktop">Desktop</a></li> 7 <li><a href="#desktop">Desktop</a></li>
8 <li><a href="#tablet">Tablet</a></li> 8 <li><a href="#tablet">Tablet</a></li>
9 <li><a href="#mobile">Mobile</a></li> 9 <li><a href="#mobile">Mobile</a></li>
10 <li><a href="#reverse">Reverse</a></li> 10 <li><a href="#reverse">Reverse</a></li>
11 <li><a href="#right-to-left">Right-to-left</a></li> 11 <li><a href="#right-to-left">Right-to-left</a></li>
12 <li><a href="#reverse-and-right-to-left">Reverse & right-to-left</a></li> 12 <li><a href="#reverse-and-right-to-left">Reverse & right-to-left</a></li>
13 </ol> 13 </ol>
14 14
15 <h2 id="desktop">Desktop</h2> 15 <h2 id="desktop">Desktop</h2>
16 <? include styleguide/grid/all ?> 16 <? include styleguide/grid/all-column-widths ?>
juliandoucette 2017/08/10 16:49:30 NIT: "all" is not very descriptive Suggest: "colum
ire 2017/08/11 11:09:47 Done. Changed to "all-column-widths", since the ot
juliandoucette 2017/08/20 16:48:39 Acknowledged.
17 17
18 <h2 id="tablet">Tablet</h2> 18 <h2 id="tablet">Tablet</h2>
19 <div class="tablet"> 19 <div class="tablet">
20 <? include styleguide/grid/all ?> 20 <? include styleguide/grid/all-column-widths ?>
juliandoucette 2017/08/10 16:49:31 NIT: Please indent
ire 2017/08/11 11:09:48 Done.
21 </div> 21 </div>
22 22
23 <h2 id="mobile">Mobile</h2> 23 <h2 id="mobile">Mobile</h2>
24 <div class="mobile"> 24 <div class="mobile">
25 <? include styleguide/grid/all ?> 25 <? include styleguide/grid/all-column-widths ?>
26 </div> 26 </div>
27 27
28 <h2 id="reverse">Reverse</h2> 28 <h2 id="reverse">Reverse</h2>
29 <? include styleguide/grid/reversed ?> 29 <div class="reverse">
juliandoucette 2017/08/10 16:49:30 NIT: "reversed" what? Suggest: Replace this includ
ire 2017/08/11 11:09:48 Done.
30 <? include styleguide/grid/2-column ?>
31 </div>
30 32
31 <h2 id="right-to-left">Right-to-left</h2> 33 <h2 id="right-to-left">Right-to-left</h2>
32 <div dir="rtl"> 34 <div dir="rtl">
33 <? include styleguide/grid/2-column ?> 35 <? include styleguide/grid/2-column ?>
34 </div> 36 </div>
35 37
36 <h2 id="reverse-and-right-to-left">Reverse & right-to-left</h2> 38 <h2 id="reverse-and-right-to-left">Reverse & right-to-left</h2>
37 <div dir="rtl"> 39 <div class="reverse" dir="rtl">
38 <? include styleguide/grid/reversed ?> 40 <? include styleguide/grid/2-column ?>
39 </div> 41 </div>
LEFTRIGHT

Powered by Google App Engine
This is Rietveld