Permalink
Switch branches/tags
Nothing to show
Find file
Fetching contributors…
Cannot retrieve contributors at this time
170 lines (133 sloc) 7.11 KB
<!doctype html>
<!--[if lt IE 7]>
<html class="nojs ms lt_ie7" lang="en">
<![endif]-->
<!--[if IE 7]>
<html class="nojs ms ie7" lang="en">
<![endif]-->
<!--[if IE 8]>
<html class="nojs ms ie8" lang="en">
<![endif]-->
<!--[if gt IE 8]>
<html class="nojs ms" lang="en">
<![endif]-->
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="author" content="iKreativ">
<meta name="description" content="Workless - A classy HTML5, CSS3 framework">
<meta name="keywords" content="workless, classy, css, framework, jquery, bootstrap, h5bp, twitter, bolierplate, jquery, html5, ikreativ">
<!-- Mobile Viewport -->
<meta name="viewport" content="width=device-width">
<title>Workless - A classy HTML5, CSS3 framework</title>
<!-- Googlelicious -->
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,400italic,600,700,600italic,700italic,300italic' rel='stylesheet' type='text/css'>
<!--
You'll notice that we're loading all CSS seperately. This is
not recommended. Once you've decided which parts of Workless you
are going to use, then simply copy/paste them all into a
single CSS file to reduce HTTP requests.
We've also included a PHP minification script which automatically
combines and compresses your CSS.
If you'd like to use this script simply comment/remove the style
links below, uncomment the minified statement and ensure this
is a .php file. i.e: rename index.html to index.php
-->
<!--
Comment for minification script
-->
<link href="assets/css/plugins.css" rel="stylesheet">
<link href="assets/css/workless.css" rel="stylesheet">
<link href="assets/css/typography.css" rel="stylesheet">
<link href="assets/css/forms.css" rel="stylesheet">
<link href="assets/css/tables.css" rel="stylesheet">
<link href="assets/css/buttons.css" rel="stylesheet">
<link href="assets/css/alerts.css" rel="stylesheet">
<link href="assets/css/tabs.css" rel="stylesheet">
<link href="assets/css/pagination.css" rel="stylesheet">
<link href="assets/css/breadcrumbs.css" rel="stylesheet">
<link href="assets/css/icons.css" rel="stylesheet">
<link href="assets/css/helpers.css" rel="stylesheet">
<link href="assets/css/print.css" rel="stylesheet">
<link href="assets/css/scaffolding.css" rel="stylesheet">
<link href="assets/css/application.css" rel="stylesheet">
<!--
We're minifying and combining all the CSS
<link href="assets/css/minified.css.php" rel="stylesheet">
-->
<!-- All JavaScript at the bottom, except modernizr -->
<script type="text/javascript" src="assets/js/modernizr.js"></script>
</head>
<body id="top" onload="prettyPrint()">
<!-- Prompt IE 6 users to install Chrome Frame. Remove this if you support IE 6 -->
<!--[if lt IE 7]>
<p>Your browser is <em>ancient!</em> <a href="http://browsehappy.com/">Upgrade to a different browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to experience this site.</p>
<![endif]-->
<section class="wrapper">
<header>
<h1 class="logo">
<a href="//github.com/iKreativ/workless">
{workless.css}
</a>
<small>A classy HTML5, CSS3 framework.</small>
</h1>
<div class="intro">
Workless is a classy HTML5, CSS3 framework that helps you to get your project up and running as fast as possible and tries to prevent repetitive tasks.
</div>
<div class="sub_intro">
Workless is split into seperate files to allow partial usage, include them all, or just a few, the choice is yours.
</div>
</header>
<h2>What does it do?</h2>
<ul>
<li><strong>Standardizes CSS</strong> for a wide range of HTML elements.</li>
<li><strong>Improves usability and interaction</strong> with subtle improvements.</li>
<li><strong>Sets typography</strong> to help vertical rhythm and readability.</li>
<li><strong>Adds helper classes</strong> to style elements easily.</li>
</ul>
<hr>
<h2>How do I use it?</h2>
<p>Drop the files into your project and then reference the CSS and Javascript files in your source. Once you've done this you can then begin adding your own application specific CSS.</p>
<p><strong>Don't forget!</strong> If you intend to use the entire framework ensure that you combine all the CSS stylesheets into one or two files to reduce HTTP requests. The typical file structure would look like:</p>
<pre class="zoomTarget">
&lt;link href="assets/css/plugins.css" rel="stylesheet"&gt; // all javascript plugins css
&lt;link href="assets/css/workless.css" rel="stylesheet"&gt; // main framework css
&lt;link href="assets/css/application.css" rel="stylesheet"&gt; // app specific css (your code)
&lt;link href="assets/css/responsive.css" rel="stylesheet"&gt; // media queries
</pre>
<p>This is just a suggested way to use the framework, feel free to use however you want!</p>
<hr>
<h2>Get your hands on it!</h2>
<ul class="nolist">
<li><a class="alignleft large button" href="//github.com/iKreativ/Workless"><i class="icon-inbox icon-white"></i> Workless on GitHub</a></li>
<li><a class="alignleft button pink large" href="//github.com/iKreativ/Workless/zipball/master"><i class="icon-download-alt icon-white"></i> Download .ZIP</a></li>
<li><a class="button blue large twitter-share-button" href="http://twitter.com/share" data-count="vertical" data-text="Workless.css A classy HTML5, CSS3 framework." data-via="iKreativ" data-related="iKreativ"><i class="icon-share icon-white"></i> Share on Twitter</a></li>
</ul>
<p>You can also clone the repo on GitHub</p>
<pre class="zoomTarget">$ git clone git@github.com:iKreativ/Workless.git</pre>
<p>Feel free to fork, use, abuse and modify to suit your project. Found a bug? <a href="//github.com/iKreativ/Workless">Submit a pull request!</a></p>
<hr>
<footer>
<p class="small muted">A project by <a href="//ikreativ.com">Scott Parry</a> (<a href="//twitter.com/iKreativ">@iKreativ</a>). Originally based off <a href="//html5boilerplate.com/">H5BP</a> and <a href="//twitter.github.com/bootstrap/">Bootstrap</a>. Released under the <a href="//philsturgeon.co.uk/code/dbad-license/">DBAD License</a>.</p>
</footer>
</section>
<!-- JavaScript at the bottom for fast page loading -->
<!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if offline -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="assets/js/jquery.js"><\/script>')</script>
<!-- scripts -->
<script src="assets/js/plugins.js"></script>
<script src="assets/js/application.js"></script>
<!-- /scripts -->
<!-- Asynchronous Google Analytics snippet. Change UA-XXXXX-X to be your site's ID -->
<script>
var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']];
(function(d,t){
var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
s.parentNode.insertBefore(g,s)
}(document,'script'));
</script>
</body>
</html>