Skip to main content
Solved

Text case resize inside instance possible?

Alexandru_Grigoras

Hello Figma friends,

I love the tool and I use it on a daily basis, very powerful!

I have a specific case for a tooltip. I have created the master component with the specific style and I also have a text box inside as dummy (lorem).

My colleagues want to be able to change the text case size as needed for their projects, but I also want to have control over the master component. If I decide to change the color of the tooltip, I want this to also affect my colleagues instances wherever they used it.

The problem is that they cannot change the text box size of the instances they are using. So if they detach the instance, whatever change I will do in the design system will not affect their assets.

I know I can create instances of the component, but I really cannot resize the box to all their needs, that would be madness, haha.

Attached is the example of what I am trying to achieve.

Thank you very much in advance for all the answers and help!

Alex

tooltip

Best answer by Alexandru_Grigoras

Hi @tank666 , thank you very much for the reply.

Yes, you’re a magician! HUGE THANKS!

Below are the settings for all the layers, maybe someone else needs this someday.

Under Resizing tab, on the right panel:

  • For the “Tooltip / Up” layer: width (Fixed width) and height (Hug contents)
  • For the “body” layer, inside the “Tooltip / Up” layer: width (Fill container) and height (Hug contents)
  • For the text box (marked with the T symbol), inside the “body” layer: width (Fill container) and height (Hug contents)

Ha, by the way, I always smile when I read “Hug contents” 😄 , fun naming!

Cheers,

Alex

View original
I
maryam6
ach_wahyu
19 people like this
  • I
    isha_mudgal
  • maryam6
    maryam6
  • ach_wahyu
    ach_wahyu
  • Threshold
    Threshold
  • Joshua_Mikael
    Joshua_Mikael
  • Daniel_Sprohar
    Daniel_Sprohar
  • paw_beans
    paw_beans
  • Alexy_Holod
    Alexy_Holod
  • Robyn_Hines
    Robyn_Hines
  • Charly_MICONNET
    Charly_MICONNET
  • Dima_Siefier
    Dima_Siefier
  • D
    Daria57
  • Soo-Sie
    Soo-Sie
  • Arthur_Arakelian
    Arthur_Arakelian
  • ViktorIa_Korotkova
    ViktorIa_Korotkova
  • Patrick25
    Patrick25
  • Tjark
    Tjark
  • Salgado
    Salgado
  • Ema1
    Ema1
This topic has been closed for replies.

2 replies

tank666
  • tank666
  • 4873 replies
  • June 17, 2021

Hi @Alexandru_Grigoras! If I understand correctly, then you need to set the “body” frame and text layer to “Fill container” horizontally. This way, designers can change the width of the instance, which will also affect the change in the width of the text layer.

UX/UI designer. Figma expert. Creator and developer of plugins and widgets for Figma and FigJam. Check out my resources in Figma Community: figma.com/@tank666
Alexandru_Grigoras
1 person likes this
  • Alexandru_Grigoras
    Alexandru_Grigoras
Alexandru_Grigoras

Hi @tank666 , thank you very much for the reply.

Yes, you’re a magician! HUGE THANKS!

Below are the settings for all the layers, maybe someone else needs this someday.

Under Resizing tab, on the right panel:

  • For the “Tooltip / Up” layer: width (Fixed width) and height (Hug contents)
  • For the “body” layer, inside the “Tooltip / Up” layer: width (Fill container) and height (Hug contents)
  • For the text box (marked with the T symbol), inside the “body” layer: width (Fill container) and height (Hug contents)

Ha, by the way, I always smile when I read “Hug contents” 😄 , fun naming!

Cheers,

Alex

K
1 person likes this
  • K
    Khadijah
Terms & ConditionsCookie settings

Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings