개발자.. 너란놈..

테일윈드를 사용하면 절대로 쓸 일이 없는 구문이긴 하지만 테일윈드나 다른 프레임워크를 설정하기 어려워서 하나 만들어 보았습니다.

Padding

//숫자를 200 -> 1000 하면 1000까지 가능
@for $i from 0 through 200 {
    .pd-#{$i} {
        padding: #{$i}px !important;
    }

    .pt-#{$i} {
        padding-top: #{$i}px !important;
    }

    .pr-#{$i} {
        padding-right: #{$i}px !important;
    }

    .pb-#{$i} {
        padding-bottom: #{$i}px !important;
    }

    .pl-#{$i} {
        padding-left: #{$i}px !important;
    }
}

Margin

//숫자를 200 -> 1000 하면 1000까지 가능 (조절가능)
@for $i from 0 through 200 {
    .md-#{$i} {
        margin: #{$i}px !important;
    }

    .mt-#{$i} {
        margin-top: #{$i}px !important;
    }

    .mr-#{$i} {
        margin-right: #{$i}px !important;
    }

    .mb-#{$i} {
        margin-bottom: #{$i}px !important;
    }

    .ml-#{$i} {
        margin-left: #{$i}px !important;
    }
}

누군가는 필요로 하지 않을까?

잠시 뻘짓할 시간이 필요해서 만들었습니다.

reset 값으로 사용해도 될거같음 ㅎㅎ

.margin_0 {margin:0} 
.margin_top0 {margin-top:0px;}
.margin_top10 {margin-top:10px;}
.margin_top20 {margin-top:20px;}
.margin_top30 {margin-top:30px;}
.margin_top40 {margin-top:40px;}
.margin_top50 {margin-top:50px;}
.margin_top60 {margin-top:60px;}
.margin_top70 {margin-top:70px;}
.margin_top80 {margin-top:80px;}
.margin_top90 {margin-top:90px;}
.margin_top100 {margin-top:100px;}

.margin_right0 {margin-right:0px;}
.margin_right10 {margin-right:10px;}
.margin_right20 {margin-right:20px;}
.margin_right30 {margin-right:30px;}
.margin_right40 {margin-right:40px;}
.margin_right50 {margin-right:50px;}
.margin_right60 {margin-right:60px;}
.margin_right70 {margin-right:70px;}
.margin_right80 {margin-right:80px;}
.margin_right90 {margin-right:90px;}
.margin_right100 {margin-right:100px;}

.margin_bottom0 {margin-bottom:0px;}
.margin_bottom10 {margin-bottom:10px;}
.margin_bottom20 {margin-bottom:20px;}
.margin_bottom30 {margin-bottom:30px;}
.margin_bottom40 {margin-bottom:40px;}
.margin_bottom50 {margin-bottom:50px;}
.margin_bottom60 {margin-bottom:60px;}
.margin_bottom70 {margin-bottom:70px;}
.margin_bottom80 {margin-bottom:80px;}
.margin_bottom90 {margin-bottom:90px;}
.margin_bottom100 {margin-bottom:100px;}

.margin_left0 {margin-left:0px;}
.margin_left10 {margin-left:10px;}
.margin_left20 {margin-left:20px;}
.margin_left30 {margin-left:30px;}
.margin_left40 {margin-left:40px;}
.margin_left50 {margin-left:50px;}
.margin_left60 {margin-left:60px;}
.margin_left70 {margin-left:70px;}
.margin_left80 {margin-left:80px;}
.margin_left90 {margin-left:90px;}
.margin_left100 {margin-left:100px;}

.padding_0 {padding:0}
.padding_top0  {padding-top:0px;}
.padding_top10 {padding-top:10px;}
.padding_top20 {padding-top:20px;}
.padding_top30 {padding-top:30px;}
.padding_top40 {padding-top:40px;}
.padding_top50 {padding-top:50px;}
.padding_top60 {padding-top:60px;}
.padding_top70 {padding-top:70px;}
.padding_top80 {padding-top:80px;}
.padding_top90 {padding-top:90px;}
.padding_top100 {padding-top:100px;}

.padding_right0  {padding-right:0px;}
.padding_right10 {padding-right:10px;}
.padding_right20 {padding-right:20px;}
.padding_right30 {padding-right:30px;}
.padding_right40 {padding-right:40px;}
.padding_right50 {padding-right:50px;}
.padding_right60 {padding-right:60px;}
.padding_right70 {padding-right:70px;}
.padding_right80 {padding-right:80px;}
.padding_right90 {padding-right:90px;}
.padding_right100 {padding-right:100px;}

.padding_bottom0  {padding-bottom:0px;}
.padding_bottom10 {padding-bottom:10px;}
.padding_bottom20 {padding-bottom:20px;}
.padding_bottom30 {padding-bottom:30px;}
.padding_bottom40 {padding-bottom:40px;}
.padding_bottom50 {padding-bottom:50px;}
.padding_bottom60 {padding-bottom:60px;}
.padding_bottom70 {padding-bottom:70px;}
.padding_bottom80 {padding-bottom:80px;}
.padding_bottom90 {padding-bottom:90px;}
.padding_bottom100 {padding-bottom:100px;}

.padding_left0  {padding-left:0px;}
.padding_left10 {padding-left:10px;}
.padding_left20 {padding-left:20px;}
.padding_left30 {padding-left:30px;}
.padding_left40 {padding-left:40px;}
.padding_left50 {padding-left:50px;}
.padding_left60 {padding-left:60px;}
.padding_left70 {padding-left:70px;}
.padding_left80 {padding-left:80px;}
.padding_left90 {padding-left:90px;}
.padding_left100 {padding-left:100px;}