mirror_html/html5-test-page
1
0
Fork 0
mirror of https://github.com/cbracco/html5-test-page.git synced 2025-08-21 13:21:56 +02:00
Code Issues Packages Projects Releases Wiki Activity

Compare commits

base: mirror_html:0.7.1
Branches Tags
mirror_html:master mirror_html:issue/13-picture-element mirror_html:racztiborzoltan-patch-1 mirror_html:charul97-1 mirror_html:97arushisharma-horizontal-list mirror_html:jKratzik-master mirror_html:gh-pages
mirror_html:0.9.7 mirror_html:0.9.6 mirror_html:0.9.5 mirror_html:0.9.4 mirror_html:0.9.3 mirror_html:0.9.2 mirror_html:0.9.1 mirror_html:0.9.0 mirror_html:0.8.0 mirror_html:0.7.1 mirror_html:0.6.2 mirror_html:0.6.1 mirror_html:0.6.0 mirror_html:0.5.0 mirror_html:0.4.0 mirror_html:0.3.1 mirror_html:0.3.0 mirror_html:0.2.2 mirror_html:0.2.1 mirror_html:0.2.0 mirror_html:0.1.0
..
compare: mirror_html:0.9.3
Branches Tags
mirror_html:master mirror_html:issue/13-picture-element mirror_html:racztiborzoltan-patch-1 mirror_html:charul97-1 mirror_html:97arushisharma-horizontal-list mirror_html:jKratzik-master mirror_html:gh-pages
mirror_html:0.9.7 mirror_html:0.9.6 mirror_html:0.9.5 mirror_html:0.9.4 mirror_html:0.9.3 mirror_html:0.9.2 mirror_html:0.9.1 mirror_html:0.9.0 mirror_html:0.8.0 mirror_html:0.7.1 mirror_html:0.6.2 mirror_html:0.6.1 mirror_html:0.6.0 mirror_html:0.5.0 mirror_html:0.4.0 mirror_html:0.3.1 mirror_html:0.3.0 mirror_html:0.2.2 mirror_html:0.2.1 mirror_html:0.2.0 mirror_html:0.1.0

16 Commits
0.7.1 ... 0.9.3

Author SHA1 Message Date
Chris Bracco
e24e4b2b64 Merge pull request #37 from cbracco/charul97-1 
Add nested lists
 2021-04-03 15:31:04 -04:00
Chris Bracco
2e602b623d v0.9.2 2021-04-03 15:29:41 -04:00
Chris Bracco
9780f2af62 Add nested lists 2021-04-03 15:29:25 -04:00
Chris Bracco
a65554bba1 Merge pull request #36 from cbracco/97arushisharma-horizontal-list 
Add background images example
 2021-04-03 15:08:36 -04:00
Chris Bracco
7611bf513b v0.9.1 2021-04-03 15:05:45 -04:00
Chris Bracco
9c92199a7e Clean up BG image PR 2021-04-03 15:04:31 -04:00
97arushisharma
5cdb76d0fb horizontal list and text color 2021-04-03 14:59:41 -04:00
Chris Bracco
a7b56dec9b Add .editorconfig 2021-04-03 14:59:19 -04:00
Chris Bracco
8f241cf5f1 Merge pull request #35 from cbracco/jKratzik-master 
Add <details>, <address>, <object>, <embed>, <datalist>
 2021-04-03 14:56:36 -04:00
Chris Bracco
1fecd23aa7 v0.9.0 2021-04-03 14:55:34 -04:00
Chris Bracco
66a77835cc Remove <keygen>; Re-organize additions 2021-04-03 14:49:23 -04:00
jKratzik
ab4675eae5 Added a few elements 
address, details, embed, object, file input, datalist, keygen
 2021-04-03 14:34:53 -04:00
Chris Bracco
3b85be264e v0.8.0 2018-03-19 16:18:21 -04:00
Chris Bracco
d4d5224177 Merge branch 'ep00ch-master' 
* ep00ch-master:
  Minor copy updates
  Added a section for testing comments
 2018-03-19 16:16:23 -04:00
Chris Bracco
23c3d5f7c9 Minor copy updates 2018-03-19 16:15:55 -04:00
ep00ch
ffd3e00512 Added a section for testing comments 2018-03-16 17:19:15 +00:00
4 changed files with 169 additions and 30 deletions
Expand all files Collapse all files

3
.editorconfig Normal file
View File

