reya/coop
1
0
Fork 1
Code Issues Pull Requests 1 Releases 4 Activity

introduce typography system and motion module

Browse Source
This commit is contained in:
reya
2026-10-09 19:54:08 +07:00
parent 41e991dd30
commit df411bd044
53 changed files with 1116 additions and 457 deletions
Download Patch File Download Diff File Expand all files Collapse all files
crates/ui/src/dialog.rs
+20 -21
View File
@@ -2,16 +2,14 @@ use std::rc::Rc;
use gpui::prelude::FluentBuilder;
use gpui::{
Animation, AnimationExt as _, AnyElement, App, ClickEvent, Div, FocusHandle, IntoElement,
ParentElement, Pixels, RenderOnce, SharedString, StyleRefinement, Styled, Window, div, px,
transparent_black,
AnimationExt as _, AnyElement, App, ClickEvent, Div, FocusHandle, IntoElement, ParentElement,
Pixels, RenderOnce, SharedString, StyleRefinement, Styled, Window, div, px, transparent_black,
};
use gpui_base::{DialogBackdrop, DialogPopup, DialogTitle};
use instant::Duration;
use theme::{ActiveTheme, SCRIM_ALPHA_DARK, hairline, scrim, surface_radius, surface_shadows};
use crate::animation::cubic_bezier;
use crate::button::{Button, ButtonCustomVariant, ButtonVariant, ButtonVariants as _};
use crate::motion::DIALOG_IN;
use crate::scroll::ScrollableElement;
use crate::{IconName, Root, StyledExt, WindowExtension, h_flex, v_flex};
@@ -272,18 +270,17 @@ impl RenderOnce for Dialog {
padding_right = pr.to_pixels(self.width.into(), window.rem_size());
}
let animation = Animation::new(Duration::from_secs_f64(0.25))
.with_easing(cubic_bezier(0.32, 0.72, 0., 1.));
let backdrop = DialogBackdrop::new()
.absolute()
.inset_0()
.when(self.overlay_visible, |this| {
this.bg(scrim(SCRIM_ALPHA_DARK))
})
.with_animation("fade-in", animation.clone(), move |this, delta| {
this.opacity(delta)
});
.with_animation(
"fade-in",
DIALOG_IN.animation(),
move |this, delta| this.opacity(delta),
);
let card = DialogPopup::new()
.flex()
@@ -373,16 +370,18 @@ impl RenderOnce for Dialog {
.children(footer(render_ok, render_cancel, window, cx)),
)
})
.with_animation("slide-down", animation, move |this, delta| {
// Settle at the target offset; only the entrance is animated.
let y_offset = px(30.) * (delta - 1.);
let mut shadow = surface_shadows();
// The shadows fade in with the slide.
for shadow in &mut shadow {
shadow.color.a *= delta;
}
this.top(y_offset).shadow(shadow)
});
.with_animation(
"slide-down",
DIALOG_IN.animation(),
move |this, delta| {
let y_offset = px(2.) * (delta - 1.);
let mut shadow = surface_shadows();
for shadow in &mut shadow {
shadow.color.a *= delta;
}
this.top(y_offset).shadow(shadow)
},
);
gpui_base::Dialog::new(cx)
.layer(layer_ix, is_topmost)