text_style.rs

  1use gpui::{
  2    App, Application, Bounds, Context, Window, WindowBounds, WindowOptions, div, prelude::*, px,
  3    size,
  4};
  5
  6struct HelloWorld {}
  7
  8impl Render for HelloWorld {
  9    fn render(&mut self, _window: &mut Window, _cx: &mut Context<Self>) -> impl IntoElement {
 10        div()
 11            .font_family(".SystemUIFont")
 12            .bg(gpui::white())
 13            .flex()
 14            .flex_col()
 15            .gap_2()
 16            .p_4()
 17            .gap_4()
 18            .size_full()
 19            .child(div().child("Text left"))
 20            .child(div().text_center().child("Text center"))
 21            .child(div().text_right().child("Text right"))
 22            .child(div().text_decoration_1().child("Text left (underline)"))
 23            .child(
 24                div()
 25                    .text_center()
 26                    .text_decoration_1()
 27                    .child("Text center (underline)"),
 28            )
 29            .child(
 30                div()
 31                    .text_right()
 32                    .text_decoration_1()
 33                    .child("Text right (underline)"),
 34            )
 35            .child(div().line_through().child("Text left (line_through)"))
 36            .child(
 37                div()
 38                    .text_center()
 39                    .line_through()
 40                    .child("Text center (line_through)"),
 41            )
 42            .child(
 43                div()
 44                    .text_right()
 45                    .line_through()
 46                    .child("Text right (line_through)"),
 47            )
 48            .child(
 49                div()
 50                    .flex()
 51                    .gap_2()
 52                    .justify_between()
 53                    .child(
 54                        div()
 55                            .w(px(400.))
 56                            .border_1()
 57                            .border_color(gpui::blue())
 58                            .p_1()
 59                            .whitespace_nowrap()
 60                            .overflow_hidden()
 61                            .text_center()
 62                            .child("A long non-wrapping text align center"),
 63                    )
 64                    .child(
 65                        div()
 66                            .w_32()
 67                            .border_1()
 68                            .border_color(gpui::blue())
 69                            .p_1()
 70                            .whitespace_nowrap()
 71                            .overflow_hidden()
 72                            .text_right()
 73                            .child("100%"),
 74                    ),
 75            )
 76            .child(
 77                div()
 78                    .id("Text Link")
 79                    .text_color(gpui::blue())
 80                    .cursor_pointer()
 81                    .active(|this| {
 82                        this.text_color(gpui::white())
 83                            .bg(gpui::blue())
 84                            .text_decoration_1()
 85                            .text_decoration_wavy()
 86                    })
 87                    .hover(|this| {
 88                        this.text_color(gpui::rgb(0x973717))
 89                            .bg(gpui::yellow())
 90                            .text_decoration_1()
 91                    })
 92                    .child("Text with hover, active styles"),
 93            )
 94    }
 95}
 96
 97fn main() {
 98    Application::new().run(|cx: &mut App| {
 99        let bounds = Bounds::centered(None, size(px(800.0), px(600.0)), cx);
100        cx.open_window(
101            WindowOptions {
102                window_bounds: Some(WindowBounds::Windowed(bounds)),
103                ..Default::default()
104            },
105            |_, cx| cx.new(|_| HelloWorld {}),
106        )
107        .unwrap();
108        cx.activate(true);
109    });
110}