migrate ui crate to new theme tokens
This commit is contained in:
+20
-30
@@ -2,13 +2,13 @@ use std::rc::Rc;
|
||||
|
||||
use gpui::prelude::FluentBuilder;
|
||||
use gpui::{
|
||||
Animation, AnimationExt as _, AnyElement, App, BoxShadow, ClickEvent, Div, FocusHandle,
|
||||
IntoElement, ParentElement, Pixels, RenderOnce, SharedString, StyleRefinement, Styled, Window,
|
||||
div, hsla, point, px,
|
||||
Animation, 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;
|
||||
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 _};
|
||||
@@ -278,7 +278,9 @@ impl RenderOnce for Dialog {
|
||||
let backdrop = DialogBackdrop::new()
|
||||
.absolute()
|
||||
.inset_0()
|
||||
.when(self.overlay_visible, |this| this.bg(cx.theme().overlay))
|
||||
.when(self.overlay_visible, |this| {
|
||||
this.bg(scrim(SCRIM_ALPHA_DARK))
|
||||
})
|
||||
.with_animation("fade-in", animation.clone(), move |this, delta| {
|
||||
this.opacity(delta)
|
||||
});
|
||||
@@ -286,11 +288,11 @@ impl RenderOnce for Dialog {
|
||||
let card = DialogPopup::new()
|
||||
.flex()
|
||||
.flex_col()
|
||||
.bg(cx.theme().background)
|
||||
.bg(cx.theme().surface_dialog)
|
||||
.border_1()
|
||||
.border_color(cx.theme().border.alpha(0.4))
|
||||
.rounded(cx.theme().radius_lg)
|
||||
.when(cx.theme().shadow, |this| this.shadow_xl())
|
||||
.border_color(hairline(0.4))
|
||||
.rounded(px(surface_radius()))
|
||||
.when(cx.theme().shadow, |this| this.shadow(surface_shadows()))
|
||||
.min_h_24()
|
||||
.refine_style(&self.style)
|
||||
.relative()
|
||||
@@ -329,10 +331,10 @@ impl RenderOnce for Dialog {
|
||||
.icon(IconName::CloseCircleFill)
|
||||
.custom(
|
||||
ButtonCustomVariant::new(window, cx)
|
||||
.foreground(cx.theme().icon_muted)
|
||||
.color(cx.theme().ghost_element_background)
|
||||
.hover(cx.theme().ghost_element_background)
|
||||
.active(cx.theme().ghost_element_background),
|
||||
.foreground(cx.theme().text_faint)
|
||||
.color(transparent_black())
|
||||
.hover(cx.theme().element_hover)
|
||||
.active(cx.theme().element_active),
|
||||
)
|
||||
.on_click(move |_, window, cx| {
|
||||
on_cancel(&ClickEvent::default(), window, cx);
|
||||
@@ -374,23 +376,11 @@ impl RenderOnce for Dialog {
|
||||
.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.);
|
||||
// This is equivalent to `shadow_xl` with an extra opacity.
|
||||
let shadow = vec![
|
||||
BoxShadow {
|
||||
color: hsla(0., 0., 0., 0.1 * delta),
|
||||
offset: point(px(0.), px(20.)),
|
||||
blur_radius: px(25.),
|
||||
spread_radius: px(-5.),
|
||||
inset: false,
|
||||
},
|
||||
BoxShadow {
|
||||
color: hsla(0., 0., 0., 0.1 * delta),
|
||||
offset: point(px(0.), px(8.)),
|
||||
blur_radius: px(10.),
|
||||
spread_radius: px(-6.),
|
||||
inset: false,
|
||||
},
|
||||
];
|
||||
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)
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user