Bones/examples/example-1.html
Nick Pack ab9632a8ca Fixed some grid issues:
* Switched to margins for push/pull
* Removed tablet alpha and omega - they just break things

Added a couple of example files
2013-10-15 20:14:25 +01:00

57 lines
2.7 KiB
HTML

<!DOCTYPE html>
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--><html lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<title>Your Page Title Here</title>
<meta name="description" content="">
<meta name="author" content="Nick Pack">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../build/css/Ribs.min.css">
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link rel="shortcut icon" href="../build/img/favicon.ico">
<link rel="apple-touch-icon" href="../build/img/apple-touch-icon.png">
<link rel="apple-touch-icon" sizes="72x72" href="../build/img/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="../build/img/apple-touch-icon-114x114.png">
</head>
<body>
<div class="container">
<header class="sixteen columns">
<h1>Ribs</h1>
</header>
<div class="four columns">
<h3>Example 1</h3>
<nav>
<ul class="square">
<li>Docs</li>
<li>Source</li>
<li>Licence</li>
</ul>
</nav>
</div>
<div class="twelve columns">
<h3>About Ribs</h3>
<p>Ribs is a small collection of well-organized SASS 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.</p>
<p>Ribs is the evolution of the original Skeleton Project.</p>
<h3>Three Core Principles</h3>
<p>Skeleton is built on three core principles:</p>
<ul class="square">
<li><strong>A Responsive Grid Down To Mobile</strong>: Elegant scaling from a browser to tablets to mobile.</li>
<li><strong>Fast to Start</strong>: It's a tool for rapid development with best practices</li>
<li><strong>Style Agnostic</strong>: It provides the most basic, beautiful styles, but is meant to be overwritten.</li>
</ul>
</div>
<footer class="sixteen columns">
<p>Ribs is copyright &copy; 2013 - based on the original Skeleton project by Dave Gamache</p>
</footer>
</div><!-- container -->
</body>
</html>