안녕하세요... 스페이싱 함수값 적용해서 복사할때에 질문이 있습니다!!!
안녕하세요! 영상 보며 따라만들고있는데, 스페이싱 함수값을 적용하면 강의 영상 안에서는 8, 16, 20, 24 이런식으로 하단 값이 숫자로 나오는데 저는 함수값으로 나와서 너무 헷갈립니다...ㅠㅠㅠㅠ 왜이러는걸까요ㅠㅠ?
헷갈려서 삭제하고 다시 해봐도 함수로 나와서 눈이 어지러워요
저만.... 이런건가요??
답변 1
0
안녕하세요 러부엉님 :)
디자이너 입장에서 함수와 변수가 나와 많이 어려울 수 있습니다 ㅎㅎ
복사를 해서 만들더라도 토큰이 어떤식으로 이루어 지는지를 꼭 알아야 합니다.
현재 보여주신 이미지에는 식이 너무 많이 들어가 있어 토큰이 제대로 값을 계산하지 못하는 것으로 보입니다~
4px 간격으로 증가하는 토큰을 만들고 있다면,
토큰의 기본 간격은 baseSpacing 으로 4를 넣어두고 사용하며,
Spacing.8 의 식은 4 x 2 의 식이 들어와야 하기 때문에 {baseSpacing} * 2 를 하고
(웹세상에선 곱하기(X)를 * 로 표시하며 나누기는 / 로 표시합니다. )
Spacing.12는 8 + 4 의 식이 들어와야 하기 때문에 기존에 썻던 식은 제외되며
{Spacing.8} + {baseSpacing}의 값만 들어와야 계산이 됩니다.
이후 작업들은 더이상 곱하기가 아닌 이전의 스페이싱 값에 베이스값을 계속 더하는 값으로 계산하시면 됩니다.
ex) Spacing.16은 12 + 4 의 식을 가져야 하므로 {Spacing.12} + {baseSpacing} 이 됩니다.
답변을 보고 적용해봐도 계속 안된다면 피그마를 공유해주시면 보다 자세히 확인해보고 답변 드리도록 하겠습니다 :)
borderTransparent를 라이트/다크모드에 이중등록
0
47
2
해결되었습니다.
0
38
1
안녕하세요! 강의잘 들었습니다.
0
104
2
타이포그래피 16 -> 14 변경 시 XXXL만 변경 안 됨
0
71
2
토큰스튜디오에서 폰트 스타일등록 문의
0
81
2
토큰에서 style로 export시 에러
0
83
2
컬러시스템 등록 관련
0
86
2
토큰 light/dark mode 오류
0
76
2
Pretendard 없으면 에러납니다
0
297
2
폰트 토큰 작업 할때
1
120
3
여기 수업에서 엘로우나 레드나 블루 이런 컬러들을 다양하게 만드는 이유가 뭔가요?
0
67
2
토큰을 깃허브에 올리는 방법이 없어진거 같은데요
1
95
2
토큰 export 할때 어떻게 해야 하나요? 버전이 바뀌어서 그런지 못찾겠어요
0
251
2
인프런 할때마다 짜증나는데 수업내용이 너무 오래된건 제발 삭제좀 하던지 다시 찍던지 해주세요
1
86
1
tailwind color generator 이게 작동이 잘 안되네요
0
89
2
figma tokens플러그인 안나오는데요??
0
141
2
혹시 토큰 가공할 수 있는 강의도 따로 있을까요??
1
66
2
피그마 배리어블에 export시 값 저장 안됨
0
232
3
Style - variable 문으ㅣ ㅜㅜ
0
75
2
borderTransparent 임포트가 안됩니다
1
73
2
화면이 보이지가 않아요?
0
76
1
컬러맵핑하고 라이트/다크 모드 설정시 색상 반전이 안돼요 ㅠㅠ
1
287
2
피그마 토큰 플러그인
1
299
2
깃허브 sync 오류
1
195
2