Last active
March 14, 2018 11:42
-
-
Save Eomerx/21cd18a049d0b3656ea5 to your computer and use it in GitHub Desktop.
Revisions
-
Eomerx revised this gist
Sep 28, 2015 . 1 changed file with 67 additions and 61 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,6 +1,46 @@ //==================================== // FOR LOOP = //==================================== .for(@i, @n) { .-each(@i) } .for(@n) when (isnumber(@n)) { .for(1, @n) } .for(@i, @n) when not (@i =@n) { .for((@i + (@n - @i) / abs(@n - @i)), @n); } //-------- End of for loop ---------// //========================================= // FOR EACH LOOP = //========================================= .for(@array) when (default()) { .for-impl_(length(@array)) } .for-impl_(@i) when (@i > 1) { .for-impl_((@i - 1)) } .for-impl_(@i) when (@i > 0) { .-each(extract(@array, @i)) } //-------- End of for each loop ---------// /////////////// // variables // /////////////// @screen-xs: 0; @screen-sm: 480px; @screen-md: 768px; @screen-lg: 992px; @@ -9,86 +49,52 @@ @values-array: 0, 5, 10, 15, 20, 30, 40, 50; // global @media (min-width: @screen-xs) { .make-space(@prefix: xs); } // mobile @media (min-width: @screen-sm) { .make-space(@prefix: sm); } // tablet @media (min-width: @screen-md) { .make-space(@prefix: md); } // desktop @media (min-width: @screen-lg) { .make-space(@prefix: lg); } // large screens @media (min-width: @screen-xl) { .make-space(@prefix: xl); } // init functions .make-space(@prefix) { .for(@values-array); .-each(@value) { .@{prefix}-p-@{value} { padding: ~"@{value}px"; } .@{prefix}-pt-@{value} { padding-top: ~"@{value}px"; } .@{prefix}-pl-@{value} { padding-left: ~"@{value}px"; } .@{prefix}-pr-@{value} { padding-right: ~"@{value}px"; } .@{prefix}-pb-@{value} { padding-bottom: ~"@{value}px"; } .@{prefix}-m-@{value} { margin: ~"@{value}px"; } .@{prefix}-mt-@{value} { margin-top: ~"@{value}px"; } .@{prefix}-ml-@{value} { margin-left: ~"@{value}px"; } .@{prefix}-mr-@{value} { margin-right: ~"@{value}px"; } .@{prefix}-mb-@{value} { margin-bottom: ~"@{value}px"; } } } -
Ömer Aslanbakan revised this gist
Aug 22, 2015 . 1 changed file with 3 additions and 3 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 @@ -45,9 +45,9 @@ } // desktop @media (min-width: @screen-lg) { .make-space(@prefix: lg; @value:200; ); .make-space(@prefix: lg; @value:150; ); .make-space(@prefix: lg; @value:100; ); .make-space(@prefix: lg; @value:50; ); .make-space(@prefix: lg; @value:40; ); .make-space(@prefix: lg; @value:30; ); -
May 21, 2015 .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,94 @@ /////////////// // variables // /////////////// @screen-sm: 480px; @screen-md: 768px; @screen-lg: 992px; @screen-xl: 1600px; // global .make-space(@prefix: xs; @value:50; ); .make-space(@prefix: xs; @value:40; ); .make-space(@prefix: xs; @value:30; ); .make-space(@prefix: xs; @value:20; ); .make-space(@prefix: xs; @value:15; ); .make-space(@prefix: xs; @value:10; ); .make-space(@prefix: xs; @value:5; ); .make-space(@prefix: xs; @value:0; ); // mobile @media (min-width: @screen-sm) { .make-space(@prefix: sm; @value:50; ); .make-space(@prefix: sm; @value:40; ); .make-space(@prefix: sm; @value:30; ); .make-space(@prefix: sm; @value:20; ); .make-space(@prefix: sm; @value:15; ); .make-space(@prefix: sm; @value:10; ); .make-space(@prefix: sm; @value:5; ); .make-space(@prefix: sm; @value:0; ); } // tablet @media (min-width: @screen-md) { .make-space(@prefix: md; @value:50; ); .make-space(@prefix: md; @value:40; ); .make-space(@prefix: md; @value:30; ); .make-space(@prefix: md; @value:20; ); .make-space(@prefix: md; @value:15; ); .make-space(@prefix: md; @value:10; ); .make-space(@prefix: md; @value:5; ); .make-space(@prefix: md; @value:0; ); } // desktop @media (min-width: @screen-lg) { .make-space(@prefix: xl; @value:200; ); .make-space(@prefix: xl; @value:150; ); .make-space(@prefix: xl; @value:100; ); .make-space(@prefix: lg; @value:50; ); .make-space(@prefix: lg; @value:40; ); .make-space(@prefix: lg; @value:30; ); .make-space(@prefix: lg; @value:20; ); .make-space(@prefix: lg; @value:15; ); .make-space(@prefix: lg; @value:10; ); .make-space(@prefix: lg; @value:5; ); .make-space(@prefix: lg; @value:0; ); } // large screens /*@media (min-width: @screen-xl) { .make-space(@prefix: xl; @value:200; ); .make-space(@prefix: xl; @value:150; ); .make-space(@prefix: xl; @value:100; ); .make-space(@prefix: xl; @value:50; ); .make-space(@prefix: xl; @value:40; ); .make-space(@prefix: xl; @value:30; ); .make-space(@prefix: xl; @value:20; ); .make-space(@prefix: xl; @value:15; ); .make-space(@prefix: xl; @value:10; ); .make-space(@prefix: xl; @value:5; ); .make-space(@prefix: xl; @value:0; ); }*/ // init functions .make-space(@prefix; @value) { .@{prefix}-p-@{value} { padding: ~"@{value}px"; } .@{prefix}-pt-@{value} { padding-top: ~"@{value}px"; } .@{prefix}-pl-@{value} { padding-left: ~"@{value}px"; } .@{prefix}-pr-@{value} { padding-right: ~"@{value}px"; } .@{prefix}-pb-@{value} { padding-bottom: ~"@{value}px"; } .@{prefix}-m-@{value} { margin: ~"@{value}px"; } .@{prefix}-mt-@{value} { margin-top: ~"@{value}px"; } .@{prefix}-ml-@{value} { margin-left: ~"@{value}px"; } .@{prefix}-mr-@{value} { margin-right: ~"@{value}px"; } .@{prefix}-mb-@{value} { margin-bottom: ~"@{value}px"; } }
Ömer Aslanbakan
revised
this gist