@@ -0,0 +1,3 @@
[*]
indent_style = space
indent_size = 2

16
CHANGELOG.md
View File

@@ -1,3 +1,19 @@
# 0.9.2 (April 3, 2021)
- Add nested lists (thanks @charul97!).
# 0.9.1 (April 3, 2021)
- Add background images (thanks @97arushisharma!).
# 0.9.0 (April 3, 2021)
- Add <details>, <address>, <object>, <embed>, <datalist> (thanks @jKratzik!).
# 0.8.0 (March 19, 2018)
- Add test for HTML comments (thanks @ep00ch!).
# 0.7.1 (April 5, 2016) # 0.7.1 (April 5, 2016)
- Add missing form button types (thanks @gnowland!). - Add missing form button types (thanks @gnowland!).

178
index.html
View File

@@ -1,4 +1,4 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
@@ -18,18 +18,23 @@
<ul> <ul>
<li><a href="#text__headings">Headings</a></li> <li><a href="#text__headings">Headings</a></li>
<li><a href="#text__paragraphs">Paragraphs</a></li> <li><a href="#text__paragraphs">Paragraphs</a></li>
<li><a href="#text__blockquotes">Blockquotes</a></li>
<li><a href="#text__lists">Lists</a></li> <li><a href="#text__lists">Lists</a></li>
<li><a href="#text__blockquotes">Blockquotes</a></li>
<li><a href="#text__details">Details / Summary</a></li>
<li><a href="#text__address">Address</a></li>
<li><a href="#text__hr">Horizontal rules</a></li> <li><a href="#text__hr">Horizontal rules</a></li>
<li><a href="#text__tables">Tabular data</a></li> <li><a href="#text__tables">Tabular data</a></li>
<li><a href="#text__code">Code</a></li> <li><a href="#text__code">Code</a></li>
<li><a href="#text__inline">Inline elements</a></li> <li><a href="#text__inline">Inline elements</a></li>
<li><a href="#text__comments">HTML Comments</a></li>
</ul> </ul>
</li> </li>
<li> <li>
<a href="#embedded">Embedded content</a> <a href="#embedded">Embedded content</a>
<ul> <ul>
<li><a href="#embedded__images">Images</a></li> <li><a href="#embedded__images">Images</a></li>
<li><a href="#embedded__bgimages">Background images</a></li>
<li><a href="#embedded__audio">Audio</a></li> <li><a href="#embedded__audio">Audio</a></li>
<li><a href="#embedded__video">Video</a></li> <li><a href="#embedded__video">Video</a></li>
<li><a href="#embedded__canvas">Canvas</a></li> <li><a href="#embedded__canvas">Canvas</a></li>
@@ -37,6 +42,8 @@
<li><a href="#embedded__progress">Progress</a></li> <li><a href="#embedded__progress">Progress</a></li>
<li><a href="#embedded__svg">Inline SVG</a></li> <li><a href="#embedded__svg">Inline SVG</a></li>
<li><a href="#embedded__iframe">IFrames</a></li> <li><a href="#embedded__iframe">IFrames</a></li>
<li><a href="#embedded__embed">Embed</a></li>
<li><a href="#embedded__object">Object</a></li>
</ul> </ul>
</li> </li>
<li> <li>
@@ -77,6 +84,85 @@
</div> </div>
<footer><p><a href="#top">[Top]</a></p></footer> <footer><p><a href="#top">[Top]</a></p></footer>
</article> </article>
<article id="text__lists">
<header><h1>Lists</h1></header>
<div>
<h3>Definition list</h3>
<dl>
<dt>Definition List Title</dt>
<dd>This is a definition list division.</dd>
</dl>
<h3>Ordered List</h3>
<ol type="1">
<li>List Item 1</li>
<li>
List Item 2
<ol type="A">
<li>List Item 1</li>
<li>
List Item 2
<ol type="a">
<li>List Item 1</li>
<li>
List Item 2
<ol type="I">
<li>List Item 1</li>
<li>
List Item 2
<ol type="i">
<li>List Item 1</li>
<li>List Item 2</li>
<li>List Item 3</li>
</ol>
</li>
<li>List Item 3</li>
</ol>
</li>
<li>List Item 3</li>
</ol>
</li>
<li>List Item 3</li>
</ol>
</li>
<li>List Item 3</li>
</ol>
<h3>Unordered List</h3>
<ul>
<li>List Item 1</li>
<li>
List Item 2
<ul>
<li>List Item 1</li>
<li>
List Item 2
<ul>
<li>List Item 1</li>
<li>
List Item 2
<ul>
<li>List Item 1</li>
<li>
List Item 2
<ul>
<li>List Item 1</li>
<li>List Item 2</li>
<li>List Item 3</li>
</ul>
</li>
<li>List Item 3</li>
</ul>
</li>
<li>List Item 3</li>
</ul>
</li>
<li>List Item 3</li>
</ul>
</li>
<li>List Item 3</li>
</ul>
</div>
<footer><p><a href="#top">[Top]</a></p></footer>
</article>
<article id="text__blockquotes"> <article id="text__blockquotes">
<header><h1>Blockquotes</h1></header> <header><h1>Blockquotes</h1></header>
<div> <div>
@@ -88,27 +174,23 @@
</div> </div>
<footer><p><a href="#top">[Top]</a></p></footer> <footer><p><a href="#top">[Top]</a></p></footer>
</article> </article>
<article id="text__lists"> <article id="text__details">
<header><h1>Lists</h1></header> <header><h1>Details / Summary</h1></header>
<div> <details>
<h3>Definition list</h3> <summary>Expand for details</summary>
<dl> <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Cum, odio! Odio natus ullam ad quaerat, eaque necessitatibus, aliquid distinctio similique voluptatibus dicta consequuntur animi. Quaerat facilis quidem unde eos! Ipsa.</p>
<dt>Definition List Title</dt> </details>
<dd>This is a definition list division.</dd> <footer><p><a href="#top">[Top]</a></p></footer>
</dl> </article>
<h3>Ordered List</h3> <article id="text__address">
<ol> <header><h1>Address</h1></header>
<li>List Item 1</li> <address>
<li>List Item 2</li> Written by <a href="mailto:webmaster@example.com">Jon Doe</a>.<br>
<li>List Item 3</li> Visit us at:<br>
</ol> Example.com<br>
<h3>Unordered List</h3> Box 564, Disneyland<br>
<ul> USA
<li>List Item 1</li> </address>
<li>List Item 2</li>
<li>List Item 3</li>
</ul>
</div>
<footer><p><a href="#top">[Top]</a></p></footer> <footer><p><a href="#top">[Top]</a></p></footer>
</article> </article>
<article id="text__hr"> <article id="text__hr">
@@ -214,25 +296,40 @@
</div> </div>
<footer><p><a href="#top">[Top]</a></p></footer> <footer><p><a href="#top">[Top]</a></p></footer>
</article> </article>
<article id="text__comments">
<header><h1>HTML Comments</h1></header>
<div>
<p>There is comment here: <!--This comment should not be displayed--></p>
<p>There is a comment spanning multiple tags and lines below here.</p>
<!--<p><a href="#!">This is a text link. But it should not be displayed in a comment</a>.</p>
              <p><strong>Strong is used to indicate strong importance. But, it should not be displayed in a comment</strong></p>
              <p><em>This text has added emphasis. But, it should not be displayed in a comment</em></p>-->
