1use gpui::{div, prelude::*, px, Div, Render, SharedString, Stateful, Styled, View, WindowContext};
 2use theme2::ActiveTheme;
 3
 4pub struct ScrollStory;
 5
 6impl ScrollStory {
 7    pub fn view(cx: &mut WindowContext) -> View<ScrollStory> {
 8        cx.build_view(|cx| ScrollStory)
 9    }
10}
11
12impl Render for ScrollStory {
13    type Element = Stateful<Self, Div<Self>>;
14
15    fn render(&mut self, cx: &mut gpui::ViewContext<Self>) -> Self::Element {
16        let theme = cx.theme();
17        let color_1 = theme.status().created;
18        let color_2 = theme.status().modified;
19
20        div()
21            .id("parent")
22            .bg(theme.colors().background)
23            .size_full()
24            .overflow_scroll()
25            .children((0..10).map(|row| {
26                div()
27                    .w(px(1000.))
28                    .h(px(100.))
29                    .flex()
30                    .flex_row()
31                    .children((0..10).map(|column| {
32                        let id = SharedString::from(format!("{}, {}", row, column));
33                        let bg = if row % 2 == column % 2 {
34                            color_1
35                        } else {
36                            color_2
37                        };
38                        div().id(id).bg(bg).size(px(100. as f32)).when(
39                            row >= 5 && column >= 5,
40                            |d| {
41                                d.overflow_scroll()
42                                    .child(div().size(px(50.)).bg(color_1))
43                                    .child(div().size(px(50.)).bg(color_2))
44                                    .child(div().size(px(50.)).bg(color_1))
45                                    .child(div().size(px(50.)).bg(color_2))
46                            },
47                        )
48                    }))
49            }))
50    }
51}