fix(list_column): match padding/spacing to designs

This commit is contained in:
Vukašin Vojinović 2024-11-28 15:24:15 +01:00 committed by Michael Murphy
parent a6c08d68f9
commit de0c1921f7
11 changed files with 65 additions and 75 deletions

View file

@ -109,7 +109,7 @@ impl<'a, Message: Clone + 'static> From<Dialog<'a, Message>> for Element<'a, Mes
if let Some(button) = dialog.tertiary_action {
button_row = button_row.push(button);
}
button_row = button_row.push(widget::horizontal_space().width(Length::Fill));
button_row = button_row.push(widget::horizontal_space());
if let Some(button) = dialog.secondary_action {
button_row = button_row.push(button);
}

View file

@ -10,7 +10,7 @@ use iced_core::{
Widget,
};
/// Responsively generates rows and columns of widgets based on its dimmensions.
/// Responsively generates rows and columns of widgets based on its dimensions.
#[derive(Setters)]
#[must_use]
pub struct FlexRow<'a, Message> {

View file

@ -329,7 +329,7 @@ impl<'a, Message: Clone + 'static> HeaderBar<'a, Message> {
.center_x(Length::Fill)
.into()
} else if self.title.is_empty() {
widget::horizontal_space().width(Length::Fill).into()
widget::horizontal_space().into()
} else {
self.title_widget()
})

View file

@ -4,7 +4,11 @@
use iced_core::Padding;
use iced_widget::container::Catalog;
use crate::{theme, widget::divider, Apply, Element};
use crate::{
theme,
widget::{container, divider, vertical_space},
Apply, Element,
};
pub fn list_column<'a, Message: 'static>() -> ListColumn<'a, Message> {
ListColumn::default()
@ -14,16 +18,16 @@ pub fn list_column<'a, Message: 'static>() -> ListColumn<'a, Message> {
pub struct ListColumn<'a, Message> {
spacing: u16,
padding: Padding,
style: crate::theme::Container<'a>,
style: theme::Container<'a>,
children: Vec<Element<'a, Message>>,
}
impl<'a, Message: 'static> Default for ListColumn<'a, Message> {
fn default() -> Self {
Self {
spacing: theme::THEME.lock().unwrap().cosmic().spacing.space_xxs,
spacing: 0,
padding: Padding::from(0),
style: crate::theme::Container::List,
style: theme::Container::List,
children: Vec::with_capacity(4),
}
}
@ -36,15 +40,24 @@ impl<'a, Message: 'static> ListColumn<'a, Message> {
#[allow(clippy::should_implement_trait)]
pub fn add(mut self, item: impl Into<Element<'a, Message>>) -> Self {
let cosmic_theme::Spacing {
space_xxs, space_m, ..
} = theme::active().cosmic().spacing;
if !self.children.is_empty() {
self.children.push(divider::horizontal::light().into());
self.children.push(
container(divider::horizontal::default())
.padding([0, 16])
.into(),
);
}
// Ensure a minimum height of 32.
let list_item = iced::widget::row![
crate::widget::container(item).align_y(iced::Alignment::Center),
crate::widget::vertical_space().height(iced::Length::Fixed(32.))
container(item).align_y(iced::Alignment::Center),
vertical_space().height(iced::Length::Fixed(32.))
]
.padding([space_xxs, space_m])
.align_y(iced::Alignment::Center);
self.children.push(list_item.into());
@ -72,9 +85,10 @@ impl<'a, Message: 'static> ListColumn<'a, Message> {
crate::widget::column::with_children(self.children)
.spacing(self.spacing)
.padding(self.padding)
.apply(super::container)
.padding([self.spacing, 8])
.apply(container)
.padding([self.spacing, 0])
.class(self.style)
.width(iced::Length::Fill)
.into()
}
}

View file

@ -4,15 +4,3 @@
pub mod column;
pub use self::column::{list_column, ListColumn};
use crate::widget::Container;
use crate::Element;
pub fn container<'a, Message>(
content: impl Into<Element<'a, Message>>,
) -> Container<'a, Message, crate::Theme, crate::Renderer> {
super::container(content)
.padding([16, 6])
.class(crate::theme::Container::List)
.width(iced::Length::Fill)
}

View file

@ -248,7 +248,7 @@ where
let key = find_key(&action, key_binds);
let mut items = vec![
widget::text(label).into(),
widget::horizontal_space().width(Length::Fill).into(),
widget::horizontal_space().into(),
widget::text(key).into(),
];
@ -266,7 +266,7 @@ where
let mut items = vec![
widget::text(label).into(),
widget::horizontal_space().width(Length::Fill).into(),
widget::horizontal_space().into(),
widget::text(key).into(),
];
@ -298,7 +298,7 @@ where
},
widget::Space::with_width(spacing.space_xxs).into(),
widget::text(label).align_x(iced::Alignment::Start).into(),
widget::horizontal_space().width(Length::Fill).into(),
widget::horizontal_space().into(),
widget::text(key).into(),
];
@ -313,7 +313,7 @@ where
trees.push(MenuTree::<Message, Renderer>::with_children(
menu_button(vec![
widget::text(label).into(),
widget::horizontal_space().width(Length::Fill).into(),
widget::horizontal_space().into(),
widget::icon::from_name("pan-end-symbolic")
.size(16)
.icon()

View file

@ -21,7 +21,7 @@ pub fn item<'a, Message: 'static>(
) -> Row<'a, Message> {
item_row(vec![
text(title).wrapping(Wrapping::Word).into(),
horizontal_space().width(iced::Length::Fill).into(),
horizontal_space().into(),
widget.into(),
])
}
@ -30,13 +30,9 @@ pub fn item<'a, Message: 'static>(
#[must_use]
#[allow(clippy::module_name_repetitions)]
pub fn item_row<Message>(children: Vec<Element<Message>>) -> Row<Message> {
let cosmic_theme::Spacing {
space_s, space_xs, ..
} = theme::THEME.lock().unwrap().cosmic().spacing;
row::with_children(children)
.spacing(space_xs)
.spacing(theme::active().cosmic().space_xs())
.align_y(iced::Alignment::Center)
.padding([0, space_s])
}
/// A settings item aligned in a flex row
@ -57,12 +53,8 @@ pub fn flex_item<'a, Message: 'static>(
/// A settings item aligned in a flex row
#[allow(clippy::module_name_repetitions)]
pub fn flex_item_row<Message>(children: Vec<Element<Message>>) -> FlexRow<Message> {
let cosmic_theme::Spacing {
space_s, space_xs, ..
} = theme::THEME.lock().unwrap().cosmic().spacing;
flex_row(children)
.padding([0, space_s])
.spacing(space_xs)
.spacing(theme::active().cosmic().space_xs())
.min_item_width(200.0)
.justify_items(iced::Alignment::Center)
.justify_content(AlignContent::SpaceBetween)

View file

@ -13,8 +13,5 @@ use crate::{theme, Element};
/// A column with a predefined style for creating a settings panel
#[must_use]
pub fn view_column<Message: 'static>(children: Vec<Element<Message>>) -> Column<Message> {
let space_m = theme::THEME.lock().unwrap().cosmic().spacing.space_m;
column::with_children(children)
.spacing(space_m)
.padding([0, space_m])
column::with_children(children).spacing(theme::active().cosmic().space_m())
}

View file

@ -1,7 +1,6 @@
// Copyright 2022 System76 <info@system76.com>
// SPDX-License-Identifier: MPL-2.0
use crate::ext::CollectionWidget;
use crate::widget::{column, text, ListColumn};
use crate::Element;
use std::borrow::Cow;