Last active
December 20, 2021 14:12
Revisions
-
DracoBlue revised this gist
Jul 4, 2014 . 1 changed file with 26 additions and 24 deletions.There are no files selected for viewing
This file contains hidden or 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 charactersOriginal file line number Diff line number Diff line change @@ -1,26 +1,28 @@ @mixin respond-to($medias...) { $breakpoints-length: length($respond-to-breakpoints); @each $media in $medias { $had-a-hit: false; @for $i from 1 through $breakpoints-length { $breakpoint: nth($respond-to-breakpoints, $i); @if $media == nth($breakpoint, 1) { $definition: nth($breakpoint, 2); $had-a-hit: true; @media #{$definition} { @content; } } } @if $media == $respond-to-no-mediaqueries-fallback { .#{$respond-to-fallback-class} & { @content; } } @if $had-a-hit == false { @warn "Media #{media} not found!"; } } } -
DracoBlue revised this gist
Jul 3, 2014 . 1 changed file with 1 addition and 1 deletion.There are no files selected for viewing
This file contains hidden or 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 charactersOriginal file line number Diff line number Diff line change @@ -3,7 +3,7 @@ $respond-to-fallback-class: lt-ie9; $respond-to-breakpoints: ( desktop "(min-width: 721px)", pad "(min-width: 321px) and (max-width: 720px)", mobile "(max-width: 320px)" ); -
DracoBlue revised this gist
Jan 19, 2014 . 1 changed file with 2 additions and 2 deletions.There are no files selected for viewing
This file contains hidden or 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 charactersOriginal file line number Diff line number Diff line change @@ -4,7 +4,7 @@ @each $media in $medias { $had_a_hit: false; @for $i from 1 through $breakpoints_length { $breakpoint: nth($respond-to-breakpoints, $i); @if $media == nth($breakpoint, 1) { $definition: nth($breakpoint, 2); $had_a_hit: true; @@ -13,7 +13,7 @@ } } } @if $media == $respond-to-no-mediaqueries-fallback { .#{$respond-to-fallback-class} & { @content; } -
DracoBlue created this gist
Jan 15, 2014 .There are no files selected for viewing
This file contains hidden or 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 charactersOriginal file line number Diff line number Diff line change @@ -0,0 +1,26 @@ @mixin respond-to($medias...) { $breakpoints_length: length($respond-to-breakpoints); @each $media in $medias { $had_a_hit: false; @for $i from 1 through $breakpoints_length { $breakpoint: nth($breakpoints, $i); @if $media == nth($breakpoint, 1) { $definition: nth($breakpoint, 2); $had_a_hit: true; @media #{$definition} { @content; } } } @if $media == $no-mediaqueries-fallback { .#{$respond-to-fallback-class} & { @content; } } @if $had_a_hit == false { @warn "Media #{media} not found!"; } } } This file contains hidden or 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 charactersOriginal file line number Diff line number Diff line change @@ -0,0 +1,27 @@ $respond-to-no-mediaqueries-fallback: desktop; $respond-to-fallback-class: lt-ie9; $respond-to-breakpoints: ( desktop "(min-width: 721px)", pad "(min-width: 321px) and (max-width: 720px)", mobile "(max-width: 320px)", ); @import "_respond-to"; .my-class { @include respond-to(desktop, pad) { color: #ff0; } @include respond-to(mobile) { color: #f0f; } font-size: 12px; }