qwef

$list : orange, royalblue, burlywood; @for $i from 1 to 4{ .box:nth-of-type(#{$i}){ background-color: nth($list, $i); } } 이렇게 nth(리스트, 인덱스)로 접근할 수 있음.

$number : 1; $string : bold; $color : red; $boolean : true; $null : null; $list : orange, royalblue, burlywood; $map : ( o : orange, r : red, b : blue ); list는 배열, map은 객체 형태

폰에서 터치 시 전화기능이나 문자기능으로 안내 가능 010-1111-2222 010-1111-2222

.history .container .text th{ white-space: nowrap; word-break: keep-all;} 이렇게 하면 줄바꿈 안일어남. white-space는 공백과 줄바꿈을 어떻게 처리할 지 정하는 속성

@import './sub.scss'; 저기에 있는 것도 같이 적용 됨. @import url(./sub.scss); 이렇게 css에서 했던걸로 해도 가능 함.

const userProperty1 = makeObj('name', 'jone'); const userProperty2 = makeObj('age', 40); const user = Object.assign({},userProperty1, userProperty2); console.log(user); function makeObj(key, value){ return { [key] : value } } Object.assign((넣을곳), 합칠객체1,합칠객체2, 3, 4.... ) 이러면 객체가 합쳐져서 return 됨 참고로, Object.assign(userProperty1, userProperty2); console.log(userProperty1); 이렇게 하면 userProperty1안쪽으로 넣어..

const ViewMode = { UNSET : 0, WIDTH_LARGE : 1, WIDTH_SMALL : 2 } Object.freeze(ViewMode); 이렇게 객체로 구현시킨 다음에, Object.freeze로 상수화 시켜주면 됨.

&.built-in { @include center; background-color: mix($color, red); } &.built-in 은 자신에 built-in 클래스가 있는 경우 mix(색1, 색2) 값을 섞는 건데, 둘 값의 중간값 주는 듯 background-color: lighten($color, 30%); 밝게 background-color: darken($color, 30%); 어둡게 background-color: saturate($color, 40%); 채도 높여주기 40% 높여줌 background-color: desaturate($color, 40%); 채도 감소 background-color: grayscale($color); 색생에 따라 회색 정도가 다르기에 색상 줘야 함. ..

@function ratio($size, $ratio){ @return $size * $ratio; } 그냥 이렇게 함수 정의해서 쓰면 됨. scss는 기본적으로 뭔가 기능 사용할 때는 @기능명 아마 저런 계산같은 것이 @function으로 쓰고 여러가지 속성 한번에 변경하는 용도가 @mixin 함수의 본질에 충실함.