adjusted icon sizes downwards

Co-authored-by: Piotr <piotr@zed.dev>
This commit is contained in:
KCaverly 2023-08-16 14:01:06 +01:00
parent 6f78a1633d
commit 2a7df106e1
5 changed files with 18 additions and 9 deletions

View file

@ -250,7 +250,7 @@ impl View for BufferSearchBar {
SearchOptions::WHOLE_WORD, SearchOptions::WHOLE_WORD,
cx, cx,
)) ))
.flex(1., true) .flex_float()
.contained(), .contained(),
) )
.align_children_center() .align_children_center()

View file

@ -1447,7 +1447,8 @@ impl View for ProjectSearchBar {
.with_child(filter_button) .with_child(filter_button)
.with_children(case_sensitive) .with_children(case_sensitive)
.with_children(whole_word) .with_children(whole_word)
.flex(1., true) .flex(1., false)
.constrained()
.contained(), .contained(),
) )
.align_children_center() .align_children_center()

View file

@ -185,11 +185,15 @@ pub(crate) fn render_option_button_icon<V: View>(
.in_state(is_active) .in_state(is_active)
.style_for(state); .style_for(state);
Svg::new(icon) Svg::new(icon)
.with_color(style.text.color.clone()) .with_color(style.color.clone())
.constrained()
.with_width(style.icon_width)
.contained() .contained()
.with_style(style.container) .with_style(style.container)
// .aligned()
.constrained() .constrained()
.with_height(theme.search.option_button_height) .with_height(theme.search.option_button_height)
.with_width(style.button_width)
}) })
.on_click(MouseButton::Left, on_click) .on_click(MouseButton::Left, on_click)
.with_cursor_style(CursorStyle::PointingHand) .with_cursor_style(CursorStyle::PointingHand)

View file

@ -379,7 +379,7 @@ pub struct Search {
pub include_exclude_editor: FindEditor, pub include_exclude_editor: FindEditor,
pub invalid_include_exclude_editor: ContainerStyle, pub invalid_include_exclude_editor: ContainerStyle,
pub include_exclude_inputs: ContainedText, pub include_exclude_inputs: ContainedText,
pub option_button: Toggleable<Interactive<ContainedText>>, pub option_button: Toggleable<Interactive<IconButton>>,
pub action_button: Toggleable<Interactive<ContainedText>>, pub action_button: Toggleable<Interactive<ContainedText>>,
pub match_background: Color, pub match_background: Color,
pub match_index: ContainedText, pub match_index: ContainedText,

View file

@ -2,6 +2,7 @@ import { with_opacity } from "../theme/color"
import { background, border, foreground, text } from "./components" import { background, border, foreground, text } from "./components"
import { interactive, toggleable } from "../element" import { interactive, toggleable } from "../element"
import { useTheme } from "../theme" import { useTheme } from "../theme"
import { toggleable_icon_button } from "../component/icon_button"
export default function search(): any { export default function search(): any {
const theme = useTheme() const theme = useTheme()
@ -43,7 +44,9 @@ export default function search(): any {
option_button: toggleable({ option_button: toggleable({
base: interactive({ base: interactive({
base: { base: {
...text(theme.highest, "mono", "variant"), icon_width: 14,
button_width: 32,
color: foreground(theme.highest, "variant"),
background: background(theme.highest, "on"), background: background(theme.highest, "on"),
corner_radius: 2, corner_radius: 2,
margin: { right: 2 }, margin: { right: 2 },
@ -53,6 +56,8 @@ export default function search(): any {
padding: { padding: {
left: 4, left: 4,
right: 4, right: 4,
top: 4,
bottom: 4,
}, },
}, },
state: { state: {
@ -75,6 +80,9 @@ export default function search(): any {
state: { state: {
active: { active: {
default: { default: {
icon_width: 14,
button_width: 32,
color: foreground(theme.highest, "variant"),
background: background(theme.highest, "accent"), background: background(theme.highest, "accent"),
border: border(theme.highest, "accent"), border: border(theme.highest, "accent"),
}, },
@ -272,10 +280,8 @@ export default function search(): any {
}, },
padding: { padding: {
bottom: 0,
left: 10, left: 10,
right: 10, right: 10,
top: 0,
}, },
}, },
state: { state: {
@ -294,10 +300,8 @@ export default function search(): any {
}, },
padding: { padding: {
bottom: 0,
left: 10, left: 10,
right: 10, right: 10,
top: 0,
}, },
}, },
state: { state: {