Version initiale du site
This commit is contained in:
		
							
								
								
									
										81
									
								
								sass/bootstrap/mixins/_grid-framework.scss
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										81
									
								
								sass/bootstrap/mixins/_grid-framework.scss
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,81 @@ | ||||
| // Framework grid generation | ||||
| // | ||||
| // Used only by Bootstrap to generate the correct number of grid classes given | ||||
| // any value of `$grid-columns`. | ||||
|  | ||||
| // [converter] This is defined recursively in LESS, but Sass supports real loops | ||||
| @mixin make-grid-columns($i: 1, $list: ".col-xs-#{$i}, .col-sm-#{$i}, .col-md-#{$i}, .col-lg-#{$i}") { | ||||
|   @for $i from (1 + 1) through $grid-columns { | ||||
|     $list: "#{$list}, .col-xs-#{$i}, .col-sm-#{$i}, .col-md-#{$i}, .col-lg-#{$i}"; | ||||
|   } | ||||
|   #{$list} { | ||||
|     position: relative; | ||||
|     // Prevent columns from collapsing when empty | ||||
|     min-height: 1px; | ||||
|     // Inner gutter via padding | ||||
|     padding-left:  ceil(($grid-gutter-width / 2)); | ||||
|     padding-right: floor(($grid-gutter-width / 2)); | ||||
|   } | ||||
| } | ||||
|  | ||||
|  | ||||
| // [converter] This is defined recursively in LESS, but Sass supports real loops | ||||
| @mixin float-grid-columns($class, $i: 1, $list: ".col-#{$class}-#{$i}") { | ||||
|   @for $i from (1 + 1) through $grid-columns { | ||||
|     $list: "#{$list}, .col-#{$class}-#{$i}"; | ||||
|   } | ||||
|   #{$list} { | ||||
|     float: left; | ||||
|   } | ||||
| } | ||||
|  | ||||
|  | ||||
| @mixin calc-grid-column($index, $class, $type) { | ||||
|   @if ($type == width) and ($index > 0) { | ||||
|     .col-#{$class}-#{$index} { | ||||
|       width: percentage(($index / $grid-columns)); | ||||
|     } | ||||
|   } | ||||
|   @if ($type == push) and ($index > 0) { | ||||
|     .col-#{$class}-push-#{$index} { | ||||
|       left: percentage(($index / $grid-columns)); | ||||
|     } | ||||
|   } | ||||
|   @if ($type == push) and ($index == 0) { | ||||
|     .col-#{$class}-push-0 { | ||||
|       left: auto; | ||||
|     } | ||||
|   } | ||||
|   @if ($type == pull) and ($index > 0) { | ||||
|     .col-#{$class}-pull-#{$index} { | ||||
|       right: percentage(($index / $grid-columns)); | ||||
|     } | ||||
|   } | ||||
|   @if ($type == pull) and ($index == 0) { | ||||
|     .col-#{$class}-pull-0 { | ||||
|       right: auto; | ||||
|     } | ||||
|   } | ||||
|   @if ($type == offset) { | ||||
|     .col-#{$class}-offset-#{$index} { | ||||
|       margin-left: percentage(($index / $grid-columns)); | ||||
|     } | ||||
|   } | ||||
| } | ||||
|  | ||||
| // [converter] This is defined recursively in LESS, but Sass supports real loops | ||||
| @mixin loop-grid-columns($columns, $class, $type) { | ||||
|   @for $i from 0 through $columns { | ||||
|     @include calc-grid-column($i, $class, $type); | ||||
|   } | ||||
| } | ||||
|  | ||||
|  | ||||
| // Create grid for specific class | ||||
| @mixin make-grid($class) { | ||||
|   @include float-grid-columns($class); | ||||
|   @include loop-grid-columns($grid-columns, $class, width); | ||||
|   @include loop-grid-columns($grid-columns, $class, pull); | ||||
|   @include loop-grid-columns($grid-columns, $class, push); | ||||
|   @include loop-grid-columns($grid-columns, $class, offset); | ||||
| } | ||||
		Reference in New Issue
	
	Block a user
	 faquin
					faquin