| 
									
										
										
										
											2011-06-30 15:15:37 +08:00
										 |  |  | /* | 
					
						
							|  |  |  |  * Scaffolding | 
					
						
							| 
									
										
										
										
											2011-06-29 05:24:02 +08:00
										 |  |  |  * Basic and global styles for generating a grid system, structural layout, and page templates | 
					
						
							| 
									
										
										
										
											2011-06-30 15:15:37 +08:00
										 |  |  |  */ | 
					
						
							| 
									
										
										
										
											2011-05-04 09:09:25 +08:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2011-06-30 15:15:37 +08:00
										 |  |  | /* Baseline Grid System | 
					
						
							|  |  |  | -------------------------------------------------- */ | 
					
						
							| 
									
										
										
										
											2011-05-04 09:09:25 +08:00
										 |  |  | 
 | 
					
						
							|  |  |  | div.row { | 
					
						
							|  |  |  |   .clearfix(); | 
					
						
							|  |  |  |   div.span1   { .columns(1); } | 
					
						
							|  |  |  |   div.span2   { .columns(2); } | 
					
						
							|  |  |  |   div.span3   { .columns(3); } | 
					
						
							|  |  |  |   div.span4   { .columns(4); } | 
					
						
							|  |  |  |   div.span5   { .columns(5); } | 
					
						
							|  |  |  |   div.span6   { .columns(6); } | 
					
						
							|  |  |  |   div.span7   { .columns(7); } | 
					
						
							|  |  |  |   div.span8   { .columns(8); } | 
					
						
							|  |  |  |   div.span9   { .columns(9); } | 
					
						
							|  |  |  |   div.span10  { .columns(10); } | 
					
						
							|  |  |  |   div.span11  { .columns(11); } | 
					
						
							|  |  |  |   div.span12  { .columns(12); } | 
					
						
							|  |  |  |   div.span13  { .columns(13); } | 
					
						
							|  |  |  |   div.span14  { .columns(14); } | 
					
						
							|  |  |  |   div.span15  { .columns(15); } | 
					
						
							|  |  |  |   div.span16  { .columns(16); } | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2011-06-30 15:15:37 +08:00
										 |  |  | /* Structural Layout | 
					
						
							|  |  |  | -------------------------------------------------- */ | 
					
						
							| 
									
										
										
										
											2011-05-04 09:09:25 +08:00
										 |  |  | 
 | 
					
						
							|  |  |  | html, body { | 
					
						
							|  |  |  |   background-color: #fff; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | body { | 
					
						
							|  |  |  |   margin: 0; | 
					
						
							| 
									
										
										
										
											2011-06-29 06:11:41 +08:00
										 |  |  |   #font > .sans-serif(normal,@basefont,@baseline); | 
					
						
							| 
									
										
										
										
											2011-05-04 09:09:25 +08:00
										 |  |  |   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: 20px; | 
					
						
							|  |  |  |   .clearfix(); | 
					
						
							|  |  |  |   div.sidebar { | 
					
						
							|  |  |  |     float: left; | 
					
						
							|  |  |  |     width: 220px; | 
					
						
							|  |  |  |   } | 
					
						
							|  |  |  |   div.content { | 
					
						
							|  |  |  |     min-width: 700px; | 
					
						
							|  |  |  |     max-width: 1180px; | 
					
						
							|  |  |  |     margin-left: 240px; | 
					
						
							|  |  |  |   } | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2011-06-30 15:15:37 +08:00
										 |  |  | /* Base Styles | 
					
						
							|  |  |  | -------------------------------------------------- */ | 
					
						
							| 
									
										
										
										
											2011-05-04 09:09:25 +08:00
										 |  |  | 
 | 
					
						
							|  |  |  | // Links | 
					
						
							|  |  |  | a { | 
					
						
							| 
									
										
										
										
											2011-06-28 07:47:12 +08:00
										 |  |  |   color: @linkColor; | 
					
						
							| 
									
										
										
										
											2011-05-04 09:09:25 +08:00
										 |  |  |   text-decoration: none; | 
					
						
							|  |  |  |   line-height: inherit; | 
					
						
							|  |  |  |   &:hover { | 
					
						
							| 
									
										
										
										
											2011-06-28 07:47:12 +08:00
										 |  |  |     color: @linkColorHover; | 
					
						
							| 
									
										
										
										
											2011-05-04 09:09:25 +08:00
										 |  |  |     text-decoration: underline; | 
					
						
							|  |  |  |   } | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | // Buttons | 
					
						
							|  |  |  | .btn { | 
					
						
							|  |  |  |   .button(); | 
					
						
							| 
									
										
										
										
											2011-06-30 04:48:08 +08:00
										 |  |  |   .transition(.1s linear all); | 
					
						
							| 
									
										
										
										
											2011-05-04 09:09:25 +08:00
										 |  |  |   &.primary { | 
					
						
							| 
									
										
										
										
											2011-06-29 02:56:49 +08:00
										 |  |  |     #gradient > .vertical(@blue, @blueDark); | 
					
						
							| 
									
										
										
										
											2011-05-04 09:09:25 +08:00
										 |  |  |     color: #fff; | 
					
						
							|  |  |  |     text-shadow: 0 -1px 0 rgba(0,0,0,.25); | 
					
						
							|  |  |  |     &:hover { | 
					
						
							|  |  |  |       color: #fff; | 
					
						
							|  |  |  |     } | 
					
						
							|  |  |  |   } | 
					
						
							|  |  |  |   &.large { | 
					
						
							|  |  |  |     font-size: 16px; | 
					
						
							| 
									
										
										
										
											2011-06-29 06:54:25 +08:00
										 |  |  |     line-height: 28px; | 
					
						
							| 
									
										
										
										
											2011-05-04 09:09:25 +08:00
										 |  |  |     .border-radius(6px); | 
					
						
							|  |  |  |   } | 
					
						
							|  |  |  |   &.small { | 
					
						
							|  |  |  |     padding-right: 9px; | 
					
						
							|  |  |  |     padding-left: 9px; | 
					
						
							|  |  |  |     font-size: 11px; | 
					
						
							|  |  |  |   } | 
					
						
							| 
									
										
										
										
											2011-06-29 06:54:25 +08:00
										 |  |  |   &:disabled, | 
					
						
							|  |  |  |   &.disabled { | 
					
						
							|  |  |  |     background-image: none; | 
					
						
							|  |  |  |     .opacity(65); | 
					
						
							|  |  |  |     cursor: default; | 
					
						
							| 
									
										
										
										
											2011-06-30 04:48:08 +08:00
										 |  |  |   } | 
					
						
							|  |  |  |   &:active { | 
					
						
							|  |  |  |     @shadow: inset 0 3px 7px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.05); | 
					
						
							|  |  |  |     .box-shadow(@shadow); | 
					
						
							|  |  |  |   } | 
					
						
							| 
									
										
										
										
											2011-05-04 09:09:25 +08:00
										 |  |  | } | 
					
						
							| 
									
										
										
										
											2011-07-01 01:40:28 +08:00
										 |  |  | // Help Firefox not be a jerk about adding extra padding to buttons | 
					
						
							| 
									
										
										
										
											2011-05-04 09:09:25 +08:00
										 |  |  | button.btn, | 
					
						
							|  |  |  | input[type=submit].btn { | 
					
						
							|  |  |  |   &::-moz-focus-inner { | 
					
						
							|  |  |  |   	padding: 0; | 
					
						
							|  |  |  |   	border: 0; | 
					
						
							|  |  |  |   } | 
					
						
							|  |  |  | } |