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

Side by Side Diff: html/content.html

Issue 29361647: Issue 4607 - Default content styles (Closed)
Patch Set: Fixed content TOC and capitilization Created Nov. 3, 2016, 2:18 p.m.
Left:
Right:
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View unified diff | Download patch
« no previous file with comments | « gulpfile.js ('k') | package.json » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
1 <!DOCTYPE html>
2 <!--
3 This file is part of universal-design-language
4 Copyright (C) 2016 Eyeo GmbH
5
6 universal-design-language is free software: you can redistribute it and/or
7 modify it under the terms of the GNU General Public License as published by
8 the Free Software Foundation, either version 3 of the License, or
9 (at your option) any later version.
10
11 universal-design-language is distributed in the hope that it will be useful,
12 but WITHOUT ANY WARRANTY; without even the implied warranty of
13 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
14 GNU General Public License for more details.
15
16 You should have received a copy of the GNU General Public License
17 along with web.starter-kit. If not, see <http://www.gnu.org/licenses/>.
18 -->
19 <html dir="ltr">
20 <head>
21 <meta charset="utf-8">
22 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to- fit=no">
23 <meta http-equiv="x-ua-compatible" content="ie=edge">
24 <title>HTML Content</title>
25 <link rel="stylesheet" href="/css/main.css">
26 <style>
27 body
28 {
29 margin-bottom: 4em;
30 }
31 header
32 {
33 border-bottom: 1px solid lightgray;
34 margin: 4em 0 1em 0;
35 }
36 </style>
37 </head>
38 <body>
39 <main class="container">
40
41 <header>
42 <h1>HTML Content</h1>
43 </header>
44 <ol>
45 <li><a href="#headings">Headings</a></li>
46 <li><a href="#inline">Inline</a></li>
47 <li><a href="#blockquotes">Blockquotes</a></li>
48 <li><a href="#code-blocks">Code Blocks</a></li>
49 <li><a href="#ordered-lists">Ordered Lists</a></li>
50 <li><a href="#unordered-lists">Unordered Lists</a></li>
51 <li><a href="#unstyled-lists">Unstyled Lists</a></li>
52 <li><a href="#definition-lists">Definition Lists</a></li>
53 <li><a href="#tables">Tables</a></li>
54 <li><a href="#image-alignment">Image Alignment</a></li>
55 <li><a href="#embeds">Embeds</a></li>
56 </ol>
57
58 <section>
59 <header>
60 <h2 id="headings">Headings</h2>
61 </header>
62 <h1>Heading 1</h1>
63 <h2>Heading 2</h2>
64 <h3>Heading 3</h3>
65 <h4>Heading 4</h4>
66 <h5>Heading 5</h5>
67 <h6>Heading 6</h6>
68 </section>
69
70 <section>
71 <header>
72 <h2 id="inline">Inline</h2>
73 </header>
74 <p>This is a normal.</p>
75 <p>This is <em>emphasized</em>.</p>
76 <p>This is <strong>strong</strong>.</p>
77 <p>This is inline <code>code</code>.</p>
78 <p>This is an <abbr title="Abbreviation">abbr</abbr>.</p>
79 <p>This is a <a href="#">link</a>.</p>
80 </section>
81
82 <section>
83 <header>
84 <h2 id="blockquotes">Blockquotes</h2>
85 </header>
86 <blockquote>
87 <p>This is a blockquote</p>
88 </blockquote>
89 </section>
90
91 <section>
92 <header>
93 <h2 id="code-blocks">Code blocks</h2>
94 </header>
95 <pre><code>
96 #include<stdio.h>
97
98 int main(void) {
99 printf("Hello World\n");
100 return 0;
101 }
102 </code></pre>
103 </section>
104
105 <section>
106 <header>
107 <h2 id="ordered-lists">Ordered Lists</h2>
108 </header>
109 <ol>
110 <li>This is a list item</li>
111 <li>This is a list item</li>
112 <li>This is a list item
113 <ol>
114 <li>This is a list item</li>
115 <li>This is a list item</li>
116 <li>This is a list item</li>
117 <li>This is a list item</li>
118 </ol>
119 </li>
120 <li>This is a list item</li>
121 </ol>
122 </section>
123
124 <section>
125 <header>
126 <h2 id="unordered-lists">Unoredered Lists</h2>
127 </header>
128 <ul>
129 <li>This is a list item</li>
130 <li>This is a list item</li>
131 <li>This is a list item
132 <ul>
133 <li>This is a list item</li>
134 <li>This is a list item</li>
135 <li>This is a list item</li>
136 <li>This is a list item</li>
137 </ul>
138 </li>
139 <li>This is a list item</li>
140 </ul>
141 </section>
142
143 <section>
144 <header>
145 <h2 id="unstyled-lists">Unstyled Lists</h2>
146 </header>
147 <ul class="unstyled-list">
148 <li>This is a list item</li>
149 <li>This is a list item</li>
150 <li>This is a list item
151 <ul>
152 <li>This is a list item</li>
153 <li>This is a list item</li>
154 <li>This is a list item</li>
155 <li>This is a list item</li>
156 </ul>
157 </li>
158 <li>This is a list item</li>
159 </ul>
160 </section>
161
162 <section>
163 <header>
164 <h2 id="definition-lists">Definition Lists</h2>
165 </header>
166 <dl>
167 <dt>This is a question?</dt>
168 <dd>This is an answer.</dd>
169 <dt>This is a <dfn>term</dfn>.</dt>
170 <dd>This is that term's definition.</dd>
171 </dl>
172 </section>
173
174 <section>
175 <header>
176 <h2 id="tables">Tables</h2>
177 </header>
178 <table>
179 <thead>
180 <th>Heading 1</th>
181 <th>Heading 2</th>
182 <th>Heading 3</th>
183 <th>Heading 4</th>
184 </thead>
185 <tbody>
186 <tr>
187 <td>Item 1:1</td>
188 <td>Item 1:2</td>
189 <td>Item 1:3</td>
190 <td>Item 1:4</td>
191 </tr>
192 <tr>
193 <td>Item 2:1</td>
194 <td>Item 2:2</td>
195 <td>Item 2:3</td>
196 <td>Item 2:4</td>
197 </tr>
198 <tr>
199 <td>Item 3:1</td>
200 <td>Item 3:2</td>
201 <td>Item 3:3</td>
202 <td>Item 3:4</td>
203 </tr>
204 <tr>
205 <td>Item 4:1</td>
206 <td>Item 4:2</td>
207 <td>Item 4:3</td>
208 <td>Item 4:4</td>
209 </tr>
210 </tbody>
211 </table>
212 </section>
213
214 <section>
215 <header>
216 <h2 id="image-alignment">Image alignment</h2>
217 </header>
218 <p class="block">
219 This <img src="//placehold.it/100x100?text=Image"> appears inline
220 </p>
221 <p class="block">
222 This image appears
223 <img class="block" src="//placehold.it/480x100?text=Full+width">
224 </p>
225 <p class="block">
226 This image appears
227 <img class="sol" src="//placehold.it/100x100?text=Left">
228 </p>
229 <p class="block">
230 This image appears
231 <img class="eol" src="//placehold.it/100x100?text=Right">
232 </p>
233 </section>
234
235 <section>
236 <header>
237 <h2 id="embeds">Embeds</h2>
238 </header>
239 <div class="embed">
240 <iframe src="//www.youtube.com/embed/zpOULjyy-n8?rel=0" allowfullscreen> </iframe>
241 </div>
242 </section>
243
244 </main>
245
246 <script src="/node_modules/anchor-js/anchor.js"></script>
247 <script>anchors.add("header h2");</script>
248 </body>
249 </html>
OLDNEW
« no previous file with comments | « gulpfile.js ('k') | package.json » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld