Update feedback modal UI

Co-Authored-By: Joseph T. Lyons <19867440+JosephTLyons@users.noreply.github.com>
This commit is contained in:
Nate Butler 2023-11-30 16:42:58 -05:00
parent 8b7be8f614
commit e228422f14

View file

@ -1,8 +1,8 @@
use gpui::{ use gpui::{
div, AppContext, DismissEvent, Div, EventEmitter, FocusHandle, FocusableView, Render, div, rems, AppContext, DismissEvent, Div, EventEmitter, FocusHandle, FocusableView, Render,
ViewContext, ViewContext,
}; };
use ui::prelude::*; use ui::{prelude::*, Button, ButtonStyle, Label, Tooltip};
use workspace::Workspace; use workspace::Workspace;
use crate::feedback_editor::GiveFeedback; use crate::feedback_editor::GiveFeedback;
@ -112,19 +112,53 @@ impl Render for FeedbackModal {
type Element = Div; type Element = Div;
fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element { fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element {
div().elevation_3(cx).w_1_2().h_2_3().child( v_stack()
v_stack() .elevation_3(cx)
.w_full() .min_w(rems(40.))
.child(h_stack().child("header")) .max_w(rems(96.))
.child("editor"), .h(rems(40.))
// Header .p_2()
// - has some info, maybe some links .gap_2()
// Body .child(h_stack().child(Label::new("Give Feedback").color(Color::Default)))
// - Markdown Editor .child(
// - Email address div()
// Footer .flex_1()
// - CTA buttons (Send, Cancel) .bg(cx.theme().colors().editor_background)
) .border()
.border_color(cx.theme().colors().border)
.child("editor"),
)
.child(
h_stack()
.justify_end()
.gap_1()
.child(
Button::new("cancel_feedback", "Cancel")
.style(ButtonStyle::Subtle)
.color(Color::Muted),
)
.child(
Button::new("send_feedback", "Send Feedback")
.color(Color::Accent)
.style(ButtonStyle::Filled)
.tooltip(|cx| {
Tooltip::with_meta(
"Submit feedback to the Zed team.",
None,
"Provide an email address if you want us to be able to reply.",
cx,
)
}),
),
)
// Header
// - has some info, maybe some links
// Body
// - Markdown Editor
// - Email address
// Footer
// - CTA buttons (Send, Cancel)
// div() // div()
// .elevation_2(cx) // .elevation_2(cx)