leyoda/cosmic-files
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Vertically center context menu items (#444)

Browse source 
* fix: context menu layout

Makes the context menu text vertically centered.
Also removes the hacky list view item padding and makes the line under the breadcrumb accent-colored.

* fix: use spacing variables for menus

* fix
This commit is contained in:
Vukašin Vojinović 2024-09-11 19:02:47 +02:00 • committed by GitHub
parent 44ff7eb1ad
commit bbcfe19375
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 57 additions and 48 deletions
Download patch file Download diff file Expand all files Collapse all files

64
src/menu.rs
View file

@ -1,12 +1,13 @@
// SPDX-License-Identifier: GPL-3.0-only
use cosmic::{
//TODO: export iced::widget::horizontal_rule in cosmic::widget
iced::{widget::horizontal_rule, Alignment, Background, Border, Length},
iced::{Alignment, Background, Border, Length},
theme,
widget,
widget::container,
widget::menu::{self, key_bind::KeyBind, ItemHeight, ItemWidth, MenuBar},
widget::{
button, column, container, divider, horizontal_space,
menu::{self, key_bind::KeyBind, ItemHeight, ItemWidth, MenuBar},
text, Row,
},
Element,
};
use mime_guess::Mime;
@ -21,14 +22,14 @@ use crate::{
macro_rules! menu_button {
($($x:expr),+ $(,)?) => (
widget::button(
widget::Row::with_children(
button(
Row::with_children(
vec![$(Element::from($x)),+]
)
.height(Length::Fixed(24.0))
.align_items(Alignment::Center)
)
.height(Length::Fixed(32.0))
.padding([4, 16])
.padding([theme::active().cosmic().spacing.space_xxxs, 16])
.width(Length::Fill)
.style(theme::Button::MenuItem)
);
@ -50,9 +51,9 @@ pub fn context_menu<'a>(
let menu_item = |label, action| {
let key = find_key(&action);
menu_button!(
widget::text(label),
widget::horizontal_space(Length::Fill),
widget::text(key)
text::body(label),
horizontal_space(Length::Fill),
text::body(key)
)
.on_press(tab::Message::ContextAction(action))
};
@ -120,12 +121,12 @@ pub fn context_menu<'a>(
children
.push(menu_item(fl!("open-in-new-window"), Action::OpenInNewWindow).into());
}
children.push(container(horizontal_rule(1)).padding([0, 8]).into());
children.push(divider::horizontal::light().into());
children.push(menu_item(fl!("rename"), Action::Rename).into());
children.push(menu_item(fl!("cut"), Action::Cut).into());
children.push(menu_item(fl!("copy"), Action::Copy).into());
children.push(container(horizontal_rule(1)).padding([0, 8]).into());
children.push(divider::horizontal::light().into());
let supported_archive_types = [
"application/x-compressed-tar",
"application/x-tar",
@ -139,14 +140,13 @@ pub fn context_menu<'a>(
children.push(menu_item(fl!("extract-here"), Action::ExtractHere).into());
}
children.push(menu_item(fl!("compress"), Action::Compress).into());
children.push(container(horizontal_rule(1)).padding([0, 8]).into());
children.push(divider::horizontal::light().into());
//TODO: Print?
children.push(container(horizontal_rule(1)).padding([0, 8]).into());
children.push(menu_item(fl!("show-details"), Action::Properties).into());
children.push(container(horizontal_rule(1)).padding([0, 8]).into());
children.push(divider::horizontal::light().into());
children.push(menu_item(fl!("add-to-sidebar"), Action::AddToSidebar).into());
children.push(container(horizontal_rule(1)).padding([0, 8]).into());
children.push(divider::horizontal::light().into());
children.push(menu_item(fl!("move-to-trash"), Action::MoveToTrash).into());
} else {
//TODO: need better designs for menu with no selection
@ -154,10 +154,10 @@ pub fn context_menu<'a>(
children.push(menu_item(fl!("new-folder"), Action::NewFolder).into());
children.push(menu_item(fl!("new-file"), Action::NewFile).into());
children.push(menu_item(fl!("open-in-terminal"), Action::OpenTerminal).into());
children.push(container(horizontal_rule(1)).padding([0, 8]).into());
children.push(divider::horizontal::light().into());
children.push(menu_item(fl!("select-all"), Action::SelectAll).into());
children.push(menu_item(fl!("paste"), Action::Paste).into());
children.push(container(horizontal_rule(1)).padding([0, 8]).into());
children.push(divider::horizontal::light().into());
// TODO: Nested menu
children.push(sort_item(fl!("sort-by-name"), HeadingOptions::Name));
children.push(sort_item(fl!("sort-by-modified"), HeadingOptions::Modified));
@ -167,13 +167,13 @@ pub fn context_menu<'a>(
Location::Trash => {
children.push(menu_item(fl!("select-all"), Action::SelectAll).into());
if selected > 0 {
children.push(container(horizontal_rule(1)).padding([0, 8]).into());
children.push(divider::horizontal::light().into());
children.push(menu_item(fl!("show-details"), Action::Properties).into());
children.push(container(horizontal_rule(1)).padding([0, 8]).into());
children.push(divider::horizontal::light().into());
children
.push(menu_item(fl!("restore-from-trash"), Action::RestoreFromTrash).into());
}
children.push(container(horizontal_rule(1)).padding([0, 8]).into());
children.push(divider::horizontal::light().into());
// TODO: Nested menu
children.push(sort_item(fl!("sort-by-name"), HeadingOptions::Name));
children.push(sort_item(fl!("sort-by-modified"), HeadingOptions::Modified));
@ -181,13 +181,13 @@ pub fn context_menu<'a>(
}
}
widget::container(widget::column::with_children(children))
container(column::with_children(children))
.padding(1)
//TODO: move style to libcosmic
.style(theme::Container::custom(|theme| {
let cosmic = theme.cosmic();
let component = &cosmic.background.component;
widget::container::Appearance {
container::Appearance {
icon_color: Some(component.on.into()),
text_color: Some(component.on.into()),
background: Some(Background::Color(component.base.into())),
@ -287,36 +287,36 @@ pub fn menu_bar<'a>(
])
.item_height(ItemHeight::Dynamic(40))
.item_width(ItemWidth::Uniform(240))
.spacing(4.0)
.spacing(theme::active().cosmic().spacing.space_xxxs.into())
.into()
}
pub fn location_context_menu<'a>(ancestor_index: usize) -> Element<'a, tab::Message> {
let children = vec![
menu_button!(widget::text(fl!("open-in-new-tab")))
menu_button!(text::body(fl!("open-in-new-tab")))
.on_press(tab::Message::LocationMenuAction(
LocationMenuAction::OpenInNewTab(ancestor_index),
))
.into(),
menu_button!(widget::text(fl!("open-in-new-window")))
menu_button!(text::body(fl!("open-in-new-window")))
.on_press(tab::Message::LocationMenuAction(
LocationMenuAction::OpenInNewWindow(ancestor_index),
))
.into(),
container(horizontal_rule(1)).padding([0, 8]).into(),
menu_button!(widget::text(fl!("show-details")))
divider::horizontal::light().into(),
menu_button!(text::body(fl!("show-details")))
.on_press(tab::Message::LocationMenuAction(
LocationMenuAction::Properties(ancestor_index),
))
.into(),
];
widget::container(widget::column::with_children(children))
container(column::with_children(children))
.padding(1)
.style(theme::Container::custom(|theme| {
let cosmic = theme.cosmic();
let component = &cosmic.background.component;
widget::container::Appearance {
container::Appearance {
icon_color: Some(component.on.into()),
text_color: Some(component.on.into()),
background: Some(Background::Color(component.base.into())),

41
src/tab.rs
View file

@ -25,12 +25,14 @@ use cosmic::{
Size,
},
iced_core::widget::tree,
theme, widget,
iced_style::rule,
theme,
widget::{
self,
menu::{action::MenuAction, key_bind::KeyBind},
vertical_space, DndDestination, DndSource, Id, Widget,
},
Element,
Element, Theme,
};
use chrono::{DateTime, Utc};
@ -2295,10 +2297,17 @@ impl Tab {
);
let mut column = widget::column::with_capacity(4).padding([0, space_s]);
column = column.push(row);
column = column.push(horizontal_rule(1));
column = column.push(horizontal_rule(1).style(theme::Rule::Custom(Box::new(
|theme: &Theme| rule::Appearance {
color: theme.cosmic().accent_color().into(),
width: 1,
radius: 0.0.into(),
fill_mode: rule::FillMode::Full,
},
))));
if self.config.view == View::List && !condensed {
column = column.push(heading_row);
column = column.push(horizontal_rule(1));
column = column.push(widget::divider::horizontal::default());
}
return column.into();
}
@ -2452,11 +2461,18 @@ impl Tab {
}
let mut column = widget::column::with_capacity(4).padding([0, space_s]);
column = column.push(row);
column = column.push(horizontal_rule(1));
column = column.push(horizontal_rule(1).style(theme::Rule::Custom(Box::new(
|theme: &Theme| rule::Appearance {
color: theme.cosmic().accent_color().into(),
width: 1,
radius: 0.0.into(),
fill_mode: rule::FillMode::Full,
},
))));
if self.config.view == View::List && !condensed {
column = column.push(heading_row);
column = column.push(horizontal_rule(1));
column = column.push(widget::divider::horizontal::default());
}
let mouse_area = crate::mouse_area::MouseArea::new(column)
@ -2905,6 +2921,7 @@ impl Tab {
])
.into(),
])
.height(Length::Fixed(row_height as f32))
.align_items(Alignment::Center)
.spacing(space_xxs)
} else {
@ -2921,6 +2938,7 @@ impl Tab {
.width(Length::Fixed(size_width))
.into(),
])
.height(Length::Fixed(row_height as f32))
.align_items(Alignment::Center)
.spacing(space_xxs)
};
@ -2929,17 +2947,8 @@ impl Tab {
let mouse_area = crate::mouse_area::MouseArea::new(
widget::button(row)
.width(Length::Fill)
.height(Length::Fixed(row_height as f32))
.id(item.button_id.clone())
.padding(if condensed && icon_size < 32 {
space_xxxs
} else {
if icon_size < 24 {
space_xxs - 1
} else {
space_xxs
}
})
.padding([0, space_xxs])
.style(button_style(item.selected, true, false)),
)
.on_press(move |_| Message::Click(Some(i)))