From: Laury GvR Date: Thu, 5 Mar 2015 20:05:45 +0000 (-0500) Subject: New way of doing mixins X-Git-Tag: v1.0.0^2~3 X-Git-Url: http://cvs2.gaslightmedia.com/gitweb/?a=commitdiff_plain;h=d1eef2f6ee444843e3cea9eddf84fbe3b2980389;p=WP-Themes%2FMackinacBayview.git New way of doing mixins --- diff --git a/scss/_mixins.scss b/scss/_mixins.scss new file mode 100644 index 0000000..4b68036 --- /dev/null +++ b/scss/_mixins.scss @@ -0,0 +1,7 @@ +/* + Created on : Mar 5, 2015, 2:57:46 PM + Author : laury +*/ + + @import "mixins/gradient"; + @import "mixins/off-canvas-arrow"; \ No newline at end of file diff --git a/scss/app.scss b/scss/app.scss index 21685ce..8f11774 100644 --- a/scss/app.scss +++ b/scss/app.scss @@ -1,11 +1,9 @@ -@import "mixins/off-canvas-arrow"; - +@import "mixins"; @import "settings"; @import "foundation"; @import "wordpress"; @import "structure"; - // Or selectively include components // @import // "foundation/components/accordion", diff --git a/scss/mixins/_gradient.scss b/scss/mixins/_gradient.scss new file mode 100644 index 0000000..84d0898 --- /dev/null +++ b/scss/mixins/_gradient.scss @@ -0,0 +1,10 @@ +/* + Created on : Mar 5, 2015, 2:57:35 PM + Author : laury +*/ + +@mixin gradient($from, $to) { + background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, $from), color-stop(1, $to)); + background: -moz-linear-gradient(center top, $from 5%, $to 100%); + filter: progid:DXIm-ageTransform.Microsoft.gradient(startColorstr='#{$from}', endColorstr'#{$to}'); +} \ No newline at end of file diff --git a/scss/mixins/_off-canvas-arrow.scss b/scss/mixins/_off-canvas-arrow.scss index f7dc46f..4beb816 100644 --- a/scss/mixins/_off-canvas-arrow.scss +++ b/scss/mixins/_off-canvas-arrow.scss @@ -1,12 +1,12 @@ -@mixin off-canvas-arrow($direction: down, $color: white) { - border-left: 15px solid transparent; - border-right: 15px solid transparent; +@mixin off-canvas-arrow($direction: down, $color: white, $size: 20px) { + border-left: $size - 5 solid transparent; + border-right: $size - 5 solid transparent; @if $direction == 'up' { - border-bottom: 20px solid $color; + border-bottom: $size solid $color; border-top: 0; // if width is not passed, or empty do this } @else { - border-top: 20px solid $color; + border-top: $size solid $color; border-bottom: 0; } } \ No newline at end of file