fix(app): match padding to designs

Also makes the maximize button change to restore when the window is maximized.

iced

@@ -1 +1 @@
-Subproject commit 0053fd177af075a986aff948386f1169050045b8
+Subproject commit 696aa92626e22f09268d4254a8be5e60a46fcea0

res/icons/window-restore-symbolic.svg

@@ -0,0 +1,4 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8 8H4L5.5 9.5L4.21053 10.8421C4.21053 10.8421 3.73684 11.3158 4.21053 11.7895C4.68421 12.2632 5.1579 11.7895 5.1579 11.7895L6.5 10.5L8 12V8Z" fill="#232323"/>
+<path d="M8 8H12L10.5 6.5L11.7895 5.15789C11.7895 5.15789 12.2632 4.68421 11.7895 4.21053C11.3158 3.73684 10.8421 4.21053 10.8421 4.21053L9.5 5.5L8 4V8Z" fill="#232323"/>
+</svg>

src/app/mod.rs

@@ -541,23 +541,30 @@ impl<App: Application> ApplicationExt for App {
     fn view_main(&self) -> Element<crate::Action<Self::Message>> {
         let core = self.core();
         let is_condensed = core.is_condensed();
-        // TODO: More granularity might be needed for different resize border
+        // TODO: More granularity might be needed for different window border
-        // and window border handling of maximized and tiled windows
+        // handling of maximized and tiled windows
         let sharp_corners = core.window.sharp_corners;
         let content_container = core.window.content_container;
+        let show_context = core.window.show_context;
+        let context_is_overlay = core.window.context_is_overlay;
         let nav_bar_active = core.nav_bar_active();
         let focused = core
             .focused_window()
             .is_some_and(|i| Some(i) == self.core().main_window_id());
 
-        let main_content_padding = if content_container {
+        let border_padding = if sharp_corners { 8 } else { 7 };
-            if nav_bar_active {
+
-                [0, 8, 8, 0]
+        let main_content_padding = if !content_container {
-            } else {
-                [0, 8, 8, 8]
-            }
-        } else {
             [0, 0, 0, 0]
+        } else {
+            let right_padding = if show_context && !context_is_overlay {
+                0
+            } else {
+                border_padding
+            };
+            let left_padding = if nav_bar_active { 0 } else { border_padding };
+
+            [0, right_padding, 0, left_padding]
         };
 
         let content_row = crate::widget::row::with_children({
@@ -568,7 +575,16 @@ 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,
+                            if is_condensed { border_padding } else { 8 },
+                            border_padding,
+                            border_padding,
+                        ])
+                        .into(),
+                );
                 true
             } else {
                 false
@@ -579,7 +595,7 @@ impl<App: Application> ApplicationExt for App {
 
                 //TODO: reduce duplication
                 let context_width = core.context_width(has_nav);
-                if core.window.context_is_overlay && core.window.show_context {
+                if context_is_overlay && show_context {
                     if let Some(context) = self.context_drawer() {
                         widgets.push(
                             crate::widget::context_drawer(
@@ -600,7 +616,7 @@ impl<App: Application> ApplicationExt for App {
                             })
                             .apply(container)
                             .padding(if content_container {
-                                [0, 8, 8, 0]
+                                [0, border_padding, border_padding, border_padding]
                             } else {
                                 [0, 0, 0, 0]
                             })
@@ -648,7 +664,7 @@ impl<App: Application> ApplicationExt for App {
                             })
                             .apply(container)
                             .padding(if content_container {
-                                [0, 8, 8, 0]
+                                [0, border_padding, border_padding, border_padding]
                             } else {
                                 [0, 0, 0, 0]
                             })
@@ -665,11 +681,15 @@ impl<App: Application> ApplicationExt for App {
         });
         let content_col = crate::widget::column::with_capacity(2)
             .push(content_row)
-            .push_maybe(
+            .push_maybe(self.footer().map(|footer| {
-                self.footer()
+                container(footer.map(crate::Action::App)).padding([
-                    .map(|footer| container(footer.map(crate::Action::App)).padding([0, 8, 8, 8])),
+                    0,
-            );
+                    border_padding,
-        let content: Element<_> = if core.window.content_container {
+                    border_padding,
+                    border_padding,
+                ])
+            }));
+        let content: Element<_> = if content_container {
             content_col
                 .apply(container)
                 .width(iced::Length::Fill)
@@ -692,6 +712,7 @@ impl<App: Application> ApplicationExt for App {
                 Some({
                     let mut header = crate::widget::header_bar()
                         .focused(focused)
+                        .maximized(sharp_corners)
                         .title(&core.window.header_title)
                         .on_drag(crate::Action::Cosmic(Action::Drag))
                         .on_right_click(crate::Action::Cosmic(Action::ShowWindowMenu))

src/widget/header_bar.rs

@@ -23,6 +23,7 @@ pub fn header_bar<'a, Message>() -> HeaderBar<'a, Message> {
         end: Vec::new(),
         density: None,
         focused: false,
+        maximized: false,
         on_double_click: None,
     }
 }
@@ -76,6 +77,9 @@ pub struct HeaderBar<'a, Message> {
 
     /// Focused state of the window
     focused: bool,
+
+    /// Maximized state of the window
+    maximized: bool,
 }
 
 impl<'a, Message: Clone + 'static> HeaderBar<'a, Message> {
@@ -302,10 +306,22 @@ impl<'a, Message: Clone + 'static> HeaderBar<'a, Message> {
         // Also packs the window controls at the very end.
         end.push(self.window_controls());
 
-        let height = match self.density.unwrap_or_else(crate::config::header_size) {
+        // Center content depending on window border
-            Density::Compact => 40.0,
+        let padding = match self.density.unwrap_or_else(crate::config::header_size) {
-            Density::Spacious => 48.0,
+            Density::Compact => {
-            Density::Standard => 48.0,
+                if self.maximized {
+                    [4, 8, 4, 8]
+                } else {
+                    [3, 7, 4, 7]
+                }
+            }
+            _ => {
+                if self.maximized {
+                    [8, 8, 8, 8]
+                } else {
+                    [7, 7, 8, 7]
+                }
+            }
         };
         let portion = ((start.len().max(end.len()) as f32 / center.len().max(1) as f32).round()
             as u16)
@@ -349,8 +365,8 @@ impl<'a, Message: Clone + 'static> HeaderBar<'a, Message> {
                     }),
             )
             .align_y(iced::Alignment::Center)
-            .height(Length::Fixed(height))
+            .height(Length::Fixed(32.0 + padding[0] as f32 + padding[2] as f32))
-            .padding([0, 8])
+            .padding(padding)
             .spacing(8)
             .apply(widget::container)
             .class(crate::theme::Container::HeaderBar {
@@ -424,11 +440,17 @@ impl<'a, Message: Clone + 'static> HeaderBar<'a, Message> {
                     .take()
                     .map(|m: Message| icon!("window-minimize-symbolic", 16, m)),
             )
-            .push_maybe(
+            .push_maybe(self.on_maximize.take().map(|m| {
-                self.on_maximize
+                icon!(
-                    .take()
+                    if self.maximized {
-                    .map(|m| icon!("window-maximize-symbolic", 16, m)),
+                        "window-restore-symbolic"
-            )
+                    } else {
+                        "window-maximize-symbolic"
+                    },
+                    16,
+                    m
+                )
+            }))
             .push_maybe(
                 self.on_close
                     .take()

src/widget/scrollable.rs

@@ -8,4 +8,7 @@ pub fn scrollable<'a, Message>(
     element: impl Into<Element<'a, Message>>,
 ) -> widget::Scrollable<'a, Message, crate::Theme, Renderer> {
     widget::scrollable(element)
+        .scroller_width(8.0)
+        .scrollbar_width(8.0)
+        .scrollbar_padding(8.0)
 }