1use gpui::{
2 div, linear_color_stop, linear_gradient, pattern_slash, prelude::*, px, rgb, size, App,
3 AppContext, Application, Bounds, Context, Window, WindowBounds, WindowOptions,
4};
5
6struct PatternExample;
7
8impl Render for PatternExample {
9 fn render(&mut self, _window: &mut Window, _cx: &mut Context<Self>) -> impl IntoElement {
10 div()
11 .flex()
12 .flex_col()
13 .gap_3()
14 .bg(rgb(0xffffff))
15 .size(px(600.0))
16 .justify_center()
17 .items_center()
18 .shadow_lg()
19 .text_xl()
20 .text_color(rgb(0x000000))
21 .child("Pattern Example")
22 .child(
23 div()
24 .flex()
25 .flex_col()
26 .border_1()
27 .border_color(gpui::blue())
28 .child(
29 div()
30 .w(px(54.0))
31 .h(px(18.0))
32 .bg(pattern_slash(gpui::red(), 18.0 / 2.0)),
33 )
34 .child(
35 div()
36 .w(px(54.0))
37 .h(px(18.0))
38 .bg(pattern_slash(gpui::red(), 18.0 / 2.0)),
39 )
40 .child(
41 div()
42 .w(px(54.0))
43 .h(px(18.0))
44 .bg(pattern_slash(gpui::red(), 18.0 / 2.0)),
45 )
46 .child(
47 div()
48 .w(px(54.0))
49 .h(px(18.0))
50 .bg(pattern_slash(gpui::red(), 18.0 / 2.0)),
51 ),
52 )
53 .child(
54 div()
55 .flex()
56 .flex_col()
57 .border_1()
58 .border_color(gpui::blue())
59 .bg(gpui::green().opacity(0.16))
60 .child("Elements the same height should align")
61 .child(
62 div()
63 .w(px(256.0))
64 .h(px(56.0))
65 .bg(pattern_slash(gpui::red(), 56.0 / 3.0)),
66 )
67 .child(
68 div()
69 .w(px(256.0))
70 .h(px(56.0))
71 .bg(pattern_slash(gpui::green(), 56.0 / 3.0)),
72 )
73 .child(
74 div()
75 .w(px(256.0))
76 .h(px(56.0))
77 .bg(pattern_slash(gpui::blue(), 56.0 / 3.0)),
78 )
79 .child(
80 div()
81 .w(px(256.0))
82 .h(px(26.0))
83 .bg(pattern_slash(gpui::yellow(), 56.0 / 3.0)),
84 ),
85 )
86 .child(
87 div()
88 .border_1()
89 .border_color(gpui::blue())
90 .w(px(240.0))
91 .h(px(40.0))
92 .bg(gpui::red()),
93 )
94 .child(
95 div()
96 .border_1()
97 .border_color(gpui::blue())
98 .w(px(240.0))
99 .h(px(40.0))
100 .bg(linear_gradient(
101 45.,
102 linear_color_stop(gpui::red(), 0.),
103 linear_color_stop(gpui::blue(), 1.),
104 )),
105 )
106 }
107}
108
109fn main() {
110 Application::new().run(|cx: &mut App| {
111 let bounds = Bounds::centered(None, size(px(600.0), px(600.0)), cx);
112 cx.open_window(
113 WindowOptions {
114 window_bounds: Some(WindowBounds::Windowed(bounds)),
115 ..Default::default()
116 },
117 |_window, cx| cx.new(|_cx| PatternExample),
118 )
119 .unwrap();
120
121 cx.activate(true);
122 });
123}