/* * Scaffolding * Basic and global styles for generating a grid system, structural layout, and page templates * ------------------------------------------------------------------------------------------- */ // GRID SYSTEM // ----------- .row { .clearfix(); // Default columns .span1 { .columns(1); } .span2 { .columns(2); } .span3 { .columns(3); } .span4 { .columns(4); } .span5 { .columns(5); } .span6 { .columns(6); } .span7 { .columns(7); } .span8 { .columns(8); } .span9 { .columns(9); } .span10 { .columns(10); } .span11 { .columns(11); } .span12 { .columns(12); } .span13 { .columns(13); } .span14 { .columns(14); } .span15 { .columns(15); } .span16 { .columns(16); } // Offset column options .offset1 { .offset(1); } .offset2 { .offset(2); } .offset3 { .offset(3); } .offset4 { .offset(4); } .offset5 { .offset(5); } .offset6 { .offset(6); } .offset7 { .offset(7); } .offset8 { .offset(8); } .offset9 { .offset(8); } .offset10 { .offset(10); } .offset11 { .offset(11); } .offset12 { .offset(12); } } // STRUCTURAL LAYOUT // ----------------- html, body { background-color: #fff; } body { margin: 60px 0 0; // Add margin to the top of the page for the topbar #font > .sans-serif(normal,@basefont,@baseline); color: @gray; text-rendering: optimizeLegibility; } // Container (centered, fixed-width layouts) div.container { width: 940px; margin: 0 auto; } // Fluid layouts (left aligned, with sidebar, min- & max-width content) div.container-fluid { padding: 0 20px; .clearfix(); div.sidebar { float: left; width: 220px; } div.content { min-width: 700px; max-width: 1180px; margin-left: 240px; } } // BASE STYLES // ----------- // Links a { color: @linkColor; text-decoration: none; line-height: inherit; &:hover { color: @linkColorHover; text-decoration: underline; } } // Buttons .btn { .button(); .transition(.1s linear all); &.primary { #gradient > .vertical(@blue, @blueDark); color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.25); &:hover { color: #fff; } } &.large { font-size: 16px; line-height: 28px; .border-radius(6px); } &.small { padding-right: 9px; padding-left: 9px; font-size: 11px; } &:disabled, &.disabled { background-image: none; .opacity(65); cursor: default; } &:active { @shadow: inset 0 3px 7px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.05); .box-shadow(@shadow); } } // Help Firefox not be a jerk about adding extra padding to buttons button.btn, input[type=submit].btn { &::-moz-focus-inner { padding: 0; border: 0; } }