-
Notifications
You must be signed in to change notification settings - Fork 7
Text
Andrew Sutton edited this page Jan 26, 2024
·
2 revisions
Besides Fui.text, here's a list of other text components at our disposal, which you can access using Fui.text.{component}:
body1, body1, body1Strong, body1Strong, body1Stronger, body1Stronger, body2 , body2, caption1 , caption1, caption1Strong, caption1Strong, caption1Stronger , caption1Stronger, caption2, caption2, caption2Strong, caption2Strong, display , display, largeTitle , largeTitle, subtitle1 , subtitle1, subtitle2 , subtitle2, subtitle2Stronger, subtitle2Stronger, title1 , title1, title2, title2, title3, title3

let texts =
Fui.stack [
stack.horizontal true
stack.tokens [ stack.tokens.childrenGap 16 ]
stack.children [
Fui.text [
text.text "Test 1"
text.italic true
text.font.base'
text.size.``500``
text.weight.medium
]
Fui.text [
text.text "Test 2"
text.strikeThrough true
text.font.monospace
text.size.``1000``
text.weight.regular
]
Fui.text [
text.text "This is test 3 and the text should wrap"
text.style [ style.maxWidth 150 ]
text.underline true
text.wrap true
text.font.numeric
text.size.``200``
text.weight.semibold
text.align.end'
]
Fui.text [
text.text "This is test 4 and the text should NOT wrap"
text.style [ style.maxWidth 150 ]
text.underline false
text.wrap false
text.size.``200``
text.weight.bold
text.truncate true
]
Fui.text.body1 [
text.italic true
text.text "Body 1"
]
Fui.text.body1Strong [
text.underline true
text.text "Body 1 Strong"
]
Fui.text.display [
text.text "Display"
]
]
]