Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
branch: master
Fetching contributors…

Cannot retrieve contributors at this time

284 lines (246 sloc) 11.964 kb
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<!--[if lt IE 7 ]> <html class="ie6"> <![endif]-->
<!--[if IE 7 ]> <html class="ie7"> <![endif]-->
<!--[if IE 8 ]> <html class="ie8"> <![endif]-->
<!--[if IE 9 ]> <html class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html class=""> <!--<![endif]-->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>EVO Generic Elements</title>
<link rel="stylesheet" type="text/css" href="wordpress/wp-content/themes/Scaffolding/css/reset.css" media="screen" />
<link rel="stylesheet" type="text/css" href="wordpress/wp-content/themes/Scaffolding/css/grid.css" media="screen" />
<link rel="stylesheet" type="text/css" href="wordpress/wp-content/themes/Scaffolding/css/stickyfooter.css" media="screen" />
<link rel="stylesheet" type="text/css" href="wordpress/wp-content/themes/Scaffolding/css/j-base2.css" media="screen" />
<link rel="stylesheet" type="text/css" href="wordpress/wp-content/themes/Scaffolding/css/j-base-testpage.css" media="screen" />
<link rel="stylesheet" type="text/css" href="wordpress/wp-content/themes/evo/style.css" media="screen" />
<script type="text/javascript">
document.documentElement.className = "js";
</script>
<script type="text/javascript" src="wordpress/wp-content/themes/Scaffolding/js/jquery-1.6.1.js"></script>
<script type="text/javascript" src="wordpress/wp-content/themes/Scaffolding/js/jquery.ie6MultipleClass.min.js"></script>
<script type="text/javascript" src="wordpress/wp-content/themes/Scaffolding/js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="wordpress/wp-content/themes/Scaffolding/js/selectivizr-min.js"></script>
<script type="text/javascript" src="wordpress/wp-content/themes/Scaffolding/js/togglegrid.js"></script>
<script type="text/javascript" src="wordpress/wp-content/themes/evo/js/app.js"></script>
<!--[if (gte IE 6)&(lte IE 8)]>
<script type="text/javascript" src="selectivizr.js"></script>
<![endif]-->
</head>
<body>
<div><a class="trigger" href="javascript:func()">Grid</a></div>
<div id="wrap" class="jbasewrap png_bg">
<div class="grid24col png_bg">
<h1 class="margintop fixed">EVO website Stylebook</h1>
<hr />
<br />
<br />
<br />
<div id="header">
<div class="grid6col left"><a href="#" class="logo left"><img src="wordpress/wp-content/themes/evo/images/logo.png" alt="EVO" /></a></div>
<ul id="nav" class="left margintop">
<li>
<ul class="nav grid4col left">
<li id="menu-count-0">Information For
<ul>
<li><a href="#">one</a></li>
<li><a href="#">one</a></li>
<li><a href="#">one</a></li>
</ul>
</li>
</ul>
</li>
<li>
<ul class="nav grid4col left">
<li>
<a href="#">Cloud Computing</a>
</li>
<li>
<a href="#">EVOp cloud services and portals</a>
</li>
<li>
<a href="#">Environmental issues</a>
</li>
</ul>
</li>
<li>
<ul class="nav grid4col left">
<li>
<a href="#">Project Resources</a>
</li>
<li>
<a href="#">About EVOp</a>
</li>
<li>
<a href="#">Who's Involved</a>
</li>
</ul>
</li>
</ul>
<div id="search" class="grid6col left box darkgrey marginleft">
<input type="text" value="Search" />
<ul>
<li><a href="#">News</a></li>
<li><a href="#">Contact Us</a></li>
<li><a href="#">Twitter</a></li>
</ul>
</div>
</div>
<div class="grid12col left push2">
<h2 class="fixed">Normal Content Headers</h2>
<hr />
<h1>Heading 1</h1><hr />
<h2>Heading 2</h2><hr />
<h3>Heading 3</h3><hr />
<h4>Heading 4</h4><hr />
<h5>Heading 5</h5><hr />
<h6>Heading 6</h6><hr />
</div>
<div class="grid12col left marginleft box">
<h2 class="fixed">Boxed Headers</h2>
<hr />
<h1>Heading 1</h1><hr />
<h2>Heading 2</h2><hr />
<h3>Heading 3</h3><hr />
<h4>Heading 4</h4><hr />
<h5>Heading 5</h5><hr />
<h6>Heading 6</h6><hr />
</div>
<br class="clearboth"/>
<br />
<br />
<br />
<div class="grid12col left">
<h2 class="fixed">Article Text</h2>
<div class="article">
<h1><span class="subhead">Subtitle</span>The Title</h1>
<div class="grid3col sharing">
<a id="facebook" href="#">Share on Facebook</a>
<a id="twitter" href="#">Share on Twitter</a>
<a id="email" href="#">Share by email</a>
<a id="print" href="#">Print this page</a>
</div>
<p class="large">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.</p>
<p>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet.</p>
<a class="block" href="#">Data access, management and security</a>
<a class="block" href="#">Data access, management and security</a>
<h6>H6 Subheader</h6>
<p>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet.</p>
<ul>
<li>List Items</li>
<li>List Items</li>
<li>List Items</li>
<li>List Items andomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn</li>
</ul>
</div>
<h2 class="fixed">Body Text</h2>
<hr />
<p>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet.</p>
<h2 class="fixed">Small Text</h2>
<hr />
<p class="small">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet.</p>
<h2 class="fixed">Blockquote</h2>
<hr />
<blockquote class="marginbottom">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.</blockquote>
<h2 class="fixed">Standfirst</h2>
<hr />
<p class="large">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.</p>
<h2 class="fixed">Captions for Images</h2>
<hr />
<div class="caption grid6col left box"><span>This is a caption</span></div>
<br class="clearboth"/>
<br/>
<h2 class="fixed">Meta</h2>
<hr />
</div>
<div class="grid12col left marginleft">
<h2 class="fixed">Links</h2>
<hr />
<a href="#">body text link</a>
<br />
<a class="readMore" href="#">Read More</a>
<ul class="sidebar margintop grid6col">
<li class="active"><a href="#">Active Menu Link</a></li>
<li><a href="#">A Menu Link With a Longer Title</a></li>
<li><a href="#">Menu Link</a></li>
</ul>
<h2 class="fixed">Breadcrumb Nav</h2>
<ul class="breadcrumb">
<li><a href="#">A Menu Link</a></li>
<li><a href="#">A Menu Link With a Longer Title</a></li>
<li><a href="#">Another Menu Link</a></li>
</ul>
<h2 class="fixed margintop">Lists</h2>
<hr />
<ul>
<li>Unordered list test</li>
<li>Another list element. Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
<li><a href="#">a link in the list</a></li>
<li>Some long text. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Lorem ipsum dolor sit amet, consectetur adipisicing elit.</li>
</ul>
<ol>
<li>Ordered list test</li>
<li>Another list element</li>
<li>Yet another element in the list</li>
</ol>
<ol>
<li>Ordered list</li>
<li>Here's a nested unordered list
<ul>
<li>Nested Unordered list</li>
<li>Nested ordered list
<ol>
<li>The first</li>
<li>And the second</li>
</ol>
</li>
</ul>
</li>
<li>Ordered List item</li>
<li>Nested Ordered list
<ol>
<li>Some point</li>
<li>Nested Unordered list
<ul>
<li>The first</li>
<li>And the second</li>
</ul>
</li>
</ol>
</li>
</ol>
<section class="border box">
<header>
<h2 class="fixed">Box with top and bottom borders</h2>
</header>
<p>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet.</p>
</section>
<section class="border box grey">
<header>
<h2 class="fixed">Box with top and bottom borders</h2>
</header>
<p>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet.</p>
</section>
</div>
<br class="clearboth"/>
<br/>
</div>
<br class="clearboth" />
<div class="push"></div>
</div>
<div id="footer" class="footer">
<div class="jbasewrap overflow">
<div class="grid12col margintop">
<ul class="links">
<li><a href="#">Footer link</a></li>
<li><a href="#">Footer nav link</a></li>
</ul>
</div>
</div>
</div>
<!--[if lt IE 7 ]>
<script src="wordpress/wp-content/themes/Scaffolding/js/dd_belatedpng.js"></script>
<script>DD_belatedPNG.fix("img, .png_bg"); // Fix any <img> or .png_bg bg-images. Also, please read goo.gl/mZiyb </script>
<![endif]-->
</body>
</html>
Jump to Line
Something went wrong with that request. Please try again.