Как оформить компонент Title в Mantine?
Я пытаюсь стилизовать компонент Title в Mantine: https://mantine.dev/core/title/
<Title order = {1} my = "lg" align = "center">
Upload a new Post
</Title>
Согласно документам, мы можем использовать color: <Title order = {1} my = "lg" align = "center" color = "blue" и добавить градиент аналогичным образом.
Впрочем, первое ничего не меняет. В то время как последний приводит к ошибке: Введите '{ дочерние элементы: строка; порядок: 1; мой: "lg"; выровнять: "по центру"; градиент: правда; }» нельзя назначить для типа «IntrinsicAttributes & TitleProps & RefAttributes». Свойство "градиент" не существует для типа "IntrinsicAttributes & TitleProps & RefAttributes".ts(2322)
Буду очень признателен за помощь, ура
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Если вам нужен градиентный текст, вы можете сделать что-то вроде:
<Title
order = {1}
my = "lg"
align = "center"
sx = {(theme) => ({
WebkitBackgroundClip: "text",
WebkitTextFillColor: "transparent",
background: theme.fn.linearGradient({ from: "blue", to: "pink", deg: 45 })
})}
>
Upload a new Post...
</Title>
Если градиент повторно используется в нескольких местах, вы можете добавить его в свою тему.
Ах, я, возможно, был на немного более старой версии. Я обновлю ответ, чтобы отразить
Говорит: свойство «градиент» не существует для типа «MantineThemeFunctions». ts (2339) изменено на
theme.fn.linearGradient(45, "red", "blue")