archuive

DEPRECATION WARNING: Using / for division is deprecated and will be removed in Dart Sass 2.0.0. 원인 Sass는 현재 일부 맥락에서는 / 기호를 나누기 연산으로 간주하고, 다른 맥락에서는 구분 기호로 간주하고 있습니다. 즉 Sass tkdydwksms / 의 의미를 구분하기가 어렵고 / 를 구분 기호로 사용하는 새로운 CSS 기능을 사용하기 어렵게 합니다. 호환성: Dart Sass partial Sass는 복잡한 휴리스틱스를 사용해 / 를 분할로 처리할지 연산자로 처리해야할지 파악합니다. 그래도 구분 기호로 Sass 내에서 검사하기 어려운 따옴표가 없는 문자열을 생성합니다. CSS Grid와 같은 CSS 기능과 새로운 rgb()..

CSS 프로젝트를 설계하는 것은 아마도 프로젝트에서 해야 할 가장 어려운 일 중 하나 일 것입니다. 일관되고 의미있는 아키텍처를 유지하는 것은 더욱 어렵습니다. 다행히도 CSS 전처리기를 사용하는 주된 이점 중 하나는 @import CSS 지시문처럼 성능에 영향을 미치지 않으면 서 여러 파일에 코드베이스를 분할 할 수 있다는 것입니다. Sass가 @import 지시어를 과부하 한 덕분에 개발시 필요한만큼 많은 파일을 사용하는 것이 안전하고 (실제로 권장 됨) 모든 제품을 제작할 때 단일 스타일 시트로 컴파일됩니다. 그뿐 아니라 소규모 프로젝트에서도 폴더가 필요하다고 강조합니다. 가정에서는 모든 용지를 같은 상자에 떨어 뜨리지 않습니다. 당신은 폴더를 사용합니다; 하나는 집 / 아파트, 하나는 은행, 하나..

디자인 시스템에서 정의한 타이포그라피 규칙을 코드화해 편리하게 사용하고 싶었다. 타이포그래피 규칙은 font-size, font-weight, line-height, letter-spacing 등 복합적인 속성으로 구성되어 있어 변수만으로는 원하는 구조를 구현하기 힘들어 보였다. 위 타이포 규칙을 하나의 묶음으로 만들어 타이포그라피 규칙 중 이 유형 이라는 의미를 갖는 것이 원하는 형태였다. 방안 1. mixin으로 만들어 @include 로 사용하는 방법 방안 2. function으로 만들기? 1. map과 @function 을 사용하는 방법 map 정의 $typography-size-map: ( "heading-01": 72px, "heading-02": 48px, "heading-03": 32px,..