</div>
            <footer><p><a href="#top">[Top]</a></p></footer>
</article>
</section> </section>
<section id="embedded"> <section id="embedded">
<header><h1>Embedded content</h1></header> <header><h1>Embedded content</h1></header>
<article id="embedded__images"> <article id="embedded__images">
<header><h2>Images</h2></header> <header><h2>Images</h2></header>
<div> <div>
<h3>No <code>&lt;figure&gt;</code> element</h3> <h3>No <code>&lt;figure&gt;</code> element</h3>
<p><img src="http://placekitten.com/480/480" alt="Image alt text"></p> <p><img src="https://placekitten.com/480/480" alt="Image alt text"></p>
<h3>Wrapped in a <code>&lt;figure&gt;</code> element, no <code>&lt;figcaption&gt;</code></h3> <h3>Wrapped in a <code>&lt;figure&gt;</code> element, no <code>&lt;figcaption&gt;</code></h3>
<figure><img src="http://placekitten.com/420/420" alt="Image alt text"></figure> <figure><img src="https://placekitten.com/420/420" alt="Image alt text"></figure>
<h3>Wrapped in a <code>&lt;figure&gt;</code> element, with a <code>&lt;figcaption&gt;</code></h3> <h3>Wrapped in a <code>&lt;figure&gt;</code> element, with a <code>&lt;figcaption&gt;</code></h3>
<figure> <figure>
<img src="http://placekitten.com/420/420" alt="Image alt text"> <img src="https://placekitten.com/420/420" alt="Image alt text">
<figcaption>Here is a caption for this image.</figcaption> <figcaption>Here is a caption for this image.</figcaption>
</figure> </figure>
</div> </div>
<footer><p><a href="#top">[Top]</a></p></footer> <footer><p><a href="#top">[Top]</a></p></footer>
</article> </article>
<article id="embedded__bgimages">
<header><h2>Background images</h2></header>
<div style="background-image:url('https://placekitten.com/300/300'); width:300px; height: 300px;"></div>
<footer><p><a href="#top">[Top]</a></p></footer>
</article>
<article id="embedded__audio"> <article id="embedded__audio">
<header><h2>Audio</h2></header> <header><h2>Audio</h2></header>
<div><audio controls="">audio</audio></div> <div><audio controls="">audio</audio></div>
@@ -268,6 +365,16 @@
<div><iframe src="index.html" height="300"></iframe></div> <div><iframe src="index.html" height="300"></iframe></div>
<footer><p><a href="#top">[Top]</a></p></footer> <footer><p><a href="#top">[Top]</a></p></footer>
</article> </article>
<article id="embedded__embed">
<header><h2>Embed</h2></header>
<div><embed src="index.html" height="300"></div>
<footer><p><a href="#top">[Top]</a></p></footer>
</article>
<article id="embedded__object">
<header><h2>Object</h2></header>
<div><object data="index.html" height="300"></object></div>
<footer><p><a href="#top">[Top]</a></p></footer>
</article>
</section> </section>
<section id="forms"> <section id="forms">
<header><h1>Form elements</h1></header> <header><h1>Form elements</h1></header>
@@ -284,7 +391,7 @@
</p> </p>
<p> <p>
<label for="input__webaddress">Web Address</label> <label for="input__webaddress">Web Address</label>
<input id="input__webaddress" type="url" placeholder="http://yoursite.com"> <input id="input__webaddress" type="url" placeholder="https://yoursite.com">
</p> </p>
<p> <p>
<label for="input__emailaddress">Email Address</label> <label for="input__emailaddress">Email Address</label>
@@ -310,6 +417,10 @@
<label for="input__text4" class="valid">Valid</label> <label for="input__text4" class="valid">Valid</label>
<input id="input__text4" class="is-valid" type="text" placeholder="Text Input"> <input id="input__text4" class="is-valid" type="text" placeholder="Text Input">
</p> </p>
<p>
<label for="input__file" class="button">File Input</label>
<input id="input__file" type="file">
</p>
</fieldset> </fieldset>
<p><a href="#top">[Top]</a></p> <p><a href="#top">[Top]</a></p>
<fieldset id="forms__select"> <fieldset id="forms__select">
@@ -386,6 +497,15 @@
<label for="idtl">Datetime-local input</label> <label for="idtl">Datetime-local input</label>
<input type="datetime-local" id="idtl" value="1970-01-01T00:00"> <input type="datetime-local" id="idtl" value="1970-01-01T00:00">
</p> </p>
<p>
<label for="idl">Datalist</label>
<input type="text" id="idl" list="example-list">
<datalist id="example-list">
<option value="Example #1">
<option value="Example #2">
<option value="Example #3">
</datalist>
</p>
</fieldset> </fieldset>
<p><a href="#top">[Top]</a></p> <p><a href="#top">[Top]</a></p>
<fieldset id="forms__action"> <fieldset id="forms__action">
@@ -408,7 +528,7 @@
</section> </section>
</main> </main>
<footer role="contentinfo"> <footer role="contentinfo">
<p>Made by <a href="http://twitter.com/cbracco">@cbracco</a>. Code on <a href="http://github.com/cbracco/html5-test-page">GitHub</a>.</p> <p>Made by <a href="https://twitter.com/cbracco">@cbracco</a>. Code on <a href="https://github.com/cbracco/html5-test-page">GitHub</a>.</p>
</footer> </footer>
</div> </div>
</body> </body>

2
package.json
View File

@@ -1,6 +1,6 @@
{ {
"name": "html5-test-page", "name": "html5-test-page",
"version": "0.7.1", "version": "0.9.2",
"description": "A page filled with common HTML elements to be used for testing purposes.", "description": "A page filled with common HTML elements to be used for testing purposes.",
"main": "index.html", "main": "index.html",
"scripts": { "scripts": {