인프런 영문 브랜드 로고
인프런 영문 브랜드 로고

인프런 커뮤니티 질문&답변

한석환님의 프로필 이미지

작성한 질문수

[UI3 업데이트] 피그마 배리어블을 활용한 디자인 시스템 구축하기

링크(Link)와 브레드크럼프(Breadcrumbs) ✅

브레드크럼 인스턴스에서 Underline 넣는 방법

작성

·

35

·

수정됨

0

브레드크럼 파트에서 수강 중 질문드립니다!

브레드크럼 인스턴스의 Label text property가 수정되면 Style을 Underline으로 변경이 안됩니다. Underline을 넣고 싶으면 브레드크럼 컴포넌트 셋트에서 적용해야 인스턴스에도 적용되는데, 이렇게 하는게 맞는지 궁금합니다.



우선 강의를 들어주셔서 감사합니다. 강의 들으시면서 궁금하신 부분을 남겨주세요.

 

  • 회사 일 관계로 빠른 답변이 어려울 수 있으며, 최대 3일 이내에 답변드리도록 하겠습니다.

     

  • 이해를 돕기 위해서 스크린샷 이미지, 피그마 파일 링크를 반드시 첨부해주세요.

     

  • 마지막으로 먼저 유사한 질문이 있는지 한번 찾아보시는 걸 권장 드립니다.

 

인프런 서비스 운영 관련해서는 1:1 문의하기로 인프런 쪽으로 연락 주시기 바랍니다.

답변 2

0

볼드 UX님의 프로필 이미지
볼드 UX
지식공유자

안녕하세요, 한석환님

질문 주셔서 감사합니다.

 

제가 질문을 잘 이해 한게 맞는지 모르겠는데, 제 강의에서는 Style에서 Underline으로 적용이 되고 그 안에 텍스트는 Underline으로 추가하면 (1)이 이렇게 나타납니다. 따로 Underline 텍스트 스타일을 등록하셔도 되지만 이번에 새로운 기능이 나와서 구지 그렇게 안하셔도 됩니다.

 

제가 석환님 파일을 살펴보고, 제가 만든 부분도 살펴본 결과 텍스트 프로퍼티가 수정되어서 인스턴스에서 밑줄이 그대로 따라오긴 합니다.

만약 Underline을 부분적으로 없애거나 적용되지 않은 부분에 넣고 싶은 경우에는 현재 피그마에서는 불가능합니다.

 

감사합니다.

볼드 드림

0

인프런 AI 인턴님의 프로필 이미지

안녕하세요, 인프런 AI 인턴입니다. 한석환님.

브레드크럼 인스턴스에서 라벨 텍스트의 스타일을 어떻게 변경할 수 있는지에 대한 질문을 주셨네요. 피그마에서 컴포넌트 인스턴스를 사용할 때 텍스트 스타일 변경과 관련된 사항, 특히 언더라인 스타일의 적용에 대해 궁금하신 것 같습니다.

브레드크럼 인스턴스에서 텍스트 스타일을 변경하려면, 기본적으로 컴포넌트의 마스터 요소에서 해당 스타일을 설정해야 하며, 이를 통해 모든 인스턴스에 동일하게 적용됩니다. 인스턴스 자체에서 스타일을 변경하려면, 인스턴스 오버라이드를 허용하는 설정이 있어야 합니다.

유사한 질문 및 답변:

피그마에서 인스턴스 텍스트 스타일 변경:

컴포넌트의 특성 때문에 인스턴스에서 직접 스타일을 변경할 수 없다는 제한이 있으며, 이를 해결하기 위한 몇 가지 일반적인 방법이 있습니다:
1. 마스터 컴포넌트 수정: 컴포넌트 마스터 요소에서 언더라인 스타일을 설정하여 모든 인스턴스에 반영할 수 있습니다.
2. 스타일 오버라이드: 당연히 가능한 경우, 스타일 오버라이드를 통해 인스턴스 자체에서 적용하는 방법도 있습니다.
3. 별도 텍스트 스타일 생성: 필요하다면 특정 스타일을 별도로 생성하여 사용하면서 디자인 시스템의 일관성을 유지할 수 있도록 합니다.

이렇게 컴포넌트 인스턴스의 텍스트 스타일을 조정하려면, 각각의 상황에 맞는 접근 방법을 사용하는 것이 중요합니다. 코드를 잘 유지하는 것처럼 디자인 스타일도 일관성을 유지하고 효율적으로 관리하는 것이 관건입니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.