Yehowshua/ZIm
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Checkpoint

Browse source
This commit is contained in:
Antonio Scandurra 2023-10-20 17:58:14 +02:00
parent b0b7f27f3a
commit 825c352b6a
2 changed files with 52 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

61
crates/storybook2/src/stories/scroll.rs
View file

@ -1,5 +1,8 @@
use crate::themes::rose_pine;
use gpui3::{div, view, Context, ParentElement, Styled, View, WindowContext};
use gpui3::{
div, px, view, Context, Element, ParentElement, SharedString, Styled, View, WindowContext,
};
use ui::ElementExt;
pub struct ScrollStory {
text: View<()>,
@ -9,20 +12,46 @@ impl ScrollStory {
pub fn view(cx: &mut WindowContext) -> View<()> {
let theme = rose_pine();
view(cx.entity(|cx| ()), move |_, cx| {
div()
.id("parent")
.bg(theme.lowest.base.default.background)
.size_full()
.overflow_x_scroll()
.child(div().w_96().flex().flex_row().children((0..3).map(|ix| {
let bg = if ix % 2 == 0 {
theme.middle.positive.default.background
} else {
theme.middle.warning.default.background
};
div().bg(bg).flex_1().h_20()
})))
})
view(cx.entity(|cx| ()), move |_, cx| checkerboard(1))
}
}
fn checkerboard<S>(depth: usize) -> impl Element<ViewState = S>
where
S: 'static + Send + Sync,
{
let theme = rose_pine();
let color_1 = theme.lowest.positive.default.background;
let color_2 = theme.lowest.warning.default.background;
div()
.id("parent")
.bg(theme.lowest.base.default.background)
.size_full()
.overflow_scroll()
.children((0..10).map(|row| {
div()
.w(px(1000.))
.h(px(100.))
.flex()
.flex_row()
.children((0..10).map(|column| {
let id = SharedString::from(format!("{}, {}", row, column));
let bg = if row % 2 == column % 2 {
color_1
} else {
color_2
};
div().id(id).bg(bg).size(px(100. / depth as f32)).when(
row >= 5 && column >= 5,
|d| {
d.overflow_scroll()
.child(div().size(px(50.)).bg(color_1))
.child(div().size(px(50.)).bg(color_2))
.child(div().size(px(50.)).bg(color_1))
.child(div().size(px(50.)).bg(color_2))
},
)
}))
}))
}