//	----------------------------------------------------------------------------------------------------------------
//
//	Graphpaper's Grid System
//	========================
//
//	Based on Chris Eppstein's Sassification of the Blueprint CSS framework, 
//	Graphpaper's grid library aims at creating a simple, lightweight way to 
//	build a fixed-width grid-based layout with the least amount of 
//	public-facing mixins.
// 
//	This library is, admittedly, not as well tested as Blueprint; but should
//	work just fine under modern browsers. For browsers that don't implement 
//	the :last-child pseudo-selector (:cough: IE :cough:), mix +last 
//	into the last element in a container in your IE stylesheet.
//
//	----------------------------------------------------------------------------------------------------------------

// Imports required libraries

@import compass/utilities/general/float.sass
@import graphpaper/modules/colors.sass

//	Default grid constants. It's pretty much the same as Blueprint but with one 
//	important exception. Graphpaper can add padding to the left of the grid
//	container to add a little breathing room.

!graphpaper_grid_columns	 ||= 24
!graphpaper_grid_width		 ||= 30px
!graphpaper_grid_margin		 ||= 10px
!graphpaper_grid_padding	 ||= 10px

!graphpaper_grid_outer_width = !graphpaper_grid_width + !graphpaper_grid_margin
!graphpaper_container_size = !graphpaper_grid_outer_width * !graphpaper_grid_columns - !graphpaper_grid_margin

//	----------------------------------------------------------------------------------------------------------------
//
//	MIXIN:	grid-container(center[true], add_padding_if_not_centered[true])
//	USAGE:	--- PUBLIC ---
//			This mixin should be used on the element containing the contents of your 
//			page. By default, the grid is set to be aligned to the center of the 
//			browser window. By setting the first argument to "false", the grid 
//			will be aligned to the left side of the page. Additionally, this will 
//			trigger padding to be automatically added to the left side of the 
//			grid container. You can turn this off, by setting the second argument 
//			to "false" [ex. +grid-container(false, false)]

=grid-container(!center = true, !add_padding = true)
	
	@if !center
		:margin 0px auto
	@else

		@if !add_padding
			:padding-left = !graphpaper_grid_padding
	
	:width = !graphpaper_container_size
	+clearfix


//	----------------------------------------------------------------------------------------------------------------
//
//	MIXIN:	container
//	USAGE:	--- PUBLIC ---
//			This mixin is intended for page elements that contain any number of grid
//			columns. It provides the float clear for these internal columns.

=container
	:display block
	:width = 100%
	+clearfix

//	----------------------------------------------------------------------------------------------------------------
//
//	MIXIN:	last
//	USAGE:	--- PUBLIC ---
//			The last mixin should be used in your IE stylesheet to remove the gutter 
//			from the last column in a container. Stylesheets targeting modern browsers
//			such as Safari, Firefox, or Chrome do not need to add mixin because the
//			column mixin utilizes the :last-child psuedo selector to automatically
//			remove the gutter. Isn't that nice?

=last
	:margin-right 0

//	----------------------------------------------------------------------------------------------------------------
//
//	MIXIN:	column-span(number_of_columns, add_right_gutter[false])
//	USAGE:	--- PRIVATE --
//			You should never need to use this mixin in your own stylesheets. Graphpaper 
//			uses the column-span to set the width of a column

=column-span(!n)
	:width = !graphpaper_grid_width * !n + (!graphpaper_grid_margin * (!n - 1))

//	----------------------------------------------------------------------------------------------------------------
//
//	MIXIN:	column(number_of_columns, add_right_gutter[false])
//	USAGE:	--- PUBLIC ---
//			Use +column for any element that you would like to become part of the grid structure of your document.
//			These work almost exactly like Blueprint columns with a few exceptions:
//			
//			1.	By default, the column mixin will make the scoped element span one grid column. You can change this 
//				by setting the first argument to an integer equal to the number of columns you wish the element 
//				to span.
//			2.	You do not need to add "true" as the second argument to denote the last column in a container. This
//				mixin uses the :last-child selector to automatically remove the gutter for the last column. This,
//				however, does not work in Internet Explorer. To compensate for this, you should add the +last mixin 
//				to the last element in your conditional IE stylesheet. Should Microsoft ever get its head out of its 
//				ass and decide to implement :last-child, I won't need to go back and change this code.
//			3.	Sometimes, you might want to add some right-side padding to a column (maybe to make it look like a 
//				double gutter). You can do this by setting the second argument to "true".
//
//			This is a pretty important mixin, so some examples shoule be in order.
//
//			Example 1: Spanning an element over 5 columns
//			+column(5)
//
//			Example 2: Spanning an element 2 columns, and adding padding to the right equal to the gutter width
//			+column(5, true)

=column(!n = 1)
	+float("left")
	+column-span(!n)
	:margin-right = !graphpaper_grid_margin
	
	&:last-child
		+last

//	----------------------------------------------------------------------------------------------------------------
//
//	MIXIN:	prepend(number_of_columns)
//	USAGE:	--- PUBLIC --
//			Add padding to the left of a column equal to the number of columns in the mixin argument. The mixin 
//			defaults to prepending the element with a single column.

=prepend(!n = 1)
	:padding-left = !graphpaper_grid_outer_width * !n

//	----------------------------------------------------------------------------------------------------------------
//
//	MIXIN:	append(number_of_columns)
//	USAGE:	--- PUBLIC ---
//			Add padding to the right of a column equal to the number of columns in the mixin's argument. The mixin
//			defaults to appending the element with a single column.

=append(!n = 1)
	:padding-right = !graphpaper_grid_outer_width * !n

//	----------------------------------------------------------------------------------------------------------------
//
//	MIXIN:	push(number_of_columns)
//	USAGE:	--- PUBLIC ---
//			Moves an element to the right equal to the number of columns specified in the mixin's argument. The mixin
//			defaults to pushing the element a single column.

=push(!n = 1)
	+float("left")
	:margin-left = !graphpaper_grid_outer_width * !n

//	----------------------------------------------------------------------------------------------------------------
//
//	MIXIN:	pull(number_of_columns)
//	USAGE:	--- PUBLIC ---
//			Pulls an element to the left equal to the number of columns specified in the mixin's argument. The mixin
//			defaults to pulling the element a single column.

=pull(!n = 1)
	+float("left")
	:margin-left = (!graphpaper_grid_outer_width * !n) * -1

//	----------------------------------------------------------------------------------------------------------------
//
//	MIXIN:	border(hex_value_of_border_color)
//	USAGE:	--- PUBLIC ---
//			Adds a border to the right of the scoped element. The color of the border defaults to gray as defined 
//			in Graphpaper's color file.

=border(!border_color = !gray)
	:padding-right = !graphpaper_column_gutter / 2 - 1
	:margin-right = !graphpaper_column_gutter / 2
	:border-right 1px solid #{!border_color}

//	--- THIS IS A TEST MIXIN ---
//	It would be good to have a mixing that helps keep verical rhythm in line
//	with the gutters in our grid. It should also be able to scale by multiples
//	of *n* to ensure the creation of proportional margins between containers

=row-margin(!n = 1)
	:margin-bottom = !graphpaper_grid_margin * !n