Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
tree: 5d5b9d6f58
Fetching contributors…

Cannot retrieve contributors at this time

590 lines (548 sloc) 24.822 kb
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang='en-us'>
<head>
<title>Yet Another Web App Theme</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="generator" content="Vim" />
<meta name="author" content="Esdras Mayrink"/>
<link rel="stylesheet" href="stylesheets/blueprint/screen.css" type="text/css" media="screen" />
<link rel="stylesheet" href="stylesheets/blueprint/plugins/tabs/screen.css" type="text/css" media="screen" />
<!--[if IE]> <link rel="stylesheet" href="stylesheets/blueprint/ie.css" type="text/css" media="screen, projection"> <![endif]-->
<link rel="stylesheet" href="stylesheets/base.css" type="text/css" media="screen" />
<link href="stylesheets/dropdown/dropdown.css" media="screen" rel="stylesheet" type="text/css" />
<link href="stylesheets/dropdown/default.ultimate.css" media="screen" rel="stylesheet" type="text/css" />
<script type="text/javascript" charset="utf-8" src="javascripts/jquery-1.3.min.js"></script>
<script type="text/javascript" src="javascripts/jquery.dropdown.js"></script>
</head>
<body>
<div id='top-wrapper'>
<div id='top' class='container'>
<div id='top-nav-wrapper'>
<ul class='top-nav' id='left-top-nav'>
<li class='first'><a class='mini-button' href='#'>General Stuff</a></li>
<li><a href='#' class='mini-button'>Users</a></li>
<li><a href='#' class='mini-button'>Configuration</a></li>
<li class='last'><a class='mini-button yellow' href='#'>Help</a></li>
</ul>
<ul class='top-nav' id='right-top-nav'>
<li class='append'><a href='#'>User Name</a></li>
<li class='last'><a class='mini-button red' href='#'>Logout</a></li>
</ul>
</div>
<h1 class='title'>Sim, isso deu trabalho.</h1>
<ul id='main-nav-left' class='tabs nav'>
<li class='left selected'><a href='#'>Home</a></li>
<li><a href='#'>Page1</a></li>
<li><a href='#'>Page2</a></li>
<li><a href='#'>page3</a></li>
<li class='right'><a href='#'>Page4</a></li>
</ul>
<ul id='main-nav-right' class='tabs nav'>
<li class='left'><a href='#'>Page5</a></li>
<li><a href='#'>Page6</a></li>
<li class='right selected'><a href='#'>Page7</a></li>
</ul>
</div>
</div>
<div class='container secondary-navigation'>
<div class='span-18 breadcrumb'>
<a href='#' id='start' class='item'>home</a>
<a href='#' class='item'>outro ítem</a>
<a href='#' class='item'>outro ítem um pouco maior</a>
</div>
<div class='span-6 last generic-tools'>
<a href='#' class='item'>outro ítem</a>
<a href='#' class='item'>outro ítem </a>
</div>
</div>
<div class='container secondary-navigation'>
<div class='span-18 breadcrumb'>
<a href='#' id='start' class='item'>home</a>
<a href='#' class='item'>outro ítem</a>
<a href='#' class='item'>outro ítem um pouco maior</a>
</div>
<div class='span-6 last generic-tools'>
<form class='search item'>
<span class='searchfield-left'></span>
<input type='text' value='Search' />
<span class='searchfield-right'></span>
</form>
</div>
</div>
<!-- full content with right sidebar -->
<div class='container full-content-top with-right-sidebar'></div>
<div class='container full-content with-right-sidebar'>
<div class='span-18 block'>
<div class='inner'>
<h2>Big text and cols</h2>
<h3>With right sidebar</h3>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.
</p>
<hr />
<div class='span-5 colborder'>
<h4>Some Title</h4>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
</p>
</div>
<div class='span-5 colborder'>
<h4>Some Title</h4>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
</p>
</div>
<div class='span-5 last'>
<h4>Some Title</h4>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
</p>
</div>
</div>
</div>
<div class='span-6 block'>
<ul class='content-sidebar right'>
<li class='selected'><a href='#'>Item 1</a>
<li><a href='#'>Item 1</a></li>
<li><a href='#'>Item 1</a></li>
<li><a href='#'>Item 1</a></li>
<li><a href='#'>Item 1</a></li>
</ul>
</div>
</div>
<div class='container full-content-bottom with-right-sidebar'></div>
<!-- full content with left sidebar -->
<div class='container full-content-top with-left-sidebar'></div>
<div class='container full-content with-left-sidebar'>
<div class='span-6 block'>
<form class='mini'>
<h3>Would you like to add something?</h3>
<p>Here is a mini form in wich you can add whatever you want!</p>
<label for='login'>Login: </label>
<input type='text' class='text' name='login' />
<label for='name'>Name: </label>
<input type='text' class='text' name='name' />
<label for='surname'>Surname: </label>
<input type='text' class='text' name='surname' />
<label for='description'>Description: </label>
<textarea name='description'></textarea>
<label for='gender'>Gender: </label>
<select name='gender'>
<option value='male'>Male</option>
<option value='female'>Female</option>
</select>
<input type='submit' class='mini-button' value='Add'/>
</form>
</div>
<div class='span-18 block'>
<div class='inner divider'>
<h2>A big list with avatar</h2>
<ul class='big-list'>
<li class='clearfix'>
<div class='span-2'>
<img src='images/avatar.png' class='avatar' />
</div>
<div class='span-15 last'>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.
</div>
</li>
<li class='clearfix'>
<div class='span-2'>
<img src='images/avatar.png' class='avatar' />
</div>
<div class='span-15 last'>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.
</div>
</li>
</ul>
</div>
<div class='inner'>
<h3>Mini Lists</h3>
<div class='span-4'>
<h5>List Title</h5>
<ul class='mini-list'>
<li>some item</li>
<li>another item</li>
<li>third item</li>
<li>one more item</li>
<li>and the last one</li>
</ul>
</div>
<div class='span-4'>
<h5>List Title</h5>
<ul class='mini-list'>
<li>some item</li>
<li>another item</li>
<li>third item</li>
<li>one more item</li>
<li>and the last one</li>
</ul>
</div>
<div class='span-4'>
<h5>List Title</h5>
<ul class='mini-list'>
<li>some item</li>
<li>another item</li>
<li>third item</li>
<li>one more item</li>
<li>and the last one</li>
</ul>
</div>
<div class='span-4'>
<h5>List Title</h5>
<ul class='mini-list'>
<li>some item</li>
<li>another item</li>
<li>third item</li>
<li>one more item</li>
<li>and the last one</li>
</ul>
</div>
</div>
</div>
</div>
<div class='container full-content-bottom with-left-sidebar'></div>
<div class='container full-content-top'></div>
<div class='container full-content'>
<div class='inner full-content-top-tools divider'>
<div class='span-15'>
<h2>Linsting some entity</h2>
</div>
<div class='span-4 tool last'>
<form class='search item'>
<span class='searchfield-left'></span>
<input type='text' value='Search' />
<span class='searchfield-right'></span>
</form>
</div>
<div class='span-4 tool last'>
<a class='new-entity'>CADASTRAR</a>
</div>
</div>
<div class='inner'>
<table class="big-table">
<tr>
<th class="first"><input type="checkbox" class="checkbox toggle" /></th>
<th>Status</th>
<th>Date</th>
<th>Name</th>
<th>Description</th>
<th class="last">
<ul class='actions-nav'>
<li><a class='mini-button red' href="#">destroy</a></li>
</ul>
</th>
</tr>
<tr class="odd">
<td class='first'>
<input type="checkbox" class="checkbox" name="id" value="1" />
</td>
<td><span class='label'>PENDING</span></td>
<td>09/03/2009</td>
<td>Anonimous</td>
<td>
Nullam mattis, odio ut tempus facilisis, metus nisl facilisis metus, auctor
consectetuer felis ligula nec mauris. Vestibulum odio erat, fermentum at,
commodo vitae, ultrices et, urna. Mauris vulputate, mi pulvinar sagittis
condimentum, sem nulla aliquam velit, sed imperdiet mi purus eu magna.
Nulla varius metus ut eros. Aenean aliquet magna eget orci.
Class aptent taciti sociosqu ad litora.
</td>
<td class="last">
<ul class='actions-nav'>
<li><a class='mini-button' href="#">edit</a></li>
</ul>
</td>
</tr>
<tr class="even">
<td class='first'>
<input type="checkbox" class="checkbox" name="id" value="1" />
</td>
<td><span class='label red'>DELAYED</span></td>
<td>09/05/2009</td>
<td>João Frango</td>
<td>
Nullam mattis, odio ut tempus facilisis, metus nisl facilisis metus, auctor
commodo vitae, ultrices et, urna. Mauris vulputate, mi pulvinar sagittis
condimentum, sem nulla aliquam velit, sed imperdiet mi purus eu magna.
Nulla varius metus ut eros. Aenean aliquet magna eget orci.
</td>
<td class="last">
<ul class='actions-nav'>
<li><a class='mini-button' href="#">edit</a></li>
</ul>
</td>
</tr>
<tr class="odd">
<td class='first'>
<input type="checkbox" class="checkbox" name="id" value="1" />
</td>
<td><span class='label yellow'>INCOMING</span></td>
<td>09/05/2009</td>
<td>Zé das Coves</td>
<td>
Nullam mattis, odio ut tempus facilisis, metus nisl facilisis metus, auctor
commodo vitae, ultrices et, urna. Mauris vulputate, mi pulvinar sagittis
Nulla varius metus ut eros. Aenean aliquet magna eget orci.
Class aptent taciti sociosqu ad litora.
</td>
<td class="last">
<ul class='actions-nav'>
<li><a class='mini-button' href="#">edit</a></li>
</ul>
</td>
</tr>
<tr class="even">
<td class='first'>
<input type="checkbox" class="checkbox" name="id" value="1" />
</td>
<td><span class='label green'>OK</span></td>
<td>09/05/2009</td>
<td>Maria das Dores</td>
<td>
Nullam mattis, odio ut tempus facilisis, metus nisl facilisis metus, auctor
consectetuer felis ligula nec mauris. Vestibulum odio erat, fermentum at,
commodo vitae, ultrices et, urna. Mauris vulputate, mi pulvinar sagittis
condimentum, sem nulla aliquam velit, sed imperdiet mi purus eu magna.
Nulla varius metus ut eros. Aenean aliquet magna eget orci.
</td>
<td class="last">
<ul class='actions-nav'>
<li><a class='mini-button' href="#">edit</a></li>
</ul>
</td>
</tr>
</table>
</div>
</div>
<div class='container full-content-bottom'></div>
<div class='container'>
<div class='half-content-wrapper span-17'>
<div class='half-content-top title'>
<div class='span-14'>
<h2>Entity Title</h2>
</div>
<div class='title-right-tools span-3 last'>
<a class='item' href='#'>delete</a>
<a class='item' href='#'>edit</a>
</div>
</div>
<div class='half-content'>
<div class='additional-tools divider clearfix'>
</div>
<div class='inner divider'>
<h3>Table</h3>
<table class="table">
<tr>
<th class="first"><input type="checkbox" class="checkbox toggle" /></th>
<th>ID</th>
<th>Login</th>
<th>Name</th>
<th>Surname</th>
<th class="last">
<ul class='actions-nav'>
<li><a class='mini-button red' href="#">destroy</a></li>
</ul>
</th>
</tr>
<tr class="odd">
<td class='first'>
<input type="checkbox" class="checkbox" name="id" value="1" />
</td>
<td>1</td>
<td>hulk</td>
<td>Hulk</td>
<td>Hogan</td>
<td class="last">
<ul class='actions-nav'>
<li><a class='mini-button' href="#">show</a></li>
<li><a class='mini-button' href="#">edit</a></li>
<li><a class='mini-button' href="#">destroy</a></li>
</ul>
</td>
</tr>
<tr class="even">
<td class='first'>
<input type="checkbox" class="checkbox" name="id" value="1" />
</td>
<td>2</td>
<td>ultimate</td>
<td>Ultimate</td>
<td>Warrior</td>
<td class="last">
<ul class='actions-nav'>
<li><a class='mini-button green' href="#">show</a></li>
<li><a class='mini-button green' href="#">edit</a></li>
<li><a class='mini-button green' href="#">destroy</a></li>
</ul>
</td>
</tr>
<tr class="odd">
<td class='first'>
<input type="checkbox" class="checkbox" name="id" value="1" />
</td>
<td>3</td>
<td>andre</td>
<td>Andre</td>
<td>The Giant</td>
<td class="last">
<ul class='actions-nav'>
<li><a class='mini-button black' href="#">show</a></li>
<li><a class='mini-button black' href="#">edit</a></li>
<li><a class='mini-button black' href="#">destroy</a></li>
</ul>
</td>
</tr>
<tr class="even">
<td class='first'>
<input type="checkbox" class="checkbox" name="id" value="1" />
</td>
<td>4</td>
<td>machoman</td>
<td>Macho Man</td>
<td>Randy Savage</td>
<td class="last">
<ul class='actions-nav'>
<li><a class='mini-button yellow' href="#">show</a></li>
<li><a class='mini-button yellow' href="#">edit</a></li>
<li><a class='mini-button yellow' href="#">destroy</a></li>
</ul>
</td>
</tr>
</table>
</div>
<div class='inner'>
<h3>Forms</h3>
<form action="#" method="get" class="form">
<div class="group clearfix">
<label class='title'>Title text field here: </label>
<input type="text" class="title" />
</div>
<div class="group clearfix">
<label for="post_title">Some text here: </label>
<input type="text" class="text" />
</div>
<hr />
<div class="group clearfix">
<p class='radio-or-checkbox-legend'>Here we got some checkboxes, check it out xD</p>
<span class='radio-or-checkbox-container clearfix'>
<input class='checkbox' type='checkbox' name='checkbox' value='1' />
<label class='label-for-radio-or-checkbox' for='checkbox'>Check me</label>
</span>
<span class='radio-or-checkbox-container clearfix'>
<input class='checkbox' type='checkbox' name='checkbox' value='2' />
<label class='label-for-radio-or-checkbox' for='checkbox'>Check me</label>
</span>
<span class='radio-or-checkbox-container clearfix'>
<input class='checkbox' type='checkbox' name='checkbox' value='3' />
<label class='label-for-radio-or-checkbox' for='checkbox'>Check me</label>
</span>
</div>
<hr />
<div class="group clearfix">
<p class='radio-or-checkbox-legend'>Here we got some radio buttons, check it out xD</p>
<span class='radio-or-checkbox-container clearfix'>
<input class='radio' type='radio' name='radio' value='1' />
<label class='label-for-radio-or-checkbox' for='radio'>Check me</label>
</span>
<span class='radio-or-checkbox-container clearfix'>
<input class='radio' type='radio' name='radio' value='2' />
<label class='label-for-radio-or-checkbox' for='radio'>Check me</label>
</span>
<span class='radio-or-checkbox-container clearfix'>
<input class='radio' type='radio' name='radio' value='3' />
<label class='label-for-radio-or-checkbox' for='radio'>Check me</label>
</span>
</div>
<hr />
<div class="group clearfix">
<label for="select">Testing a long long label just to see the behavior: </label>
<select>
<option value='1'>option 1</option>
<option value='2'>option 2</option>
<option value='3'>option 3</option>
<option value='4'>option 4</option>
</select>
</div>
<div class="group clearfix">
<label>Text area</label>
<textarea class="text" rows="10" cols="80"></textarea>
<span class="description">Write here a long text</span>
</div>
<div class="group navform">
<input type="submit" class="save-button" value="Save" />
</div>
</form>
</div>
</div>
<div class='half-content-bottom'></div>
</div>
<div class='sidebar-wrapper span-7 last'>
<div class='sidebar-top title'>Mini Form</div>
<div class='sidebar'>
<div class='item first'>
<form class='mini'>
<label for='login'>Login: </label>
<input type='text' class='text' name='login' />
<label for='name'>Name: </label>
<input type='text' class='text' name='name' />
<label for='surname'>Surname: </label>
<input type='text' class='text' name='surname' />
<label for='description'>Description: </label>
<textarea name='description'></textarea>
<label for='gender'>Gender: </label>
<select name='gender'>
<option value='male'>Male</option>
<option value='female'>Female</option>
</select>
<input type='submit' class='mini-button' value='Add'/>
</form>
</div>
<div class='subtitle'>Sidebar Subtitle</div>
<div class='item'>
Nullam mattis, odio ut tempus facilisis, metus nisl facilisis metus, auctor
</div>
<div class='item'>
Nullam mattis, odio ut tempus facilisis, metus nisl facilisis metus, auctor
</div>
<div class='item'>
Nullam mattis, odio ut tempus facilisis, metus nisl facilisis metus, auctor
</div>
</div>
<div class='sidebar-bottom'></div>
<div class='sidebar-top'></div>
<div class='sidebar'>
<div class='item first'>
Nullam mattis, odio ut tempus facilisis, metus nisl facilisis metus, auctor
</div>
<div class='item'>
here you see a sidebar with no title Nullam mattis, odio ut tempus facilisis, metus nisl facilisis metus, auctor
</div>
<div class='item'>
here you see a sidebar with no title Nullam mattis, odio ut tempus facilisis, metus nisl facilisis metus, auctor
</div>
</div>
<div class='sidebar-bottom'></div>
</div>
</div>
</body>
</html>
Jump to Line
Something went wrong with that request. Please try again.