Skip to content

Commit

Permalink
fix(style): use radius_s for nav bar toggle
Browse files Browse the repository at this point in the history
  • Loading branch information
git-f0x committed Dec 5, 2024
1 parent 43e7213 commit 4798e3a
Show file tree
Hide file tree
Showing 5 changed files with 67 additions and 46 deletions.
71 changes: 45 additions & 26 deletions src/app/mod.rs
Original file line number Diff line number Diff line change
Expand Up @@ -703,11 +703,14 @@ impl<App: Application> ApplicationExt for App {
.focused_window()
.is_some_and(|i| Some(i) == self.core().main_window_id());

// Offset for the window border
let window_padding = if sharp_corners { 8 } else { 7 };

let main_content_padding = if content_container {
if nav_bar_active {
[0, 8, 8, 0]
[0, window_padding, window_padding, 0]
} else {
[0, 8, 8, 8]
[0, window_padding, window_padding, window_padding]
}
} else {
[0, 0, 0, 0]
Expand All @@ -721,7 +724,11 @@ impl<App: Application> ApplicationExt for App {
.nav_bar()
.map(|nav| id_container(nav, iced_core::id::Id::new("COSMIC_nav_bar")))
{
widgets.push(container(nav).padding([0, 8, 8, 8]).into());
widgets.push(
container(nav)
.padding([0, window_padding, window_padding, window_padding])
.into(),
);
true
} else {
false
Expand Down Expand Up @@ -753,7 +760,7 @@ impl<App: Application> ApplicationExt for App {
})
.apply(container)
.padding(if content_container {
[0, 8, 8, 0]
[0, window_padding, window_padding, 0]
} else {
[0, 0, 0, 0]
})
Expand Down Expand Up @@ -801,7 +808,7 @@ impl<App: Application> ApplicationExt for App {
})
.apply(container)
.padding(if content_container {
[0, 8, 8, 0]
[0, window_padding, window_padding, 0]
} else {
[0, 0, 0, 0]
})
Expand All @@ -818,10 +825,14 @@ impl<App: Application> ApplicationExt for App {
});
let content_col = crate::widget::column::with_capacity(2)
.push(content_row)
.push_maybe(
self.footer()
.map(|footer| container(footer.map(Message::App)).padding([0, 8, 8, 8])),
);
.push_maybe(self.footer().map(|footer| {
container(footer.map(Message::App)).padding([
0,
window_padding,
window_padding,
window_padding,
])
}));
let content: Element<_> = if core.window.content_container {
content_col
.apply(container)
Expand All @@ -834,12 +845,19 @@ impl<App: Application> ApplicationExt for App {
content_col.into()
};

// Ensures visually aligned radii for content and window edges
let window_corner_radius = crate::theme::active().cosmic().radius_s();
// TODO: Uncomment when there's a protocol for reporting corner radius
// to the compositor, to properly display the active hint
// .map(|radius| if radius < 4.0 { radius } else { radius + 4.0 });

let view_column = crate::widget::column::with_capacity(2)
.push_maybe(if core.window.show_headerbar {
Some({
let mut header = crate::widget::header_bar()
.focused(focused)
.title(&core.window.header_title)
.horizontal_padding(window_padding)
.on_drag(Message::Cosmic(cosmic::Message::Drag))
.on_right_click(Message::Cosmic(cosmic::Message::ShowWindowMenu))
.on_double_click(Message::Cosmic(cosmic::Message::Maximize));
Expand All @@ -852,8 +870,7 @@ impl<App: Application> ApplicationExt for App {
Message::Cosmic(cosmic::Message::ToggleNavBarCondensed)
} else {
Message::Cosmic(cosmic::Message::ToggleNavBar)
})
.class(crate::theme::Button::HeaderBar);
});

header = header.start(toggle);
}
Expand Down Expand Up @@ -888,21 +905,23 @@ impl<App: Application> ApplicationExt for App {
// Needed to avoid header bar corner gaps for apps without a content container
header
.apply(container)
.class(crate::theme::Container::custom(|theme| container::Style {
background: Some(iced::Background::Color(
theme.cosmic().background.base.into(),
)),
border: iced::Border {
radius: [
theme.cosmic().radius_s()[0] - 1.0,
theme.cosmic().radius_s()[1] - 1.0,
theme.cosmic().radius_0()[2],
theme.cosmic().radius_0()[3],
]
.into(),
.class(crate::theme::Container::custom(move |theme| {
container::Style {
background: Some(iced::Background::Color(
theme.cosmic().background.base.into(),
)),
border: iced::Border {
radius: [
window_corner_radius[0] - 1.0,
window_corner_radius[1] - 1.0,
theme.cosmic().radius_0()[2],
theme.cosmic().radius_0()[3],
]
.into(),
..Default::default()
},
..Default::default()
},
..Default::default()
}
}))
.apply(|w| id_container(w, iced_core::id::Id::new("COSMIC_header")))
}
Expand All @@ -926,7 +945,7 @@ impl<App: Application> ApplicationExt for App {
border: iced::Border {
color: theme.cosmic().bg_divider().into(),
width: if sharp_corners { 0.0 } else { 1.0 },
radius: theme.cosmic().radius_s().into(),
radius: window_corner_radius.into(),
},
..Default::default()
}
Expand Down
8 changes: 6 additions & 2 deletions src/theme/style/button.rs
Original file line number Diff line number Diff line change
Expand Up @@ -14,13 +14,13 @@ use crate::{
#[derive(Default)]
pub enum Button {
AppletIcon,
AppletMenu,
Custom {
active: Box<dyn Fn(bool, &crate::Theme) -> Style>,
disabled: Box<dyn Fn(&crate::Theme) -> Style>,
hovered: Box<dyn Fn(bool, &crate::Theme) -> Style>,
pressed: Box<dyn Fn(bool, &crate::Theme) -> Style>,
},
AppletMenu,
Destructive,
HeaderBar,
Icon,
Expand All @@ -30,6 +30,7 @@ pub enum Button {
MenuFolder,
MenuItem,
MenuRoot,
NavToggle,
#[default]
Standard,
Suggested,
Expand Down Expand Up @@ -72,7 +73,7 @@ pub fn appearance(
}
}

Button::Icon | Button::IconVertical | Button::HeaderBar => {
Button::Icon | Button::IconVertical | Button::HeaderBar | Button::NavToggle => {
if matches!(style, Button::IconVertical) {
corner_radii = &cosmic.corner_radii.radius_m;
if selected {
Expand All @@ -81,6 +82,9 @@ pub fn appearance(
)));
}
}
if matches!(style, Button::NavToggle) {
corner_radii = &cosmic.corner_radii.radius_s;
}

let (background, text, icon) = color(&cosmic.icon_button);
appearance.background = Some(Background::Color(background));
Expand Down
25 changes: 10 additions & 15 deletions src/theme/style/iced.rs
Original file line number Diff line number Diff line change
Expand Up @@ -460,6 +460,11 @@ impl iced_container::Catalog for Theme {

fn style(&self, class: &Self::Class<'_>) -> iced_container::Style {
let cosmic = self.cosmic();
// Ensures visually aligned radii for content and window edges
let window_corner_radius = cosmic.radius_s();
// TODO: Uncomment when there's a protocol for reporting corner radius
// to the compositor, to properly display the active hint
// .map(|radius| if radius < 4.0 { radius } else { radius + 4.0 });

match class {
Container::Transparent => iced_container::Style::default(),
Expand All @@ -474,8 +479,8 @@ impl iced_container::Catalog for Theme {
radius: [
cosmic.corner_radii.radius_0[0],
cosmic.corner_radii.radius_0[1],
cosmic.corner_radii.radius_s[2],
cosmic.corner_radii.radius_s[3],
window_corner_radius[2],
window_corner_radius[3],
]
.into(),
..Default::default()
Expand Down Expand Up @@ -516,8 +521,8 @@ impl iced_container::Catalog for Theme {
background: Some(iced::Background::Color(cosmic.background.base.into())),
border: Border {
radius: [
cosmic.corner_radii.radius_s[0],
cosmic.corner_radii.radius_s[1],
window_corner_radius[0],
window_corner_radius[1],
cosmic.corner_radii.radius_0[2],
cosmic.corner_radii.radius_0[3],
]
Expand All @@ -528,17 +533,7 @@ impl iced_container::Catalog for Theme {
}
}

Container::ContextDrawer => {
let mut appearance = Container::primary(cosmic);

appearance.shadow = Shadow {
color: cosmic.shade.into(),
offset: Vector::new(0.0, 0.0),
blur_radius: 16.0,
};

appearance
}
Container::ContextDrawer => Container::primary(cosmic),

Container::Background => Container::background(cosmic),

Expand Down
7 changes: 5 additions & 2 deletions src/widget/header_bar.rs
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ pub fn header_bar<'a, Message>() -> HeaderBar<'a, Message> {
center: Vec::new(),
end: Vec::new(),
density: None,
horizontal_padding: 8,
focused: false,
on_double_click: None,
}
Expand Down Expand Up @@ -74,6 +75,9 @@ pub struct HeaderBar<'a, Message> {
#[setters(strip_option)]
density: Option<Density>,

/// Horizontal padding of the headerbar
horizontal_padding: u16,

/// Focused state of the window
focused: bool,
}
Expand Down Expand Up @@ -299,7 +303,6 @@ impl<'a, Message: Clone + 'static> HeaderBar<'a, Message> {
let mut end = std::mem::take(&mut self.end);

// Also packs the window controls at the very end.
end.push(widget::horizontal_space().width(Length::Fixed(12.0)).into());
end.push(self.window_controls());

let height = match self.density.unwrap_or_else(crate::config::header_size) {
Expand Down Expand Up @@ -343,7 +346,7 @@ impl<'a, Message: Clone + 'static> HeaderBar<'a, Message> {
)
.align_y(iced::Alignment::Center)
.height(Length::Fixed(height))
.padding([0, 8])
.padding([0, self.horizontal_padding])
.spacing(8)
.apply(widget::container)
.class(crate::theme::Container::HeaderBar {
Expand Down
2 changes: 1 addition & 1 deletion src/widget/nav_bar_toggle.rs
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ pub fn nav_bar_toggle<Message>() -> NavBarToggle<Message> {
NavBarToggle {
active: false,
on_toggle: None,
class: crate::theme::Button::Text,
class: crate::theme::Button::NavToggle,
selected: false,
}
}
Expand Down

0 comments on commit 4798e3a

Please sign in to comment.