Side by Side Diff: html/content.html
Issue 29361647:
Issue 4607 - Default content styles (Closed)
Patch Set:
Created Nov. 3, 2016, 2:11 p.m.
| Left: | ||
| Right: |
Use n/p to move between diff chunks;
N/P to move between comments.
« 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') | Hide Comments ('s')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')
| OLD | NEW |
|---|---|
| (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> | |
| OLD | NEW |
« no previous file with comments
|
« gulpfile.js ('k')
|
package.json » ('j')
|
no next file with comments »
