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

Side by Side Diff: html/content.html

Issue 29361647: Issue 4607 - Default content styles (Closed)
Patch Set: Removed missing grid dependency. Created Nov. 3, 2016, 5:48 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
« README.md ('K') | « gulpfile.js ('k') | package.json » ('j') | package.json » ('J')
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
32 header
33 {
34 border-bottom: 1px solid lightgray;
35 margin: 4em 0 1em 0;
36 }
37 </style>
38 </head>
39 <body>
40 <main class="container">
41
42 <header>
43 <h1>HTML Content</h1>
44 </header>
45 <ol>
46 <li><a href="#headings">Headings</a></li>
47 <li><a href="#inline">Inline</a></li>
48 <li><a href="#blockquotes">Blockquotes</a></li>
49 <li><a href="#code-blocks">Code Blocks</a></li>
50 <li><a href="#ordered-lists">Ordered Lists</a></li>
51 <li><a href="#unordered-lists">Unordered Lists</a></li>
52 <li><a href="#unstyled-lists">Unstyled Lists</a></li>
53 <li><a href="#definition-lists">Definition Lists</a></li>
54 <li><a href="#tables">Tables</a></li>
55 <li><a href="#image-alignment">Image Alignment</a></li>
56 <li><a href="#embeds">Embeds</a></li>
57 </ol>
58
59 <section>
60 <header>
61 <h2 id="headings">Headings</h2>
62 </header>
63 <h1>Heading 1</h1>
64 <h2>Heading 2</h2>
65 <h3>Heading 3</h3>
66 <h4>Heading 4</h4>
67 <h5>Heading 5</h5>
68 <h6>Heading 6</h6>
69 </section>
70
71 <section>
72 <header>
73 <h2 id="inline">Inline</h2>
74 </header>
75 <p>This is a normal.</p>
76 <p>This is <em>emphasized</em>.</p>
77 <p>This is <strong>strong</strong>.</p>
78 <p>This is inline <code>code</code>.</p>
79 <p>This is an <abbr title="Abbreviation">abbr</abbr>.</p>
80 <p>This is a <a href="#">link</a>.</p>
81 </section>
82
83 <section>
84 <header>
85 <h2 id="blockquotes">Blockquotes</h2>
86 </header>
87 <blockquote>
88 <p>This is a blockquote</p>
89 </blockquote>
90 </section>
91
92 <section>
93 <header>
94 <h2 id="code-blocks">Code blocks</h2>
95 </header>
96 <pre><code>
97 #include<stdio.h>
98
99 int main(void) {
100 printf("Hello World\n");
101 return 0;
102 }
103 </code></pre>
104 </section>
105
106 <section>
107 <header>
108 <h2 id="ordered-lists">Ordered Lists</h2>
109 </header>
110 <ol>
111 <li>This is a list item</li>
112 <li>This is a list item</li>
113 <li>This is a list item
114 <ol>
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 <li>This is a list item</li>
119 </ol>
120 </li>
121 <li>This is a list item</li>
122 </ol>
123 </section>
124
125 <section>
126 <header>
127 <h2 id="unordered-lists">Unoredered Lists</h2>
128 </header>
129 <ul>
130 <li>This is a list item</li>
131 <li>This is a list item</li>
132 <li>This is a list item
133 <ul>
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 <li>This is a list item</li>
138 </ul>
139 </li>
140 <li>This is a list item</li>
141 </ul>
142 </section>
143
144 <section>
145 <header>
146 <h2 id="unstyled-lists">Unstyled Lists</h2>
147 </header>
148 <ul class="unstyled-list">
149 <li>This is a list item</li>
150 <li>This is a list item</li>
151 <li>This is a list item
152 <ul>
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 <li>This is a list item</li>
157 </ul>
158 </li>
159 <li>This is a list item</li>
160 </ul>
161 </section>
162
163 <section>
164 <header>
165 <h2 id="definition-lists">Definition Lists</h2>
166 </header>
167 <dl>
168 <dt>This is a question?</dt>
169 <dd>This is an answer.</dd>
170 <dt>This is a <dfn>term</dfn>.</dt>
171 <dd>This is that term's definition.</dd>
172 </dl>
173 </section>
174
175 <section>
176 <header>
177 <h2 id="tables">Tables</h2>
178 </header>
179 <table>
180 <thead>
181 <th>Heading 1</th>
182 <th>Heading 2</th>
183 <th>Heading 3</th>
184 <th>Heading 4</th>
185 </thead>
186 <tbody>
187 <tr>
188 <td>Item 1:1</td>
189 <td>Item 1:2</td>
190 <td>Item 1:3</td>
191 <td>Item 1:4</td>
192 </tr>
193 <tr>
194 <td>Item 2:1</td>
195 <td>Item 2:2</td>
196 <td>Item 2:3</td>
197 <td>Item 2:4</td>
198 </tr>
199 <tr>
200 <td>Item 3:1</td>
201 <td>Item 3:2</td>
202 <td>Item 3:3</td>
203 <td>Item 3:4</td>
204 </tr>
205 <tr>
206 <td>Item 4:1</td>
207 <td>Item 4:2</td>
208 <td>Item 4:3</td>
209 <td>Item 4:4</td>
210 </tr>
211 </tbody>
212 </table>
213 </section>
214
215 <section>
216 <header>
217 <h2 id="image-alignment">Image alignment</h2>
218 </header>
219 <p class="block">
220 This <img src="//placehold.it/100x100?text=Image"> appears inline
221 </p>
222 <p class="block">
223 This image appears
224 <img class="block" src="//placehold.it/480x100?text=Full+width">
225 </p>
226 <p class="block">
227 This image appears
228 <img class="sol" src="//placehold.it/100x100?text=Left">
229 </p>
230 <p class="block">
231 This image appears
232 <img class="eol" src="//placehold.it/100x100?text=Right">
233 </p>
234 </section>
235
236 <section>
237 <header>
238 <h2 id="embeds">Embeds</h2>
239 </header>
240 <div class="embed">
241 <iframe src="//www.youtube.com/embed/zpOULjyy-n8?rel=0" allowfullscreen> </iframe>
242 </div>
243 </section>
244
245 </main>
246
247 <script src="/node_modules/anchor-js/anchor.js"></script>
saroyanm 2016/11/03 19:41:13 I'll suggest not to load script that generates anc
juliandoucette 2016/11/03 22:59:37 What's wrong with this solution? https://github.c
saroyanm 2016/11/04 16:01:17 We need to check the SEO implication of deeplinks
juliandoucette 2016/11/04 17:32:26 We'll leave this out of next patchset.
juliandoucette 2016/11/08 15:51:57 Done.
248 <script>anchors.add("header h2");</script>
249 </body>
250 </html>
OLDNEW
« README.md ('K') | « gulpfile.js ('k') | package.json » ('j') | package.json » ('J')

Powered by Google App Engine
This is Rietveld