pub struct text;Expand description
text element is simply a text span used for the paragraph element.
Implementations§
§impl text
 
impl text
pub const color: (&'static str, Option<&'static str>, bool) = _
pub const color: (&'static str, Option<&'static str>, bool) = _
color
The color attribute let’s you specify the color of the text.
You can learn about the syntax of this attribute in Color Syntax.
Example:
fn app(cx: Scope) -> Element {
    render!(
        label {
            color: "green",
            "Hello, World!"
        }
    )
}Another example showing inheritance:
fn app(cx: Scope) -> Element {
    render!(
        rect {
            color: "blue",
            label {
                "Hello, World!"
            }
        }
    )
}
pub const text_shadow: (&'static str, Option<&'static str>, bool) = _
pub const text_shadow: (&'static str, Option<&'static str>, bool) = _
font_size
You can specify the size of the text using font_size.
Example:
fn app(cx: Scope) -> Element {
    render!(
        label {
            font_size: "50",
            "Hellooooo!"
        }
    )
}pub const height: (&'static str, Option<&'static str>, bool) = _
pub const height: (&'static str, Option<&'static str>, bool) = _
width and height
Specify the width and height for the given element.
See syntax in Size Units.
Example:
fn app(cx: Scope) -> Element {
    render!(
        rect {
            background: "red",
            width: "15",
            height: "50",
        }
    )
}pub const width: (&'static str, Option<&'static str>, bool) = _
pub const font_size: (&'static str, Option<&'static str>, bool) = _
pub const font_size: (&'static str, Option<&'static str>, bool) = _
font_size
You can specify the size of the text using font_size.
Example:
fn app(cx: Scope) -> Element {
    render!(
        label {
            font_size: "50",
            "Hellooooo!"
        }
    )
}pub const font_family: (&'static str, Option<&'static str>, bool) = _
pub const font_family: (&'static str, Option<&'static str>, bool) = _
font_family
With the font_family you can specify what font do you want to use for the inner text.
Limitation: Only fonts installed in the system are supported for now.
Example:
fn app(cx: Scope) -> Element {
    render!(
        label {
            font_family: "Inter",
            "Hello, World!"
        }
    )
}pub const font_style: (&'static str, Option<&'static str>, bool) = _
pub const font_style: (&'static str, Option<&'static str>, bool) = _
font_style
You can choose a style for a text using the font_style attribute.
Accepted values: upright (default), italic and oblique.
Example:
fn app(cx: Scope) -> Element {
    render!(
        label {
            font_style: "italic",
            "Hello, World!"
        }
    )
}pub const font_weight: (&'static str, Option<&'static str>, bool) = _
pub const font_weight: (&'static str, Option<&'static str>, bool) = _
font_weight
You can choose a weight for a text using the font_weight attribute.
Accepted values:
- invisible
- thin
- extra-light
- light
- normal(default)
- medium
- semi-bold
- bold
- extra-bold
- black
- extra-black
- 50
- 100
- 200
- 300
- 400
- 500
- 600
- 700
- 800
- 900
- 950
Example:
fn app(cx: Scope) -> Element {
    render!(
        label {
            font_weight: "bold",
            "Hello, World!"
        }
    )
}pub const font_width: (&'static str, Option<&'static str>, bool) = _
pub const font_width: (&'static str, Option<&'static str>, bool) = _
font_width
You can choose a width for a text using the font_width attribute.
Accepted values:
- ultra-condensed
- extra-condensed
- condensed
- normal(default)
- semi-expanded
- expanded
- extra-expanded
- ultra-expanded
Example:
fn app(cx: Scope) -> Element {
    render!(
        label {
            font_weight: "bold",
            "Hello, World!"
        }
    )
}pub const line_height: (&'static str, Option<&'static str>, bool) = _
pub const line_height: (&'static str, Option<&'static str>, bool) = _
line_height
Specify the height of the lines of the text.
Example:
fn app(cx: Scope) -> Element {
    render!(
        label {
            lines_height: "3",
            "Hello, World! \n Hello, again!"
        }
    )
}pub const letter_spacing: (&'static str, Option<&'static str>, bool) = _
pub const letter_spacing: (&'static str, Option<&'static str>, bool) = _
letter_spacing
Specify the spacing between characters of the text.
Example:
fn app(cx: Scope) -> Element {
    render!(
        label {
            letter_spacing: "10",
            "Hello, World!"
        }
    )
}pub const word_spacing: (&'static str, Option<&'static str>, bool) = _
pub const word_spacing: (&'static str, Option<&'static str>, bool) = _
word_spacing
Specify the spacing between words of the text.
Example:
fn app(cx: Scope) -> Element {
    render!(
        label {
            word_spacing: "10",
            "Hello, World!"
        }
    )
}pub const decoration: (&'static str, Option<&'static str>, bool) = _
pub const decoration: (&'static str, Option<&'static str>, bool) = _
decoration
Specify the decoration in a text.
Accpted values:
- underline
- line-through
- overline
Example:
fn app(cx: Scope) -> Element {
    render!(
        label {
            decoration: "line-through",
            "Hello, World!"
        }
    )
}pub const decoration_style: (&'static str, Option<&'static str>, bool) = _
pub const decoration_style: (&'static str, Option<&'static str>, bool) = _
decoration_style
Specify the decoration’s style in a text.
Accpted values:
- solid(default)
- double
- dotted
- dashed
- wavy
Example:
fn app(cx: Scope) -> Element {
    render!(
        label {
            decoration: "line-through",
            decoration_style: "dotted",
            "Hello, World!"
        }
    )
}pub const decoration_color: (&'static str, Option<&'static str>, bool) = _
pub const decoration_color: (&'static str, Option<&'static str>, bool) = _
decoration_color
Specify the decoration’s color in a text.
You can learn about the syntax of this attribute in Color Syntax.
Example:
fn app(cx: Scope) -> Element {
    render!(
        label {
            decoration: "line-through",
            decoration_color: "orange",
            "Hello, World!"
        }
    )
}