Created
November 28, 2012 21:11
-
-
Save kristopherjohnson/4164515 to your computer and use it in GitHub Desktop.
The Skeleton boilerplate index.html, translated into a Jade template
This file contains hidden or 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
| !!! 5 | |
| //if lt IE 7 | |
| <html class="ie ie6" lang="en"> | |
| //if IE 7 | |
| <html class="ie ie7" lang="en"> | |
| //if IE 8 | |
| <html class="ie ie8" lang="en"> | |
| //if (gte IE 9)|!(IE) | |
| <!--><html lang="en"> <!-- | |
| head | |
| - // Basic Page Needs | |
| - // ================================================== | |
| meta(charset="utf8") | |
| title Your Page Title Here :) | |
| meta(name="description", content="") | |
| meta(name="author", content="") | |
| - // Mobile Specific Metas | |
| - // ================================================== | |
| meta(name="viewport", content="width=device-width, initial-scale=1, maximum-scale=1") | |
| - // CSS | |
| - // ================================================== | |
| link(rel="stylesheet", "href=stylesheets/base.css") | |
| link(rel="stylesheet", "href=stylesheets/skeleton.css") | |
| link(rel="stylesheet", "href=stylesheets/layout.css") | |
| //if lt IE 9 | |
| script(src="http://html5shim.googlecode.com/svn/trunk/html5.js") | |
| - // Favicons | |
| - // ================================================== | |
| link(rel="shortcut icon", href="images/favicon.ico") | |
| link(rel="apple-touch-icon", href="images/apple-touch-icon.png") | |
| link(rel="apple-touch-icon", sizes="72x72", href="images/apple-touch-icon-72x72.png") | |
| link(rel="apple-touch-icon", sizes="114x114", href="images/apple-touch-icon-114x114.png") | |
| body | |
| - // Primary Page Layout | |
| - // ================================================== | |
| - // | |
| - // Delete everything in this .container and get started on your own site! | |
| .container | |
| .sixteen.columns | |
| h1.remove-bottom(style="margin-top: 40px") Skeleton | |
| h5 Version 1.2 | |
| hr | |
| .one-third.column | |
| h3 About Skeleton? | |
| p. | |
| Skeleton is a small collection of well-organized CSS files that | |
| can help you rapidly develop sites that look beautiful at any size, | |
| be it a 17" laptop screen or an iPhone. It's based on a responsive grid, | |
| but also provides very basic CSS for typography, buttons, forms and | |
| media queries. Go ahead, resize this super basic page to see the grid | |
| in action. | |
| .one-third.column | |
| h3 Three Core Principles | |
| p. | |
| Skeleton is built on three core principles: | |
| li. | |
| <strong>A Responsive Grid Down To Mobile</strong>: | |
| Elegant scaling from a browser to tablets to mobile. | |
| li. | |
| <strong>Fast to Start</strong>: | |
| It's a tool for rapid development with best practices | |
| li. | |
| <strong>Style Agnostic</strong>: | |
| It provides the most basic, beautiful styles, | |
| but is meant to be overwritten. | |
| .one-third.column | |
| h3 Docs & Support | |
| p. | |
| The easiest way to really get started with Skeleton is to check out | |
| the full docs and info at | |
| <a href="http://www.getskeleton.com">www.getskeleton.com.</a>. | |
| Skeleton is also open-source and has a | |
| <a href="https://github.com/dhgamache/skeleton">project on git</a>, | |
| so check that out if you want to report bugs or create a pull request. | |
| If you have any questions, thoughts, concerns or feedback, please | |
| don't hesitate to email me at | |
| <a href="mailto:[email protected]">[email protected]</a>. |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
This is the index.html file provided with the Skeleton boilerplate download (see http://getskeleton.com), translated into the Jade template language (see https://github.com/visionmedia/jade).