feat: design touch up
This commit is contained in:
@@ -87,8 +87,8 @@ impl gpui::RenderOnce for Button {
|
||||
let theme = app::current_theme(cx);
|
||||
|
||||
let icon_color = match self.variant {
|
||||
| Variant::Primary => theme.colors.accent_on_solid,
|
||||
| Variant::Secondary => theme.colors.text,
|
||||
| Variant::Primary => theme.colors.accent_on_solid,
|
||||
| Variant::Secondary => theme.colors.text,
|
||||
};
|
||||
|
||||
let mut children: Vec<AnyElement> = Vec::with_capacity(3);
|
||||
|
||||
@@ -210,25 +210,22 @@ impl gpui::RenderOnce for IssueListItem {
|
||||
)
|
||||
.child(pills_row),
|
||||
)
|
||||
.when(!self.is_last, |it| {
|
||||
it.border_b_1().border_color(theme.colors.border)
|
||||
})
|
||||
.when(self.is_selected, |it| {
|
||||
it.bg(theme.colors.selection_bg)
|
||||
.overflow_hidden()
|
||||
.border_r_1()
|
||||
.rounded_md()
|
||||
.child(
|
||||
div()
|
||||
.absolute()
|
||||
.right_0()
|
||||
.top_0()
|
||||
.bottom_0()
|
||||
.w_px()
|
||||
.left_0()
|
||||
.top(px(6.))
|
||||
.bottom(px(6.))
|
||||
.w_0p5()
|
||||
.bg(theme.colors.selection_border)
|
||||
.shadow(vec![gpui::BoxShadow {
|
||||
blur_radius: px(16.),
|
||||
blur_radius: px(10.),
|
||||
spread_radius: px(2.),
|
||||
color: gpui::Hsla::from(theme.colors.selection_border).alpha(0.8),
|
||||
color: gpui::Hsla::from(theme.colors.selection_border),
|
||||
offset: point(px(-2.), px(0.)),
|
||||
}]),
|
||||
)
|
||||
|
||||
@@ -89,41 +89,41 @@ impl PullRequestView {
|
||||
.rounded_full();
|
||||
|
||||
match pr.state {
|
||||
| api::issues::PullRequestState::Open => {
|
||||
status_pill = status_pill
|
||||
.bg(theme.colors.success_solid)
|
||||
.child(
|
||||
font_icon(FontIcon::PullRequestArrow)
|
||||
.size_3()
|
||||
.text_color(theme.colors.success_on_solid),
|
||||
)
|
||||
.child(
|
||||
text("Open")
|
||||
.text_color(theme.colors.success_on_solid)
|
||||
.text_xs(),
|
||||
);
|
||||
}
|
||||
| api::issues::PullRequestState::Closed => {
|
||||
status_pill = status_pill
|
||||
.bg(theme.colors.danger_solid)
|
||||
.child(
|
||||
font_icon(FontIcon::PullRequestClosed)
|
||||
.size_3()
|
||||
.text_color(theme.colors.danger_on_solid),
|
||||
)
|
||||
.child(
|
||||
text("Closed")
|
||||
.text_color(theme.colors.danger_on_solid)
|
||||
.text_xs(),
|
||||
);
|
||||
}
|
||||
| api::issues::PullRequestState::Merged => {
|
||||
status_pill = status_pill.bg(theme.colors.accent_solid).child(
|
||||
text("Merged")
|
||||
.text_color(theme.colors.accent_on_solid)
|
||||
| api::issues::PullRequestState::Open => {
|
||||
status_pill = status_pill
|
||||
.bg(theme.colors.success_solid)
|
||||
.child(
|
||||
font_icon(FontIcon::PullRequestArrow)
|
||||
.size_3()
|
||||
.text_color(theme.colors.success_on_solid),
|
||||
)
|
||||
.child(
|
||||
text("Open")
|
||||
.text_color(theme.colors.success_on_solid)
|
||||
.text_xs(),
|
||||
);
|
||||
}
|
||||
}
|
||||
| api::issues::PullRequestState::Closed => {
|
||||
status_pill = status_pill
|
||||
.bg(theme.colors.danger_solid)
|
||||
.child(
|
||||
font_icon(FontIcon::PullRequestClosed)
|
||||
.size_3()
|
||||
.text_color(theme.colors.danger_on_solid),
|
||||
)
|
||||
.child(
|
||||
text("Closed")
|
||||
.text_color(theme.colors.danger_on_solid)
|
||||
.text_xs(),
|
||||
);
|
||||
}
|
||||
| api::issues::PullRequestState::Merged => {
|
||||
status_pill = status_pill.bg(theme.colors.accent_solid).child(
|
||||
text("Merged")
|
||||
.text_color(theme.colors.accent_on_solid)
|
||||
.text_xs(),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
let merge_text = match (
|
||||
@@ -131,48 +131,48 @@ impl PullRequestView {
|
||||
pr.base_branch_name.as_ref(),
|
||||
pr.head_branch_name.as_ref(),
|
||||
) {
|
||||
| (Some(author), Some(base_branch), Some(head_branch)) => {
|
||||
let str = format!(
|
||||
"{} requested to merge {} into {}",
|
||||
author.login, head_branch, base_branch
|
||||
);
|
||||
| (Some(author), Some(base_branch), Some(head_branch)) => {
|
||||
let str = format!(
|
||||
"{} requested to merge {} into {}",
|
||||
author.login, head_branch, base_branch
|
||||
);
|
||||
|
||||
let head_branch_text_offset = author.login.len() + 20;
|
||||
let base_branch_text_offset = head_branch_text_offset + head_branch.len() + 6;
|
||||
let head_branch_text_offset = author.login.len() + 20;
|
||||
let base_branch_text_offset = head_branch_text_offset + head_branch.len() + 6;
|
||||
|
||||
let highlights = [
|
||||
(
|
||||
0..author.login.len(),
|
||||
gpui::HighlightStyle {
|
||||
font_weight: Some(gpui::FontWeight::BOLD),
|
||||
..Default::default()
|
||||
},
|
||||
),
|
||||
(
|
||||
head_branch_text_offset..head_branch_text_offset + head_branch.len(),
|
||||
gpui::HighlightStyle {
|
||||
font_weight: Some(gpui::FontWeight::BOLD),
|
||||
color: Some(theme.colors.accent_fg.into()),
|
||||
..Default::default()
|
||||
},
|
||||
),
|
||||
(
|
||||
base_branch_text_offset..base_branch_text_offset + base_branch.len(),
|
||||
gpui::HighlightStyle {
|
||||
font_weight: Some(gpui::FontWeight::BOLD),
|
||||
color: Some(theme.colors.accent_fg.into()),
|
||||
..Default::default()
|
||||
},
|
||||
),
|
||||
];
|
||||
let highlights = [
|
||||
(
|
||||
0..author.login.len(),
|
||||
gpui::HighlightStyle {
|
||||
font_weight: Some(gpui::FontWeight::BOLD),
|
||||
..Default::default()
|
||||
},
|
||||
),
|
||||
(
|
||||
head_branch_text_offset..head_branch_text_offset + head_branch.len(),
|
||||
gpui::HighlightStyle {
|
||||
font_weight: Some(gpui::FontWeight::BOLD),
|
||||
color: Some(theme.colors.accent_fg.into()),
|
||||
..Default::default()
|
||||
},
|
||||
),
|
||||
(
|
||||
base_branch_text_offset..base_branch_text_offset + base_branch.len(),
|
||||
gpui::HighlightStyle {
|
||||
font_weight: Some(gpui::FontWeight::BOLD),
|
||||
color: Some(theme.colors.accent_fg.into()),
|
||||
..Default::default()
|
||||
},
|
||||
),
|
||||
];
|
||||
|
||||
Some((
|
||||
author,
|
||||
gpui::StyledText::new(str).with_highlights(highlights),
|
||||
))
|
||||
}
|
||||
Some((
|
||||
author,
|
||||
gpui::StyledText::new(str).with_highlights(highlights),
|
||||
))
|
||||
}
|
||||
|
||||
| _ => None,
|
||||
| _ => None,
|
||||
};
|
||||
|
||||
let metadata_line =
|
||||
@@ -205,6 +205,7 @@ impl PullRequestView {
|
||||
.size_full()
|
||||
.flex()
|
||||
.flex_col()
|
||||
.bg(theme.colors.surface)
|
||||
.overflow_hidden()
|
||||
.child(Toolbar {})
|
||||
.child(
|
||||
@@ -217,7 +218,7 @@ impl PullRequestView {
|
||||
.px_3p5()
|
||||
.py_3()
|
||||
.border_b_1()
|
||||
.border_color(theme.colors.border)
|
||||
.border_color(theme.colors.border_muted)
|
||||
.child(
|
||||
div()
|
||||
.w_full()
|
||||
@@ -261,18 +262,18 @@ impl gpui::Render for PullRequestView {
|
||||
cx: &mut gpui::Context<Self>,
|
||||
) -> impl gpui::IntoElement {
|
||||
div().size_full().child(match &self.pull_request_query {
|
||||
| Some(q) => match read_query(q, cx) {
|
||||
| QueryStatus::Loaded(pr) => self.pr_content(pr, cx),
|
||||
| QueryStatus::Err(e) => div()
|
||||
.size_full()
|
||||
.child(format!("{:?}", e))
|
||||
.into_any_element(),
|
||||
| QueryStatus::Loading => div()
|
||||
.size_full()
|
||||
.child("loading pr content")
|
||||
.into_any_element(),
|
||||
},
|
||||
| None => div().size_full().child("no pr selected").into_any_element(),
|
||||
| Some(q) => match read_query(q, cx) {
|
||||
| QueryStatus::Loaded(pr) => self.pr_content(pr, cx),
|
||||
| QueryStatus::Err(e) => div()
|
||||
.size_full()
|
||||
.child(format!("{:?}", e))
|
||||
.into_any_element(),
|
||||
| QueryStatus::Loading => div()
|
||||
.size_full()
|
||||
.child("loading pr content")
|
||||
.into_any_element(),
|
||||
},
|
||||
| None => div().size_full().child("no pr selected").into_any_element(),
|
||||
})
|
||||
}
|
||||
}
|
||||
@@ -284,6 +285,7 @@ impl gpui::RenderOnce for Toolbar {
|
||||
.px_2p5()
|
||||
.py_1()
|
||||
.variant(button::Variant::Secondary)
|
||||
.border_0()
|
||||
}
|
||||
|
||||
fn divider() -> gpui::Div {
|
||||
@@ -291,6 +293,7 @@ impl gpui::RenderOnce for Toolbar {
|
||||
}
|
||||
|
||||
let theme = app::current_theme(cx);
|
||||
|
||||
div()
|
||||
.w_full()
|
||||
.flex()
|
||||
@@ -298,9 +301,9 @@ impl gpui::RenderOnce for Toolbar {
|
||||
.items_center()
|
||||
.justify_start()
|
||||
.p_1()
|
||||
.bg(theme.colors.background)
|
||||
.bg(theme.colors.surface)
|
||||
.border_b_1()
|
||||
.border_color(theme.colors.border)
|
||||
.border_color(theme.colors.border_muted)
|
||||
.child(
|
||||
toolbar_button("pr-review-btn")
|
||||
.leading(font_icon(FontIcon::Eye))
|
||||
@@ -309,9 +312,9 @@ impl gpui::RenderOnce for Toolbar {
|
||||
.child(
|
||||
toolbar_button("pr-review-btn")
|
||||
.leading(font_icon(FontIcon::RefreshCw))
|
||||
.mr_2(),
|
||||
.mr_1(),
|
||||
)
|
||||
.child(divider().bg(theme.colors.border).mr_2())
|
||||
.child(divider().bg(theme.colors.border).mr_1())
|
||||
.child(toolbar_button("pr-review-btn").leading(font_icon(FontIcon::Star)))
|
||||
.child(div().flex_1())
|
||||
.child(
|
||||
|
||||
@@ -33,9 +33,9 @@ impl Screen {
|
||||
fn on_create(&mut self, cx: &mut gpui::Context<Self>) {
|
||||
_ = cx
|
||||
.subscribe(&self.issue_list, |this, _, event, cx| match event {
|
||||
| issue_list::Event::ItemSelected(pr_id) => {
|
||||
this.handle_issue_list_item_selected(pr_id, cx);
|
||||
}
|
||||
| issue_list::Event::ItemSelected(pr_id) => {
|
||||
this.handle_issue_list_item_selected(pr_id, cx);
|
||||
}
|
||||
})
|
||||
.detach();
|
||||
}
|
||||
@@ -64,8 +64,8 @@ impl gpui::Render for Screen {
|
||||
div()
|
||||
.flex()
|
||||
.flex_col()
|
||||
.bg(theme.colors.background)
|
||||
.size_full()
|
||||
.bg(theme.colors.surface_chrome)
|
||||
.child(self.titlebar.clone())
|
||||
.child(
|
||||
div()
|
||||
@@ -79,7 +79,7 @@ impl gpui::Render for Screen {
|
||||
.w_64()
|
||||
.flex_shrink_0()
|
||||
.h_full()
|
||||
.bg(theme.colors.surface_chrome)
|
||||
.ml_2()
|
||||
.overflow_hidden()
|
||||
.child(self.issue_list.clone()),
|
||||
)
|
||||
@@ -88,9 +88,12 @@ impl gpui::Render for Screen {
|
||||
.flex_1()
|
||||
.min_w_0()
|
||||
.min_h_0()
|
||||
.h_full()
|
||||
.m_2()
|
||||
.mt_0()
|
||||
.rounded_lg()
|
||||
.overflow_hidden()
|
||||
.bg(theme.colors.surface)
|
||||
.border_1()
|
||||
.border_color(theme.colors.border_muted)
|
||||
.child(self.pull_request_view.clone()),
|
||||
),
|
||||
)
|
||||
|
||||
@@ -53,8 +53,6 @@ impl gpui::Render for TitleBar {
|
||||
.bg(g.current_theme.colors.surface_chrome)
|
||||
.text_color(g.current_theme.colors.text)
|
||||
.relative()
|
||||
.border_b_1()
|
||||
.border_color(g.current_theme.colors.border)
|
||||
.child(repo_selector(cx))
|
||||
.child(user_avatar)
|
||||
}
|
||||
|
||||
@@ -15,11 +15,11 @@ pub(crate) const fn latte() -> Theme {
|
||||
mode: ThemeMode::Light,
|
||||
colors: ThemeColors {
|
||||
background: hex(0xeff1f5),
|
||||
surface: hex(0xeff1f5),
|
||||
surface: hex(0xe6e9ef),
|
||||
surface_elevated: hex(0xdce0e8),
|
||||
surface_chrome: hex(0xe6e9ef),
|
||||
surface_hover: hex(0xe6e9ef),
|
||||
surface_active: hex(0xdce0e8),
|
||||
surface_chrome: hex(0xdce0e8),
|
||||
surface_hover: hex(0xdce0e8),
|
||||
surface_active: hex(0xccd0da),
|
||||
border: hex(0xbcc0cc),
|
||||
border_muted: hex(0xccd0da),
|
||||
border_strong: hex(0xacb0be),
|
||||
|
||||
Reference in New Issue
Block a user