topic Re: Code Assistance - SingleValue Label change Font-Size in Developer Q&A Forum

Code Assistance - SingleValue Label change Font-Size

MaximilianoML — Tue, 29 Oct 2024 18:00:00 GMT

Hello guys!

I need some help with code, I wanna know if is there a way to change the Font Size of the Label in the React component:

Thank you, for all 🙂

Re: Code Assistance - SingleValue Label change Font-Size

imsingh — Wed, 30 Oct 2024 08:48:28 GMT

Hi @MaximilianoML

AFAIK, The SingleValue component doesn't provide a way to change the size of a label.

You can of course change it via CSS since label has a specific class applied to it. However, I wouldn't recommend it.

What's your usecase?

Thanks

Re: Code Assistance - SingleValue Label change Font-Size

MaximilianoML — Wed, 30 Oct 2024 09:22:21 GMT

Hi @imsingh

Using CSS is a good idea, I tried but I didn't find a way to change by CSS... I want to reduce 50% of the size.

If you have a code snippet to active this, let me know 🙂

Thanks a lot,

Maximiliano Lopes

Re: Code Assistance - SingleValue Label change Font-Size

imsingh — Wed, 13 Nov 2024 15:07:41 GMT

Hi MaximilianoML

Can you try the following code snippet without label property but using a Heading component? This give you more control than using the `label` property.

<StyledContainer> <Heading level={6}>My Custom Label</Heading> <SingleValue data={70000000} formatter={formatter} prefixIcon={<ViewIcon />} unit={'B'} /> </StyledContainer>

Re: Code Assistance - SingleValue Label change Font-Size

MaximilianoML — Thu, 14 Nov 2024 17:29:44 GMT

Perfect!

Great and simple solution, thank you! 😁