BitGoblin/Bones
1
0
Fork 0
Code Issues 5 Pull Requests Packages Projects Releases Wiki Activity

skeleton1024.css

Browse Source 
# Added 1024px support
# Removed unnecessary comments
# Minor bugfixes in column widths on smaller screens
# Compacted the whole thing
# Removed all styling (except the CSS-reset part)
This commit is contained in:
remkobrenters 2014-01-10 22:56:11 +01:00
parent 7ab682091d
commit 0931e80bd1
1 changed files with 585 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

585
stylesheets/skeleton1024.css Normal file
View File

@ -0,0 +1,585 @@
/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
.scale-with-grid {
max-width: 100%;
height: auto;
}
.container {
position: relative;
width: 1024px;
margin: 0 auto;
padding: 0;
}
.container .column,
.container .columns {
float: left;
display: inline;
margin-left: 10px;
margin-right: 10px;
}
.row {
margin-bottom: 20px;
}
.column.alpha, .columns.alpha {
margin-left: 0;
}
.column.omega, .columns.omega {
margin-right: 0;
}
.container .one.column,
.container .one.columns {
width: 64px;
}
.container .two.columns {
width: 108px;
}
.container .three.columns {
width: 172px;
}
.container .four.columns {
width: 236px;
}
.container .five.columns {
width: 300px;
}
.container .six.columns {
width: 364px;
}
.container .seven.columns {
width: 428px;
}
.container .eight.columns {
width: 492px;
}
.container .nine.columns {
width: 556px;
}
.container .ten.columns {
width: 620px;
}
.container .eleven.columns {
width: 684px;
}
.container .twelve.columns {
width: 748px;
}
.container .thirteen.columns {
width: 812px;
}
.container .fourteen.columns {
width: 876px;
}
.container .fifteen.columns {
width: 940px;
}
.container .sixteen.columns {
width: 1004px;
}
.container .offset-by-one {
padding-left: 64px;
}
.container .offset-by-two {
padding-left: 128px;
}
.container .offset-by-three {
padding-left: 192px;
}
.container .offset-by-four {
padding-left: 256px;
}
.container .offset-by-five {
padding-left: 320px;
}
.container .offset-by-six {
padding-left: 384px;
}
.container .offset-by-seven {
padding-left: 448px;
}
.container .offset-by-eight {
padding-left: 512px;
}
.container .offset-by-nine {
padding-left: 576px;
}
.container .offset-by-ten {
padding-left: 640px;
}
.container .offset-by-eleven {
padding-left: 704px;
}
.container .offset-by-twelve {
padding-left: 768px;
}
.container .offset-by-thirteen {
padding-left: 832px;
}
.container .offset-by-fourteen {
padding-left: 896px;
}
.container .offset-by-fifteen {
padding-left: 960px;
}
@media only screen and (min-width: 959px) and (max-width: 1024px) {
.container {
width: 960px;
}
.container .one.column,
.container .one.columns {
width: 40px;
}
.container .two.columns {
width: 100px;
}
.container .three.columns {
width: 160px;
}
.container .four.columns {
width: 220px;
}
.container .five.columns {
width: 280px;
}
.container .six.columns {
width: 340px;
}
.container .seven.columns {
width: 400px;
}
.container .eight.columns {
width: 460px;
}
.container .nine.columns {
width: 520px;
}
.container .ten.columns {
width: 580px;
}
.container .eleven.columns {
width: 640px;
}
.container .twelve.columns {
width: 700px;
}
.container .thirteen.columns {
width: 760px;
}
.container .fourteen.columns {
width: 820px;
}
.container .fifteen.columns {
width: 880px;
}
.container .sixteen.columns {
width: 940px;
}
.container .offset-by-one {
padding-left: 60px;
}
.container .offset-by-two {
padding-left: 120px;
}
.container .offset-by-three {
padding-left: 180px;
}
.container .offset-by-four {
padding-left: 240px;
}
.container .offset-by-five {
padding-left: 300px;
}
.container .offset-by-six {
padding-left: 360px;
}
.container .offset-by-seven {
padding-left: 420px;
}
.container .offset-by-eight {
padding-left: 480px;
}
.container .offset-by-nine {
padding-left: 540px;
}
.container .offset-by-ten {
padding-left: 600px;
}
.container .offset-by-eleven {
padding-left: 660px;
}
.container .offset-by-twelve {
padding-left: 720px;
}
.container .offset-by-thirteen {
padding-left: 780px;
}
.container .offset-by-fourteen {
padding-left: 840px;
}
.container .offset-by-fifteen {
padding-left: 900px;
}
}
@media only screen and (min-width: 768px) and (max-width: 959px) {
.container {
width: 768px;
}
.container .column,
.container .columns {
margin-left: 10px;
margin-right: 10px;
}
.column.alpha, .columns.alpha {
margin-left: 0;
margin-right: 10px;
}
.column.omega, .columns.omega {
margin-right: 0;
margin-left: 10px;
}
.alpha.omega {
margin-left: 0;
margin-right: 0;
}
.container .one.column,
.container .one.columns {
width: 28px;
}
.container .two.columns {
width: 76px;
}
.container .three.columns {
width: 124px;
}
.container .four.columns {
width: 172px;
}
.container .five.columns {
width: 220px;
}
.container .six.columns {
width: 268px;
}
.container .seven.columns {
width: 316px;
}
.container .eight.columns {
width: 364px;
}
.container .nine.columns {
width: 412px;
}
.container .ten.columns {
width: 460px;
}
.container .eleven.columns {
width: 508px;
}
.container .twelve.columns {
width: 556px;
}
.container .thirteen.columns {
width: 604px;
}
.container .fourteen.columns {
width: 652px;
}
.container .fifteen.columns {
width: 700px;
}
.container .sixteen.columns {
width: 748px;
}
.container .one-third.column {
width: 236px;
}
.container .two-thirds.column {
width: 492px;
}
.container .offset-by-one {
padding-left: 48px;
}
.container .offset-by-two {
padding-left: 96px;
}
.container .offset-by-three {
padding-left: 144px;
}
.container .offset-by-four {
padding-left: 192px;
}
.container .offset-by-five {
padding-left: 240px;
}
.container .offset-by-six {
padding-left: 288px;
}
.container .offset-by-seven {
padding-left: 336px;
}
.container .offset-by-eight {
padding-left: 384px;
}
.container .offset-by-nine {
padding-left: 432px;
}
.container .offset-by-ten {
padding-left: 480px;
}
.container .offset-by-eleven {
padding-left: 528px;
}
.container .offset-by-twelve {
padding-left: 576px;
}
.container .offset-by-thirteen {
padding-left: 624px;
}
.container .offset-by-fourteen {
padding-left: 672px;
}
.container .offset-by-fifteen {
padding-left: 720px;
}
}
@media only screen and (max-width: 767px) {
.container {
width: 300px;
}
.container .columns,
.container .column {
margin: 0;
}
.container .one.column,
.container .one.columns,
.container .two.columns,
.container .three.columns,
.container .four.columns,
.container .five.columns,
.container .six.columns,
.container .seven.columns {
width: 270px;
}
.container .eight.columns,
.container .nine.columns,
.container .ten.columns,
.container .eleven.columns,
.container .twelve.columns,
.container .thirteen.columns,
.container .fourteen.columns,
.container .fifteen.columns,
.container .sixteen.columns,
.container .one-third.column,
.container .two-thirds.column {
width: 280px;
}
/* Offsets */
.container .offset-by-one,
.container .offset-by-two,
.container .offset-by-three,
.container .offset-by-four,
.container .offset-by-five,
.container .offset-by-six,
.container .offset-by-seven,
.container .offset-by-eight,
.container .offset-by-nine,
.container .offset-by-ten,
.container .offset-by-eleven,
.container .offset-by-twelve,
.container .offset-by-thirteen,
.container .offset-by-fourteen,
.container .offset-by-fifteen {
padding-left: 0;
}
}
@media only screen and (min-width: 480px) and (max-width: 767px) {
.container {
width: 420px;
}
.container .columns,
.container .column {
margin: 0;
}
.container .one.column,
.container .one.columns,
.container .two.columns,
.container .three.columns,
.container .four.columns,
.container .five.columns,
.container .six.columns,
.container .seven.columns {
width: 390px;
}
.container .eight.columns,
.container .nine.columns,
.container .ten.columns,
.container .eleven.columns,
.container .twelve.columns,
.container .thirteen.columns,
.container .fourteen.columns,
.container .fifteen.columns,
.container .sixteen.columns,
.container .one-third.column,
.container .two-thirds.column {
width: 400px;
}
}
.container:after {
content: "\0020";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearfix:before,
.clearfix:after,
.row:before,
.row:after {
content: '\0020';
display: block;
overflow: hidden;
visibility: hidden;
width: 0;
height: 0;
}
.row:after,
.clearfix:after {
clear: both;
}
.row,
.clearfix {
zoom: 1;
}
.clear {
clear: both;
display: block;
overflow: hidden;
visibility: hidden;
width: 0;
height: 0;
}