-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'master' of https://github.com/pixelminds/bourbonslim
- Loading branch information
Showing
6 changed files
with
280 additions
and
280 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,52 +1,52 @@ | ||
@charset "UTF-8"; | ||
|
||
/// Designates the element as a row of columns in the grid layout. It clears the floats on the element and sets its display property. Rows can't be nested, but there can be more than one row element—with different display properties—per layout. | ||
/// | ||
/// @param {String} $display [default] | ||
/// Sets the display property of the element and the display context that will be used by its children. Can be `block` or `table`. | ||
/// | ||
/// @param {String} $direction [$default-layout-direction] | ||
/// Sets the layout direction. Can be `LTR` (left-to-right) or `RTL` (right-to-left). | ||
/// | ||
/// @example scss - Usage | ||
/// .element { | ||
/// @include row(); | ||
/// } | ||
/// | ||
/// @example css - CSS Output | ||
/// .element { | ||
/// *zoom: 1; | ||
/// display: block; | ||
/// } | ||
/// | ||
/// .element:before, .element:after { | ||
/// content: " "; | ||
/// display: table; | ||
/// } | ||
/// | ||
/// .element:after { | ||
/// clear: both; | ||
/// } | ||
|
||
@mixin row($display: default, $direction: $default-layout-direction) { | ||
@if $direction != $default-layout-direction { | ||
@include -neat-warn("The $direction argument will be deprecated in future versions in favor of the direction(){...} mixin."); | ||
} | ||
|
||
$layout-direction: $direction !global; | ||
|
||
@if $display != default { | ||
@include -neat-warn("The $display argument will be deprecated in future versions in favor of the display(){...} mixin."); | ||
} | ||
|
||
@if $display == table { | ||
display: table; | ||
@include fill-parent; | ||
table-layout: fixed; | ||
$container-display-table: true !global; | ||
} @else { | ||
@include clearfix; | ||
display: block; | ||
$container-display-table: false !global; | ||
} | ||
} | ||
@charset "UTF-8"; | ||
|
||
/// Designates the element as a row of columns in the grid layout. It clears the floats on the element and sets its display property. Rows can't be nested, but there can be more than one row element—with different display properties—per layout. | ||
/// | ||
/// @param {String} $display [default] | ||
/// Sets the display property of the element and the display context that will be used by its children. Can be `block` or `table`. | ||
/// | ||
/// @param {String} $direction [$default-layout-direction] | ||
/// Sets the layout direction. Can be `LTR` (left-to-right) or `RTL` (right-to-left). | ||
/// | ||
/// @example scss - Usage | ||
/// .element { | ||
/// @include row(); | ||
/// } | ||
/// | ||
/// @example css - CSS Output | ||
/// .element { | ||
/// *zoom: 1; | ||
/// display: block; | ||
/// } | ||
/// | ||
/// .element:before, .element:after { | ||
/// content: " "; | ||
/// display: table; | ||
/// } | ||
/// | ||
/// .element:after { | ||
/// clear: both; | ||
/// } | ||
|
||
@mixin row($display: default, $direction: $default-layout-direction) { | ||
@if $direction != $default-layout-direction { | ||
@include -neat-warn("The $direction argument will be deprecated in future versions in favor of the direction(){...} mixin."); | ||
} | ||
|
||
$layout-direction: $direction !global; | ||
|
||
@if $display != default { | ||
@include -neat-warn("The $display argument will be deprecated in future versions in favor of the display(){...} mixin."); | ||
} | ||
|
||
@if $display == table { | ||
display: table; | ||
@include fill-parent; | ||
table-layout: fixed; | ||
$container-display-table: true !global; | ||
} @else { | ||
@include clearfix; | ||
display: block; | ||
$container-display-table: false !global; | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,97 +1,97 @@ | ||
@charset "UTF-8"; | ||
|
||
@mixin breakpoint($query:$feature $value $columns, $total-columns: $grid-columns) { | ||
@include -neat-warn("The breakpoint() mixin was renamed to media() in Neat 1.0. Please update your project with the new syntax before the next version bump."); | ||
|
||
@if length($query) == 1 { | ||
@media screen and ($default-feature: nth($query, 1)) { | ||
$default-grid-columns: $grid-columns; | ||
$grid-columns: $total-columns; | ||
@content; | ||
$grid-columns: $default-grid-columns; | ||
} | ||
} @else if length($query) == 2 { | ||
@media screen and (nth($query, 1): nth($query, 2)) { | ||
$default-grid-columns: $grid-columns; | ||
$grid-columns: $total-columns; | ||
@content; | ||
$grid-columns: $default-grid-columns; | ||
} | ||
} @else if length($query) == 3 { | ||
@media screen and (nth($query, 1): nth($query, 2)) { | ||
$default-grid-columns: $grid-columns; | ||
$grid-columns: nth($query, 3); | ||
@content; | ||
$grid-columns: $default-grid-columns; | ||
} | ||
} @else if length($query) == 4 { | ||
@media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) { | ||
$default-grid-columns: $grid-columns; | ||
$grid-columns: $total-columns; | ||
@content; | ||
$grid-columns: $default-grid-columns; | ||
} | ||
} @else if length($query) == 5 { | ||
@media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) { | ||
$default-grid-columns: $grid-columns; | ||
$grid-columns: nth($query, 5); | ||
@content; | ||
$grid-columns: $default-grid-columns; | ||
} | ||
} @else { | ||
@include -neat-warn("Wrong number of arguments for breakpoint(). Read the documentation for more details."); | ||
} | ||
} | ||
|
||
@mixin nth-omega($nth, $display: block, $direction: default) { | ||
@include -neat-warn("The nth-omega() mixin is deprecated. Please use omega() instead."); | ||
@include omega($nth $display, $direction); | ||
} | ||
|
||
/// Resets the active display property to `block`. Particularly useful when changing the display property in a single row. | ||
/// | ||
/// @example scss - Usage | ||
/// .element { | ||
/// @include row(table); | ||
/// // Context changed to table display | ||
/// } | ||
/// | ||
/// @include reset-display; | ||
/// // Context is reset to block display | ||
|
||
@mixin reset-display { | ||
$container-display-table: false !global; | ||
@include -neat-warn("Resetting $display will be deprecated in future versions in favor of the display(){...} mixin."); | ||
} | ||
|
||
/// Resets the active layout direction to the default value set in `$default-layout-direction`. Particularly useful when changing the layout direction in a single row. | ||
/// | ||
/// @example scss - Usage | ||
/// .element { | ||
/// @include row($direction: RTL); | ||
/// // Context changed to right-to-left | ||
/// } | ||
/// | ||
/// @include reset-layout-direction; | ||
/// // Context is reset to left-to-right | ||
|
||
@mixin reset-layout-direction { | ||
$layout-direction: $default-layout-direction !global; | ||
@include -neat-warn("Resetting $direction will be deprecated in future versions in favor of the direction(){...} mixin."); | ||
} | ||
|
||
/// Resets both the active layout direction and the active display property. | ||
/// | ||
/// @example scss - Usage | ||
/// .element { | ||
/// @include row(table, RTL); | ||
/// // Context changed to table table and right-to-left | ||
/// } | ||
/// | ||
/// @include reset-all; | ||
/// // Context is reset to block display and left-to-right | ||
|
||
@mixin reset-all { | ||
@include reset-display; | ||
@include reset-layout-direction; | ||
} | ||
@charset "UTF-8"; | ||
|
||
@mixin breakpoint($query:$feature $value $columns, $total-columns: $grid-columns) { | ||
@include -neat-warn("The breakpoint() mixin was renamed to media() in Neat 1.0. Please update your project with the new syntax before the next version bump."); | ||
|
||
@if length($query) == 1 { | ||
@media screen and ($default-feature: nth($query, 1)) { | ||
$default-grid-columns: $grid-columns; | ||
$grid-columns: $total-columns; | ||
@content; | ||
$grid-columns: $default-grid-columns; | ||
} | ||
} @else if length($query) == 2 { | ||
@media screen and (nth($query, 1): nth($query, 2)) { | ||
$default-grid-columns: $grid-columns; | ||
$grid-columns: $total-columns; | ||
@content; | ||
$grid-columns: $default-grid-columns; | ||
} | ||
} @else if length($query) == 3 { | ||
@media screen and (nth($query, 1): nth($query, 2)) { | ||
$default-grid-columns: $grid-columns; | ||
$grid-columns: nth($query, 3); | ||
@content; | ||
$grid-columns: $default-grid-columns; | ||
} | ||
} @else if length($query) == 4 { | ||
@media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) { | ||
$default-grid-columns: $grid-columns; | ||
$grid-columns: $total-columns; | ||
@content; | ||
$grid-columns: $default-grid-columns; | ||
} | ||
} @else if length($query) == 5 { | ||
@media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) { | ||
$default-grid-columns: $grid-columns; | ||
$grid-columns: nth($query, 5); | ||
@content; | ||
$grid-columns: $default-grid-columns; | ||
} | ||
} @else { | ||
@include -neat-warn("Wrong number of arguments for breakpoint(). Read the documentation for more details."); | ||
} | ||
} | ||
|
||
@mixin nth-omega($nth, $display: block, $direction: default) { | ||
@include -neat-warn("The nth-omega() mixin is deprecated. Please use omega() instead."); | ||
@include omega($nth $display, $direction); | ||
} | ||
|
||
/// Resets the active display property to `block`. Particularly useful when changing the display property in a single row. | ||
/// | ||
/// @example scss - Usage | ||
/// .element { | ||
/// @include row(table); | ||
/// // Context changed to table display | ||
/// } | ||
/// | ||
/// @include reset-display; | ||
/// // Context is reset to block display | ||
|
||
@mixin reset-display { | ||
$container-display-table: false !global; | ||
@include -neat-warn("Resetting $display will be deprecated in future versions in favor of the display(){...} mixin."); | ||
} | ||
|
||
/// Resets the active layout direction to the default value set in `$default-layout-direction`. Particularly useful when changing the layout direction in a single row. | ||
/// | ||
/// @example scss - Usage | ||
/// .element { | ||
/// @include row($direction: RTL); | ||
/// // Context changed to right-to-left | ||
/// } | ||
/// | ||
/// @include reset-layout-direction; | ||
/// // Context is reset to left-to-right | ||
|
||
@mixin reset-layout-direction { | ||
$layout-direction: $default-layout-direction !global; | ||
@include -neat-warn("Resetting $direction will be deprecated in future versions in favor of the direction(){...} mixin."); | ||
} | ||
|
||
/// Resets both the active layout direction and the active display property. | ||
/// | ||
/// @example scss - Usage | ||
/// .element { | ||
/// @include row(table, RTL); | ||
/// // Context changed to table table and right-to-left | ||
/// } | ||
/// | ||
/// @include reset-all; | ||
/// // Context is reset to block display and left-to-right | ||
|
||
@mixin reset-all { | ||
@include reset-display; | ||
@include reset-layout-direction; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,42 +1,42 @@ | ||
@charset "UTF-8"; | ||
|
||
@mixin grid-column-gradient($values...) { | ||
background-image: -webkit-linear-gradient(left, $values); | ||
background-image: -moz-linear-gradient(left, $values); | ||
background-image: -ms-linear-gradient(left, $values); | ||
background-image: -o-linear-gradient(left, $values); | ||
background-image: unquote("linear-gradient(to left, #{$values})"); | ||
} | ||
|
||
@if $visual-grid == true or $visual-grid == yes { | ||
body:before { | ||
@include grid-column-gradient(gradient-stops($grid-columns)); | ||
content: ""; | ||
display: inline-block; | ||
height: 100%; | ||
left: 0; | ||
margin: 0 auto; | ||
max-width: $max-width; | ||
opacity: $visual-grid-opacity; | ||
pointer-events: none; | ||
position: fixed; | ||
right: 0; | ||
width: 100%; | ||
|
||
@if $visual-grid-index == back { | ||
z-index: -1; | ||
} | ||
|
||
@else if $visual-grid-index == front { | ||
z-index: 9999; | ||
} | ||
|
||
@each $breakpoint in $visual-grid-breakpoints { | ||
@if $breakpoint { | ||
@include media($breakpoint) { | ||
@include grid-column-gradient(gradient-stops($grid-columns)); | ||
} | ||
} | ||
} | ||
} | ||
} | ||
@charset "UTF-8"; | ||
|
||
@mixin grid-column-gradient($values...) { | ||
background-image: -webkit-linear-gradient(left, $values); | ||
background-image: -moz-linear-gradient(left, $values); | ||
background-image: -ms-linear-gradient(left, $values); | ||
background-image: -o-linear-gradient(left, $values); | ||
background-image: unquote("linear-gradient(to left, #{$values})"); | ||
} | ||
|
||
@if $visual-grid == true or $visual-grid == yes { | ||
body:before { | ||
@include grid-column-gradient(gradient-stops($grid-columns)); | ||
content: ""; | ||
display: inline-block; | ||
height: 100%; | ||
left: 0; | ||
margin: 0 auto; | ||
max-width: $max-width; | ||
opacity: $visual-grid-opacity; | ||
pointer-events: none; | ||
position: fixed; | ||
right: 0; | ||
width: 100%; | ||
|
||
@if $visual-grid-index == back { | ||
z-index: -1; | ||
} | ||
|
||
@else if $visual-grid-index == front { | ||
z-index: 9999; | ||
} | ||
|
||
@each $breakpoint in $visual-grid-breakpoints { | ||
@if $breakpoint { | ||
@include media($breakpoint) { | ||
@include grid-column-gradient(gradient-stops($grid-columns)); | ||
} | ||
} | ||
} | ||
} | ||
} |
Oops, something went wrong.