Hi,
Is it possible to control/set the font/text size in the Link
component? Keen to know how it can be done. The docs don’t seem to mention of any attributes that can be set.
Many thanks
Hi,
Is it possible to control/set the font/text size in the Link
component? Keen to know how it can be done. The docs don’t seem to mention of any attributes that can be set.
Many thanks
Hi @rebx , yes you can wrap the Link
component around the Text
component and change the font size via the size
prop.
<Link href="/your-link">
<Text as="span" size="small">
Go here
</Text>
</Link>
Hi @QuocLieu,
Thanks for your reply. Yes, that works. What if you have a series (4 or more) links and text that you want to change the size of? Any idea how it can be controlled in a group so there’s less clutter in the code?
Cheers
You could create a custom Link component and use that instead:
const SmallLink = ({children, href}) => {
return <Link href={href}><Text size="small"><{children}</Text></Link>
}
// Usage:
<SmallLink href="/">Link 1</SmallLink>
<SmallLink href="/">Link 2</SmallLink>
<SmallLink href="/">Link 3</SmallLink>
<SmallLink href="/">Link 4</SmallLink>