added more documentation, refined some of the styles and kept pushing on the organization. Still need to work on testing the hell out of it and then cleaning and deploying

This commit is contained in:
Dave Gamache
2011-05-06 13:34:14 -07:00
parent 48aa42b216
commit 7d12d78eed
18 changed files with 290 additions and 175 deletions

View File

@ -1,5 +1,5 @@
/*
* Skeleton V0.1
* Skeleton V1.0
* Created by Dave Gamache
* www.skeleton.gs
* 4/30/2011
@ -9,32 +9,46 @@
/* Documentation Styles
================================================== */
div.container {
padding-top: 40px; }
padding-top: 60px; }
/* Doc nav */
nav {
margin-left: 10px;
position: fixed; }
position: fixed;
width: inherit; }
#logo {
margin-bottom: 30px; }
margin-bottom: 30px;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
letter-spacing: -1px;
font-weight: bold;
text-align: right; }
nav ul {
margin-left: 40px;
overflow: hidden; }
float: right; }
nav ul li {
text-align: right;
display: block;
margin-bottom: 10px; }
nav ul li a {
font-size: 15px;
color:#5f5f5f;
font-size: 14px;
color: #555;
text-decoration: none;
font-weight: normal; }
nav ul li a.active {
font-weight: bold;
color: #000; }
header p {
font-size: 40px;
line-height: 45px;
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #8d8d8d; }
font-weight: bold;
padding: 3px 8px;
position: relative;
right: -8px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px; }
nav ul li a:hover {
color: #fff;
background: #222; }
nav .button {
float: right; }
header h1 {
font-size: 52px;
line-height: 61px;
letter-spacing: -1px;
font-weight: normal;
font-family: "Georgia", "Times New Roman", Helvetica, Arial, sans-serif; }
hr.large {
border: none;
height: 8px;
@ -43,6 +57,9 @@
div.doc-section {
margin: 30px 0; }
#whatAndWhy .row {
padding: 30px 0 0; }
#typography blockquote {
margin-top: 20px; }
@ -51,34 +68,72 @@
color: #999; }
.hidden-code>div {
display: none; }
figure {
float: left;
height: 220px;
margin: 10px 24px 20px 0;
position: relative; }
figure:last-child {
margin-right: 0; }
figure img {
position: absolute;
bottom: 26px; }
figure figcaption {
margin: 0 auto;
position: absolute;
bottom: 0;
font-size: 13px;
line-height: 30px;
font-weight: bold;}
figure.iphone {
width: 119px; }
figure.ipad {
width: 232px; }
figure.laptop {
width: 301px; }
/* Grid */
#grid .column,
#grid .columns {
background: #222;
background: #ddd;
height: 25px;
line-height: 25px;
margin-bottom: 10px;
text-align: center;
text-transform: uppercase;
color: #fff;
color: #555;
font-size: 12px;
font-weight: bold;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px; }
#grid .column:hover,
#grid .columns:hover {
background: #bbb;
color: #333; }
#grid .example-grid { overflow: hidden; }
.resize {
position: fixed;
bottom: 0;
right: 0;
height: 80px;
width: 80px;
background: url(images/resize.png); }
.gist-meta { display: none !important;}
/* Mobile */
@media only screen and (max-width: 767px) {
header p { font-size: 25px; line-height: 30px;}
header h1 { font-size: 34px; line-height: 37px; }
nav { position: relative; }
nav ul { display: none; }
#logo {
width: 100px;
display: block;
margin: 0 auto; }
#logo { text-align: left; }
/* #whatAndWhy img { display: none; } */
nav .button { display: none; }
}
/* Mobile Landscape */
@ -89,8 +144,10 @@
/* Non 960 */
@media only screen and (max-width: 969px) {
#logo {
max-width: 130px; }
nav ul { margin-left: 10px; }
font-size: 21px;
margin-bottom: 15px; }
nav .button {
padding: 9px 20px 11px; }
}
@ -105,6 +162,7 @@
/* Anything smaller than standard 960 */
@media only screen and (max-width: 959px) {}
/* iPad Portrait Only */
@media only screen and (min-width: 768px) and (max-width: 991px) and (max-device-width: 1000px) {}
@ -113,10 +171,11 @@
@media only screen and (max-width: 767px) and (max-device-width: 1000px) {}
/* Mobile Landscape Only */
@media only screen and (min-width: 480px) and (max-width: 767px) and (max-device-width: 1000px) {
header p {
font-size: 25px;
line-height: 30px; }
@media only screen and (min-width: 480px) and (max-width: 767px) and (max-device-width: 1000px) {}
/* Anything smaller than standard 960 on a device */
@media only screen and (max-width: 959px) and (max-device-width: 1000px) {
.resize { display: none; }
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 37 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB