-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
88a0a6e
commit 4d9829a
Showing
13 changed files
with
400 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,40 @@ | ||
| .___ .__ __ .__ .__ .__ | ||
| | | ____ |__|/ |_|__|____ | | |__|______________ | ||
| | |/ \| \ __\ \__ \ | | | \___ /\_ __ \ | ||
| | | | \ || | | |/ __ \| |_| |/ / | | \/ | ||
| |___|___| /__||__| |__(____ /____/__/_____ \ |__| | ||
| \/ \/ \/ | ||
|
|
||
| Your HTML5 project is almost ready! This is a little list of what you still have to do: | ||
|
|
||
| - Change lang="en" in the <html> tag if your page is not in English | ||
|
|
||
| - Fill: | ||
| <title></title> | ||
| <meta name="description" content=""> | ||
| <meta name="author" content=""> | ||
|
|
||
| - Change the favicons | ||
|
|
||
| - Remove the jQuery test in index.html and script.js, and the link to this TODO list. | ||
|
|
||
| - Make a 404.html page if you have a 404 redirection in your server configuration file | ||
|
|
||
| == Recommendations and usage ===== | ||
|
|
||
| - Use CSS versionning to force the cache refresh: | ||
| <link rel="stylesheet" href="css/style.css?v=[current_version]"> | ||
|
|
||
| - To fix the PNG background image of an element in IE6, add the .png_bg class to this element. | ||
|
|
||
| - To apply a particular style to an element in a specific version of Internet Explorer, | ||
| use the .ie6, .ie7, .ie8 and .ie9 in the CSS selector for this element: | ||
|
|
||
| .ie6 #myelement{ | ||
| margin-left: 20px; | ||
| } | ||
|
|
||
| == Contact ======================= | ||
|
|
||
| Please let me know your feedback with a tweet to @jverrecchia or send a mail to initializr@gmail.com ! | ||
| Enjoy ;) |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,256 @@ | ||
|
|
||
| /* ==== Scroll down to find where to put your styles :) ==== */ | ||
|
|
||
| /* HTML5 ✰ Boilerplate */ | ||
|
|
||
| html, body, div, span, object, iframe, | ||
| h1, h2, h3, h4, h5, h6, p, blockquote, pre, | ||
| abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, | ||
| small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, | ||
| fieldset, form, label, legend, | ||
| table, caption, tbody, tfoot, thead, tr, th, td, | ||
| article, aside, canvas, details, figcaption, figure, | ||
| footer, header, hgroup, menu, nav, section, summary, | ||
| time, mark, audio, video { | ||
| margin: 0; | ||
| padding: 0; | ||
| border: 0; | ||
| font-size: 100%; | ||
| font: inherit; | ||
| vertical-align: baseline; | ||
| } | ||
|
|
||
| article, aside, details, figcaption, figure, | ||
| footer, header, hgroup, menu, nav, section { | ||
| display: block; | ||
| } | ||
|
|
||
| blockquote, q { quotes: none; } | ||
| blockquote:before, blockquote:after, | ||
| q:before, q:after { content: ''; content: none; } | ||
| ins { background-color: #ff9; color: #000; text-decoration: none; } | ||
| mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; } | ||
| del { text-decoration: line-through; } | ||
| abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; } | ||
| table { border-collapse: collapse; border-spacing: 0; } | ||
| hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; } | ||
| input, select { vertical-align: middle; } | ||
|
|
||
| body { font:13px/1.231 sans-serif; *font-size:small; } | ||
| select, input, textarea, button { font:99% sans-serif; } | ||
| pre, code, kbd, samp { font-family: monospace, sans-serif; } | ||
|
|
||
| html { overflow-y: scroll; } | ||
| a:hover, a:active { outline: none; } | ||
| ul, ol { margin-left: 2em; } | ||
| ol { list-style-type: decimal; } | ||
| nav ul, nav li { margin: 0; list-style:none; list-style-image: none; } | ||
| small { font-size: 85%; } | ||
| strong, th { font-weight: bold; } | ||
| td { vertical-align: top; } | ||
|
|
||
| sub, sup { font-size: 75%; line-height: 0; position: relative; } | ||
| sup { top: -0.5em; } | ||
| sub { bottom: -0.25em; } | ||
|
|
||
| pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; padding: 15px; } | ||
| textarea { overflow: auto; } | ||
| .ie6 legend, .ie7 legend { margin-left: -7px; } | ||
| input[type="radio"] { vertical-align: text-bottom; } | ||
| input[type="checkbox"] { vertical-align: bottom; } | ||
| .ie7 input[type="checkbox"] { vertical-align: baseline; } | ||
| .ie6 input { vertical-align: text-bottom; } | ||
| label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; } | ||
| button, input, select, textarea { margin: 0; } | ||
| input:valid, textarea:valid { } | ||
| input:invalid, textarea:invalid { border-radius: 1px; -moz-box-shadow: 0px 0px 5px red; -webkit-box-shadow: 0px 0px 5px red; box-shadow: 0px 0px 5px red; } | ||
| .no-boxshadow input:invalid, .no-boxshadow textarea:invalid { background-color: #f0dddd; } | ||
|
|
||
| ::-moz-selection{ background: #FF5E99; color:#fff; text-shadow: none; } | ||
| ::selection { background:#FF5E99; color:#fff; text-shadow: none; } | ||
| a:link { -webkit-tap-highlight-color: #FF5E99; } | ||
|
|
||
| button { width: auto; overflow: visible; } | ||
| .ie7 img { -ms-interpolation-mode: bicubic; } | ||
|
|
||
| body, select, input, textarea { color: #444; } | ||
| h1, h2, h3, h4, h5, h6 { font-weight: bold; } | ||
| a, a:active, a:visited { color: #607890; } | ||
| a:hover { color: #036; } | ||
|
|
||
| /* | ||
| // ========================================== \\ | ||
| || || | ||
| || Your styles ! || | ||
| || || | ||
| \\ ========================================== // | ||
| */ | ||
|
|
||
| body{ | ||
| font-family:Helvetica, Helvetica Neue, Arial, sans-serif; | ||
| } | ||
|
|
||
| .wrapper{ | ||
| margin:auto; | ||
| width:960px; | ||
| } | ||
|
|
||
| #header-container{ | ||
| background-color:#f16529; | ||
| height:130px; | ||
| border-bottom:20px solid #e44d26; | ||
| margin-bottom:50px; | ||
| -webkit-box-shadow:0 40px 40px -40px #AAA; | ||
| -moz-box-shadow:0 40px 40px -40px #AAA; | ||
| box-shadow:0 40px 40px -40px #AAA; | ||
| } | ||
|
|
||
| h2, h3{ | ||
| margin:30px 0; | ||
| } | ||
|
|
||
| #title, h2, h3{ | ||
| font-weight:normal; | ||
| } | ||
|
|
||
| #title{ | ||
| font-size: 80px; | ||
| color:white; | ||
| padding-top:35px; | ||
| float:left; | ||
| } | ||
|
|
||
| h2{ | ||
| font-size: 55px; | ||
| } | ||
|
|
||
| h3{ | ||
| font-size: 40px; | ||
| } | ||
|
|
||
| nav{ | ||
| float:right; | ||
| margin-top:100px; | ||
| } | ||
|
|
||
| nav ul, nav ul li{ | ||
| display:inline; | ||
| } | ||
|
|
||
| nav a{ | ||
| padding:20px; | ||
| color:white; | ||
| text-decoration:none; | ||
| background-color:#e44d26; | ||
| } | ||
|
|
||
| aside{ | ||
| color:white; | ||
| padding:20px; | ||
| float:right; | ||
| height:500px; | ||
| width:200px; | ||
| background-color:#f16529; | ||
| border-bottom:20px solid #e44d26; | ||
| margin-bottom:50px; | ||
| -webkit-box-shadow:0 0px 40px -10px #AAA; | ||
| -moz-box-shadow:0 0px 40px -10px #AAA; | ||
| box-shadow:0 0px 40px -10px #AAA; | ||
| } | ||
|
|
||
| #main p{ | ||
| font:16px/26px Helvetica, Helvetica Neue, Arial; | ||
| width:620px; | ||
| text-shadow:none; | ||
| } | ||
|
|
||
| #main header h2{ | ||
| padding-bottom:30px; | ||
| } | ||
|
|
||
| article header{ | ||
| margin-bottom:50px; | ||
| padding-bottom:30px; | ||
| width:700px; | ||
| -webkit-box-shadow:0 45px 60px -60px #AAA; | ||
| -moz-box-shadow:0 45px 60px -60px #AAA; | ||
| box-shadow:0 45px 60px -60px #AAA; | ||
| } | ||
|
|
||
| #footer-container{ | ||
| background-color:#f16529; | ||
| height:240px; | ||
| border-top:20px solid #e44d26; | ||
| margin-top:50px; | ||
| -webkit-box-shadow:0 -40px 40px -40px #AAA; | ||
| -moz-box-shadow:0 -40px 40px -40px #AAA; | ||
| box-shadow:0 -40px 40px -40px #AAA; | ||
| } | ||
|
|
||
| #footer-container footer{ | ||
| color:white; | ||
| } | ||
|
|
||
| .info{ | ||
| position:absolute; | ||
| top:5px; | ||
| background-color:white; | ||
| padding:10px; | ||
| } | ||
|
|
||
| #jquery-test{ | ||
| top:45px; | ||
| } | ||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
| .ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; } | ||
| .hidden { display: none; visibility: hidden; } | ||
| .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } | ||
| .visuallyhidden.focusable:active, | ||
| .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } | ||
| .invisible { visibility: hidden; } | ||
| .clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; } | ||
| .clearfix:after { clear: both; } | ||
| .clearfix { zoom: 1; } | ||
|
|
||
|
|
||
| @media all and (orientation:portrait) { | ||
|
|
||
| } | ||
|
|
||
| @media all and (orientation:landscape) { | ||
|
|
||
| } | ||
|
|
||
| @media screen and (max-device-width: 480px) { | ||
|
|
||
| /* html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; } */ | ||
| } | ||
|
|
||
|
|
||
| @media print { | ||
| * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; | ||
| -ms-filter: none !important; } | ||
| a, a:visited { color: #444 !important; text-decoration: underline; } | ||
| a[href]:after { content: " (" attr(href) ")"; } | ||
| abbr[title]:after { content: " (" attr(title) ")"; } | ||
| .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } | ||
| pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } | ||
| thead { display: table-header-group; } | ||
| tr, img { page-break-inside: avoid; } | ||
| @page { margin: 0.5cm; } | ||
| p, h2, h3 { orphans: 3; widows: 3; } | ||
| h2, h3{ page-break-after: avoid; } | ||
| } |
Binary file not shown.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,70 @@ | ||
| <!doctype html> | ||
| <!--[if lt IE 7 ]> <html lang="en" class="no-js ie6"> <![endif]--> | ||
| <!--[if IE 7 ]> <html lang="en" class="no-js ie7"> <![endif]--> | ||
| <!--[if IE 8 ]> <html lang="en" class="no-js ie8"> <![endif]--> | ||
| <!--[if IE 9 ]> <html lang="en" class="no-js ie9"> <![endif]--> | ||
| <!--[if (gt IE 9)|!(IE)]><!--> <html lang="ja" class="no-js"> <!--<![endif]--> | ||
| <head> | ||
| <meta charset="UTF-8"/> | ||
| <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/> | ||
|
|
||
| <title>Pinoco with HTML5</title> | ||
| <meta name="description" content="This is Pinoco tutorial for modern HTML."/> | ||
| <meta name="author" content="You!"/> | ||
|
|
||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"/> | ||
|
|
||
| <link rel="shortcut icon" href="/favicon.ico"/> | ||
| <link rel="apple-touch-icon" href="/apple-touch-icon.png"/> | ||
| <link rel="stylesheet" href="css/style.css?v=2"/> | ||
|
|
||
| <script src="js/libs/modernizr-1.7.min.js"></script> | ||
| </head> | ||
| <body> | ||
| <!--!<p class="info">Your HTML5 project is almost ready! Please check the <a href="TODO.txt">TODO list</a>.</p>--> | ||
| <div id="header-container"> | ||
| <header class="wrapper"> | ||
| <h1 id="title">Pioco HTML5</h1> | ||
| <nav> | ||
| <ul> | ||
| <li><a href="#">Some</a></li> | ||
| <li><a href="#">navigation</a></li> | ||
| <li><a href="#">links</a></li> | ||
| </ul> | ||
| </nav> | ||
| </header> | ||
| </div> | ||
| <div id="main" class="wrapper"> | ||
| <aside> | ||
| <h3>Something aside</h3> | ||
| </aside> | ||
| <article> | ||
| <header> | ||
| <h2>Your article heading</h2> | ||
| <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sodales urna non odio egestas tempor. Nunc vel vehicula ante. Etiam bibendum iaculis libero, eget molestie nisl pharetra in. In semper consequat est, eu porta velit mollis nec. Curabitur posuere enim eget turpis feugiat tempor. Etiam ullamcorper lorem dapibus velit suscipit ultrices. Proin in est sed erat facilisis pharetra. Pellentesque auctor neque quis nisl lacinia id rutrum lacus venenatis.</p> | ||
| </header> | ||
| <h3>A smaller heading</h3> | ||
| <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sodales urna non odio egestas tempor. Nunc vel vehicula ante. Etiam bibendum iaculis libero, eget molestie nisl pharetra in. In semper consequat est, eu porta velit mollis nec. Curabitur posuere enim eget turpis feugiat tempor. Etiam ullamcorper lorem dapibus velit suscipit ultrices. Proin in est sed erat facilisis pharetra. Pellentesque auctor neque quis nisl lacinia id rutrum lacus venenatis.</p> | ||
| <h3>A smaller heading</h3> | ||
| <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sodales urna non odio egestas tempor. Nunc vel vehicula ante. Etiam bibendum iaculis libero, eget molestie nisl pharetra in. In semper consequat est, eu porta velit mollis nec. Curabitur posuere enim eget turpis feugiat tempor. Etiam ullamcorper lorem dapibus velit suscipit ultrices. Proin in est sed erat facilisis pharetra. Pellentesque auctor neque quis nisl lacinia id rutrum lacus venenatis.</p> | ||
| <footer> | ||
| <h3>About the author</h3> | ||
| <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sodales urna non odio egestas tempor. Nunc vel vehicula ante. Etiam bibendum iaculis libero, eget molestie nisl pharetra in. In semper consequat est, eu porta velit mollis nec. Curabitur posuere enim eget turpis feugiat tempor.</p> | ||
| </footer> | ||
| </article> | ||
| </div> | ||
| <div id="footer-container"> | ||
| <footer class="wrapper"> | ||
| <h3>A nice footer</h3> | ||
| <p>Generated by <a href="http://initializr.com/">http://initializr.com/</a></p> | ||
| </footer> | ||
| </div> | ||
| <script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script> | ||
| <script>!window.jQuery && document.write(unescape('%3Cscript src="js/libs/jquery-1.5.1.min.js"%3E%3C/script%3E'))</script> | ||
| <script src="js/script.js"></script> | ||
| <!--[if lt IE 7 ]> | ||
| <script src="js/libs/dd_belatedpng.js"></script> | ||
| <script> DD_belatedPNG.fix('img, .png_bg');</script> | ||
| <![endif]--> | ||
| </body> | ||
| </html> |
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
Oops, something went wrong.