Unified Diff: html/content.html
Issue 29361647:
Issue 4607 - Default content styles (Closed)
Patch Set: Removed extra list items and changed image text capitilization
Created Nov. 17, 2016, 4:17 p.m.
Use n/p to move between diff chunks;
N/P to move between comments.
« gulpfile.js ('K')
|
« gulpfile.js ('k')
|
package.json » ('j')
|
scss/_content.scss » ('J')
Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')
Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')
| Index: html/content.html |
| =================================================================== |
| new file mode 100644 |
| --- /dev/null |
| +++ b/html/content.html |
| @@ -0,0 +1,110 @@ |
| +<!DOCTYPE html> |
| +<!-- |
| + This file is part of universal-design-language |
| + Copyright (C) 2016 Eyeo GmbH |
| + |
| + universal-design-language is free software: you can redistribute it and/or |
| + modify it under the terms of the GNU General Public License as published by |
| + the Free Software Foundation, either version 3 of the License, or |
| + (at your option) any later version. |
| + |
| + universal-design-language is distributed in the hope that it will be useful, |
| + but WITHOUT ANY WARRANTY; without even the implied warranty of |
| + MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
| + GNU General Public License for more details. |
| + |
| + You should have received a copy of the GNU General Public License |
| + along with web.starter-kit. If not, see <http://www.gnu.org/licenses/>. |
| +--> |
| +<html dir="ltr"> |
| +<head> |
| + <meta charset="utf-8"> |
| + <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> |
| + <meta http-equiv="x-ua-compatible" content="ie=edge"> |
| + <title>Content</title> |
| + <link rel="stylesheet" href="/css/main.css"> |
| +</head> |
| +<body style="margin-bottom: 3em;"> |
|
saroyanm
2016/11/21 18:44:35
Detail: let's not encourage people to use inline s
juliandoucette
2016/11/22 00:54:02
Do we really want to create a new <style> for *jus
saroyanm
2016/11/24 13:26:49
I see couple of reasons:
* Overwriting inline-styl
saroyanm
2016/11/24 15:18:42
Acknowledged.
We gonna use <style> tag
juliandoucette
2016/11/25 16:28:41
Done.
|
| + <div class="container"> |
| + |
| + <h1>Content</h1> |
| + <p>This document outlines a subset of HTML5 that we recommend supporting accross all websites.</p> |
| + |
| + <h2>Headings</h2> |
| + |
| + <h1>Heading 1</h1> |
| + <h2>Heading 2</h2> |
| + <h3>Heading 3</h3> |
| + <h4>Heading 4</h4> |
| + <h5>Heading 5</h5> |
| + <h6>Heading 6</h6> |
| + |
| + <h2>Body content</h2> |
| + |
| + <p>This is a normal.</p> |
| + <p>This is <em>emphasized</em>.</p> |
| + <p>This is <strong>strong</strong>.</p> |
| + <p>This is an <abbr title="Abbreviation">abbr</abbr>.</p> |
| + <p>This is a <a href="#">link</a>.</p> |
| + <p>This has a footnote. <sup><a href="#" class="footnote-ref">1</a></sup></p> |
| + <blockquote>This is a blockquote.</blockquote> |
| + <p>This is followed by a thematic break.</p> |
| + <hr> |
| + <p>Like a change of scene in a story, or a shift of topic within a section.</p> |
| + |
| + <h3>Ordered lists</h3> |
| + |
| + <ol> |
| + <li>This is a list item</li> |
| + <li>This is a list item |
| + <ol> |
| + <li>This is a list item</li> |
| + <li>This is a list item</li> |
| + </ol> |
| + </li> |
| + <li>This is a list item</li> |
| + </ol> |
| + |
| + <h3>Unordered lists</h3> |
| + |
| + <ul> |
| + <li>This is a list item</li> |
| + <li>This is a list item |
| + <ul> |
| + <li>This is a list item</li> |
| + <li>This is a list item</li> |
| + </ul> |
| + </li> |
| + <li>This is a list item</li> |
| + </ul> |
| + |
| + <h3>Unstyled lists</h3> |
| + |
| + <ul class="unstyled-list"> |
| + <li>This is a list item</li> |
| + <li>This is a list item |
| + <ul class="unstyled-list"> |
| + <li>This is a list item</li> |
| + <li>This is a list item</li> |
| + </ul> |
| + </li> |
| + <li>This is a list item</li> |
| + </ul> |
| + |
| + <h3>Definition lists</h3> |
| + |
| + <dl> |
| + <dt>This is a definition title</dt> |
| + <dd>This is a definition detail</dd> |
| + <dt>This is a definition title</dt> |
| + <dd>This is a definition detail</dd> |
| + </dl> |
| + |
| + <h2>Images</h2> |
| + |
| + <img src="//placehold.it/480x240?text=Fixed width" /> |
| + <img class="full-width" src="//placehold.it/960x240?text=Full width" /> |
| + |
| + </div> |
| +</body> |
| +</html> |
