Fix applet window styling (#652)

* fix(applet windows): fix styling

* update libcosmic

Updates context drawers to use the new API.

Cargo.lock

@@ -1222,7 +1222,7 @@ dependencies = [
 [[package]]
 name = "cosmic-config"
 version = "0.1.0"
-source = "git+https://github.com/pop-os/libcosmic.git#aaadf7199ebed8a5a04ebed559f62455d622689e"
+source = "git+https://github.com/pop-os/libcosmic.git#a355a049d917823dafcd6669cad6afa6983bc6c6"
 dependencies = [
  "atomicwrites",
  "cosmic-config-derive",
@@ -1241,7 +1241,7 @@ dependencies = [
 [[package]]
 name = "cosmic-config-derive"
 version = "0.1.0"
-source = "git+https://github.com/pop-os/libcosmic.git#aaadf7199ebed8a5a04ebed559f62455d622689e"
+source = "git+https://github.com/pop-os/libcosmic.git#a355a049d917823dafcd6669cad6afa6983bc6c6"
 dependencies = [
  "quote",
  "syn 1.0.109",
@@ -1348,7 +1348,7 @@ dependencies = [
 [[package]]
 name = "cosmic-theme"
 version = "0.1.0"
-source = "git+https://github.com/pop-os/libcosmic.git#aaadf7199ebed8a5a04ebed559f62455d622689e"
+source = "git+https://github.com/pop-os/libcosmic.git#a355a049d917823dafcd6669cad6afa6983bc6c6"
 dependencies = [
  "almost",
  "cosmic-config",
@@ -2776,7 +2776,7 @@ dependencies = [
 [[package]]
 name = "iced"
 version = "0.14.0-dev"
-source = "git+https://github.com/pop-os/libcosmic.git#aaadf7199ebed8a5a04ebed559f62455d622689e"
+source = "git+https://github.com/pop-os/libcosmic.git#a355a049d917823dafcd6669cad6afa6983bc6c6"
 dependencies = [
  "dnd",
  "iced_accessibility",
@@ -2794,7 +2794,7 @@ dependencies = [
 [[package]]
 name = "iced_accessibility"
 version = "0.1.0"
-source = "git+https://github.com/pop-os/libcosmic.git#aaadf7199ebed8a5a04ebed559f62455d622689e"
+source = "git+https://github.com/pop-os/libcosmic.git#a355a049d917823dafcd6669cad6afa6983bc6c6"
 dependencies = [
  "accesskit",
  "accesskit_winit",
@@ -2803,7 +2803,7 @@ dependencies = [
 [[package]]
 name = "iced_core"
 version = "0.14.0-dev"
-source = "git+https://github.com/pop-os/libcosmic.git#aaadf7199ebed8a5a04ebed559f62455d622689e"
+source = "git+https://github.com/pop-os/libcosmic.git#a355a049d917823dafcd6669cad6afa6983bc6c6"
 dependencies = [
  "bitflags 2.6.0",
  "bytes",
@@ -2827,7 +2827,7 @@ dependencies = [
 [[package]]
 name = "iced_futures"
 version = "0.14.0-dev"
-source = "git+https://github.com/pop-os/libcosmic.git#aaadf7199ebed8a5a04ebed559f62455d622689e"
+source = "git+https://github.com/pop-os/libcosmic.git#a355a049d917823dafcd6669cad6afa6983bc6c6"
 dependencies = [
  "futures",
  "iced_core",
@@ -2853,7 +2853,7 @@ dependencies = [
 [[package]]
 name = "iced_graphics"
 version = "0.14.0-dev"
-source = "git+https://github.com/pop-os/libcosmic.git#aaadf7199ebed8a5a04ebed559f62455d622689e"
+source = "git+https://github.com/pop-os/libcosmic.git#a355a049d917823dafcd6669cad6afa6983bc6c6"
 dependencies = [
  "bitflags 2.6.0",
  "bytemuck",
@@ -2875,7 +2875,7 @@ dependencies = [
 [[package]]
 name = "iced_renderer"
 version = "0.14.0-dev"
-source = "git+https://github.com/pop-os/libcosmic.git#aaadf7199ebed8a5a04ebed559f62455d622689e"
+source = "git+https://github.com/pop-os/libcosmic.git#a355a049d917823dafcd6669cad6afa6983bc6c6"
 dependencies = [
  "iced_graphics",
  "iced_tiny_skia",
@@ -2887,7 +2887,7 @@ dependencies = [
 [[package]]
 name = "iced_runtime"
 version = "0.14.0-dev"
-source = "git+https://github.com/pop-os/libcosmic.git#aaadf7199ebed8a5a04ebed559f62455d622689e"
+source = "git+https://github.com/pop-os/libcosmic.git#a355a049d917823dafcd6669cad6afa6983bc6c6"
 dependencies = [
  "bytes",
  "dnd",
@@ -2902,7 +2902,7 @@ dependencies = [
 [[package]]
 name = "iced_tiny_skia"
 version = "0.14.0-dev"
-source = "git+https://github.com/pop-os/libcosmic.git#aaadf7199ebed8a5a04ebed559f62455d622689e"
+source = "git+https://github.com/pop-os/libcosmic.git#a355a049d917823dafcd6669cad6afa6983bc6c6"
 dependencies = [
  "bytemuck",
  "cosmic-text",
@@ -2918,7 +2918,7 @@ dependencies = [
 [[package]]
 name = "iced_wgpu"
 version = "0.14.0-dev"
-source = "git+https://github.com/pop-os/libcosmic.git#aaadf7199ebed8a5a04ebed559f62455d622689e"
+source = "git+https://github.com/pop-os/libcosmic.git#a355a049d917823dafcd6669cad6afa6983bc6c6"
 dependencies = [
  "as-raw-xcb-connection",
  "bitflags 2.6.0",
@@ -2949,7 +2949,7 @@ dependencies = [
 [[package]]
 name = "iced_widget"
 version = "0.14.0-dev"
-source = "git+https://github.com/pop-os/libcosmic.git#aaadf7199ebed8a5a04ebed559f62455d622689e"
+source = "git+https://github.com/pop-os/libcosmic.git#a355a049d917823dafcd6669cad6afa6983bc6c6"
 dependencies = [
  "dnd",
  "iced_renderer",
@@ -2967,7 +2967,7 @@ dependencies = [
 [[package]]
 name = "iced_winit"
 version = "0.14.0-dev"
-source = "git+https://github.com/pop-os/libcosmic.git#aaadf7199ebed8a5a04ebed559f62455d622689e"
+source = "git+https://github.com/pop-os/libcosmic.git#a355a049d917823dafcd6669cad6afa6983bc6c6"
 dependencies = [
  "dnd",
  "iced_futures",
@@ -3544,14 +3544,14 @@ dependencies = [
 
 [[package]]
 name = "libc"
-version = "0.2.162"
+version = "0.2.164"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "18d287de67fe55fd7e1581fe933d965a5a9477b38e949cfa9f8574ef01506398"
+checksum = "433bfe06b8c75da9b2e3fbea6e5329ff87748f0b144ef75306e674c3f6f7c13f"
 
 [[package]]
 name = "libcosmic"
 version = "0.1.0"
-source = "git+https://github.com/pop-os/libcosmic.git#aaadf7199ebed8a5a04ebed559f62455d622689e"
+source = "git+https://github.com/pop-os/libcosmic.git#a355a049d917823dafcd6669cad6afa6983bc6c6"
 dependencies = [
  "apply",
  "ashpd 0.9.2",

res/icons/hicolor/128x128/apps/com.system76.CosmicFiles.svg

@@ -1,12 +1,10 @@
 <svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g id="Size=128">
+<path d="M4 28C4 23.5817 7.58172 20 12 20H47.8985C49.5893 20 51.2365 20.5357 52.6039 21.5301L57.2922 24.9398C60.0269 26.9287 63.3215 28 66.7029 28H116C120.418 28 124 31.5817 124 36V100C124 104.418 120.418 108 116 108H12C7.58172 108 4 104.418 4 100V28Z" fill="#00717C"/>
-<path id="Rectangle 491" d="M4 28C4 23.5817 7.58172 20 12 20H47.8985C49.5893 20 51.2365 20.5357 52.6039 21.5301L61.5 28H116C120.418 28 124 31.5817 124 36V100C124 104.418 120.418 108 116 108H12C7.58172 108 4 104.418 4 100V28Z" fill="#008490"/>
+<path d="M4 44C4 39.5817 7.58172 36 12 36H116C120.418 36 124 39.5817 124 44V100C124 104.418 120.418 108 116 108H12C7.58172 108 4 104.418 4 100V44Z" fill="url(#paint0_linear_2004_703)"/>
-<rect id="Rectangle 418" x="4" y="36" width="120" height="72" rx="8" fill="url(#paint0_linear_2004_703)"/>
-</g>
 <defs>
 <linearGradient id="paint0_linear_2004_703" x1="124" y1="36" x2="20.4185" y2="126.742" gradientUnits="userSpaceOnUse">
 <stop stop-color="#49BAC8"/>
-<stop offset="1" stop-color="#229FAD"/>
+<stop offset="1" stop-color="#05919F"/>
 </linearGradient>
 </defs>
 </svg>

res/icons/hicolor/16x16/apps/com.system76.CosmicFiles.svg

@@ -1,12 +1,10 @@
 <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g id="Size=16">
+<path d="M1 4.5C1 3.67157 1.67157 3 2.5 3H5.37868C5.7765 3 6.15804 3.15804 6.43934 3.43934C6.79832 3.79832 7.28521 4 7.79289 4H13.5C14.3284 4 15 4.67157 15 5.5V11.5C15 12.3284 14.3284 13 13.5 13H2.5C1.67157 13 1 12.3284 1 11.5V4.5Z" fill="#00717C"/>
-<path id="Rectangle 491" d="M1 4.5C1 3.67157 1.67157 3 2.5 3H5.37868C5.7765 3 6.15804 3.15804 6.43934 3.43934L7 4H13.5C14.3284 4 15 4.67157 15 5.5V11.5C15 12.3284 14.3284 13 13.5 13H2.5C1.67157 13 1 12.3284 1 11.5V4.5Z" fill="#008490"/>
+<path d="M1 6.5C1 5.67157 1.67157 5 2.5 5H13.5C14.3284 5 15 5.67157 15 6.5V11.5C15 12.3284 14.3284 13 13.5 13H2.5C1.67157 13 1 12.3284 1 11.5V6.5Z" fill="url(#paint0_linear_2004_698)"/>
-<rect id="Rectangle 418" x="1" y="5" width="14" height="8" rx="1.5" fill="url(#paint0_linear_2004_698)"/>
-</g>
 <defs>
 <linearGradient id="paint0_linear_2004_698" x1="15" y1="5" x2="3.43042" y2="15.6422" gradientUnits="userSpaceOnUse">
 <stop stop-color="#49BAC8"/>
-<stop offset="1" stop-color="#229FAD"/>
+<stop offset="1" stop-color="#05919F"/>
 </linearGradient>
 </defs>
 </svg>

res/icons/hicolor/24x24/apps/com.system76.CosmicFiles.svg

@@ -1,12 +1,10 @@
 <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g id="Size=24">
+<path d="M2 6.25C2 5.00736 3.00736 4 4.25 4H8.06802C8.66476 4 9.23705 4.23705 9.65901 4.65901C10.5176 5.51763 11.6822 6 12.8964 6H19.75C20.9926 6 22 7.00736 22 8.25V17.75C22 18.9926 20.9926 20 19.75 20H4.25C3.00736 20 2 18.9926 2 17.75V6.25Z" fill="#00717C"/>
-<path id="Rectangle 491" d="M2 6.25C2 5.00736 3.00736 4 4.25 4H8.06802C8.66476 4 9.23705 4.23705 9.65901 4.65901L11 6H19.75C20.9926 6 22 7.00736 22 8.25V17.75C22 18.9926 20.9926 20 19.75 20H4.25C3.00736 20 2 18.9926 2 17.75V6.25Z" fill="#008490"/>
+<path d="M2 10.25C2 9.00736 3.00736 8 4.25 8H19.75C20.9926 8 22 9.00736 22 10.25V17.75C22 18.9926 20.9926 20 19.75 20H4.25C3.00736 20 2 18.9926 2 17.75V10.25Z" fill="url(#paint0_linear_2004_699)"/>
-<rect id="Rectangle 418" x="2" y="8" width="20" height="12" rx="2.25" fill="url(#paint0_linear_2004_699)"/>
-</g>
 <defs>
 <linearGradient id="paint0_linear_2004_699" x1="22" y1="8" x2="4.73642" y2="23.1236" gradientUnits="userSpaceOnUse">
 <stop stop-color="#49BAC8"/>
-<stop offset="1" stop-color="#229FAD"/>
+<stop offset="1" stop-color="#05919F"/>
 </linearGradient>
 </defs>
 </svg>

res/icons/hicolor/256x256/apps/com.system76.CosmicFiles.svg

@@ -1,12 +1,10 @@
 <svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g id="Size=256">
+<path d="M8 56C8 47.1634 15.1634 40 24 40H95.7971C99.1785 40 102.473 41.0713 105.208 43.0602L118.792 52.9398C121.527 54.9287 124.821 56 128.203 56H232C240.837 56 248 63.1634 248 72V200C248 208.837 240.837 216 232 216H24C15.1634 216 8 208.837 8 200V56Z" fill="#00717C"/>
-<path id="Rectangle 491" d="M8 56C8 47.1634 15.1634 40 24 40H95.7971C99.1785 40 102.473 41.0713 105.208 43.0602L123 56H232C240.837 56 248 63.1634 248 72V200C248 208.837 240.837 216 232 216H24C15.1634 216 8 208.837 8 200V56Z" fill="#008490"/>
+<path d="M8 88C8 79.1634 15.1634 72 24 72H232C240.837 72 248 79.1634 248 88V200C248 208.837 240.837 216 232 216H24C15.1634 216 8 208.837 8 200V88Z" fill="url(#paint0_linear_2004_704)"/>
-<rect id="Rectangle 418" x="8" y="72" width="240" height="144" rx="16" fill="url(#paint0_linear_2004_704)"/>
-</g>
 <defs>
 <linearGradient id="paint0_linear_2004_704" x1="248" y1="72" x2="40.837" y2="253.483" gradientUnits="userSpaceOnUse">
 <stop stop-color="#49BAC8"/>
-<stop offset="1" stop-color="#229FAD"/>
+<stop offset="1" stop-color="#05919F"/>
 </linearGradient>
 </defs>
 </svg>

res/icons/hicolor/32x32/apps/com.system76.CosmicFiles.svg

@@ -1,12 +1,10 @@
 <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g id="Size=32">
+<path d="M2 9C2 7.34315 3.34315 6 5 6H11.6704C12.4285 6 13.1586 6.28706 13.7137 6.80344C14.5404 7.57249 15.6277 8 16.7568 8H27C28.6569 8 30 9.34315 30 11V23C30 24.6569 28.6569 26 27 26H5C3.34315 26 2 24.6569 2 23V9Z" fill="#00717C"/>
-<path id="Rectangle 491" d="M2 9C2 7.34315 3.34315 6 5 6H11.6704C12.4285 6 13.1586 6.28706 13.7137 6.80344L15 8H27C28.6569 8 30 9.34315 30 11V23C30 24.6569 28.6569 26 27 26H5C3.34315 26 2 24.6569 2 23V9Z" fill="#008490"/>
+<path d="M2 13C2 11.3431 3.34315 10 5 10H27C28.6569 10 30 11.3431 30 13V23C30 24.6569 28.6569 26 27 26H5C3.34315 26 2 24.6569 2 23V13Z" fill="url(#paint0_linear_2004_700)"/>
-<rect id="Rectangle 418" x="2" y="10" width="28" height="16" rx="3" fill="url(#paint0_linear_2004_700)"/>
-</g>
 <defs>
 <linearGradient id="paint0_linear_2004_700" x1="30" y1="10" x2="6.86084" y2="31.2844" gradientUnits="userSpaceOnUse">
 <stop stop-color="#49BAC8"/>
-<stop offset="1" stop-color="#229FAD"/>
+<stop offset="1" stop-color="#05919F"/>
 </linearGradient>
 </defs>
 </svg>

res/icons/hicolor/48x48/apps/com.system76.CosmicFiles.svg

@@ -1,12 +1,10 @@
 <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g id="Size=48">
+<path d="M2 11.5C2 9.567 3.567 8 5.5 8H17.8716C18.6361 8 19.3796 8.25034 19.9885 8.71275C21.9423 10.1967 24.3282 11 26.7817 11H42.5C44.433 11 46 12.567 46 14.5V36.5C46 38.433 44.433 40 42.5 40H5.5C3.567 40 2 38.433 2 36.5V11.5Z" fill="#00717C"/>
-<path id="Rectangle 491" d="M2 11.5C2 9.567 3.567 8 5.5 8H17.8716C18.6361 8 19.3796 8.25034 19.9885 8.71275L23 11H42.5C44.433 11 46 12.567 46 14.5V36.5C46 38.433 44.433 40 42.5 40H5.5C3.567 40 2 38.433 2 36.5V11.5Z" fill="#008490"/>
+<path d="M2 17.5C2 15.567 3.567 14 5.5 14H42.5C44.433 14 46 15.567 46 17.5V36.5C46 38.433 44.433 40 42.5 40H5.5C3.567 40 2 38.433 2 36.5V17.5Z" fill="url(#paint0_linear_2004_701)"/>
-<rect id="Rectangle 418" x="2" y="14" width="44" height="26" rx="3.5" fill="url(#paint0_linear_2004_701)"/>
-</g>
 <defs>
 <linearGradient id="paint0_linear_2004_701" x1="46" y1="14" x2="8.52466" y2="47.335" gradientUnits="userSpaceOnUse">
 <stop stop-color="#49BAC8"/>
-<stop offset="1" stop-color="#229FAD"/>
+<stop offset="1" stop-color="#05919F"/>
 </linearGradient>
 </defs>
 </svg>

res/icons/hicolor/64x64/apps/com.system76.CosmicFiles.svg

@@ -1,12 +1,10 @@
 <svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g id="Size=64">
+<path d="M2 14C2 11.7909 3.79086 10 6 10H23.9493C24.7946 10 25.6183 10.2678 26.302 10.7651L26.5422 10.9398C29.2769 12.9287 32.5715 14 35.9529 14H58C60.2091 14 62 15.7909 62 18V50C62 52.2091 60.2091 54 58 54H6C3.79086 54 2 52.2091 2 50V14Z" fill="#00717C"/>
-<path id="Rectangle 491" d="M2 14C2 11.7909 3.79086 10 6 10H23.9493C24.7946 10 25.6183 10.2678 26.302 10.7651L30.75 14H58C60.2091 14 62 15.7909 62 18V50C62 52.2091 60.2091 54 58 54H6C3.79086 54 2 52.2091 2 50V14Z" fill="#008490"/>
+<path d="M2 22C2 19.7909 3.79086 18 6 18H58C60.2091 18 62 19.7909 62 22V50C62 52.2091 60.2091 54 58 54H6C3.79086 54 2 52.2091 2 50V22Z" fill="url(#paint0_linear_2004_702)"/>
-<rect id="Rectangle 418" x="2" y="18" width="60" height="36" rx="4" fill="url(#paint0_linear_2004_702)"/>
-</g>
 <defs>
 <linearGradient id="paint0_linear_2004_702" x1="62" y1="18" x2="10.2093" y2="63.3709" gradientUnits="userSpaceOnUse">
 <stop stop-color="#49BAC8"/>
-<stop offset="1" stop-color="#229FAD"/>
+<stop offset="1" stop-color="#05919F"/>
 </linearGradient>
 </defs>
 </svg>

src/app.rs

@@ -13,7 +13,7 @@ use cosmic::iced::{
     Limits,
 };
 use cosmic::{
-    app::{self, message, Core, Task},
+    app::{self, context_drawer, message, Core, Task},
     cosmic_config, cosmic_theme, executor,
     iced::{
         clipboard::dnd::DndAction,
@@ -21,7 +21,6 @@ use cosmic::{
         futures::{self, SinkExt},
         keyboard::{Event as KeyEvent, Key, Modifiers},
         stream,
-        widget::scrollable,
         window::{self, Event as WindowEvent, Id as WindowId},
         Alignment, Event, Length, Size, Subscription,
     },
@@ -372,18 +371,6 @@ pub enum ContextPage {
     Settings,
 }
 
-impl ContextPage {
-    pub fn title(&self) -> String {
-        match self {
-            Self::About => String::new(),
-            Self::EditHistory => fl!("edit-history"),
-            Self::NetworkDrive => fl!("add-network-drive"),
-            Self::Preview(..) => String::default(),
-            Self::Settings => fl!("settings"),
-        }
-    }
-}
-
 #[derive(Clone, Copy, Debug, Default, Eq, Hash, PartialEq)]
 pub enum ArchiveType {
     Tgz,
@@ -1135,16 +1122,6 @@ impl App {
         let cosmic_theme::Spacing {
             space_xxs, space_m, ..
         } = theme::active().cosmic().spacing;
-        let mut text_input =
-            widget::text_input(fl!("enter-server-address"), &self.network_drive_input);
-        let button = if self.network_drive_connecting.is_some() {
-            widget::button::standard(fl!("connecting"))
-        } else {
-            text_input = text_input
-                .on_input(Message::NetworkDriveInput)
-                .on_submit(Message::NetworkDriveSubmit);
-            widget::button::standard(fl!("connect")).on_press(Message::NetworkDriveSubmit)
-        };
         let mut table = widget::column::with_capacity(8);
         for (i, line) in fl!("network-drive-schemes").lines().enumerate() {
             let mut row = widget::row::with_capacity(2);
@@ -1165,17 +1142,15 @@ impl App {
             }
         }
         widget::column::with_children(vec![
-            text_input.into(),
             widget::text(fl!("network-drive-description")).into(),
             table.into(),
-            widget::row::with_children(vec![widget::horizontal_space().into(), button.into()])
-                .into(),
         ])
         .spacing(space_m)
         .into()
     }
 
     fn desktop_view_options(&self) -> Element<Message> {
+        let cosmic_theme::Spacing { space_l, .. } = theme::active().cosmic().spacing;
         let config = self.config.desktop;
 
         let mut children = Vec::new();
@@ -1238,7 +1213,9 @@ impl App {
         children.push(section.into());
         */
 
-        widget::column::with_children(children).into()
+        widget::column::with_children(children)
+            .padding([0, space_l, space_l, space_l])
+            .into()
     }
 
     fn edit_history(&self) -> Element<Message> {
@@ -1333,19 +1310,20 @@ impl App {
         kind: &'a PreviewKind,
         context_drawer: bool,
     ) -> Element<'a, Message> {
+        let cosmic_theme::Spacing { space_l, .. } = theme::active().cosmic().spacing;
+
         let mut children = Vec::with_capacity(1);
         let entity = entity_opt.unwrap_or_else(|| self.tab_model.active());
         match kind {
             PreviewKind::Custom(PreviewItem(item)) => {
-                children.push(item.preview_view(IconSizes::default(), context_drawer));
+                children.push(item.preview_view(IconSizes::default()));
             }
             PreviewKind::Location(location) => {
                 if let Some(tab) = self.tab_model.data::<Tab>(entity) {
                     if let Some(items) = tab.items_opt() {
                         for item in items.iter() {
                             if item.location_opt.as_ref() == Some(location) {
-                                children
+                                children.push(item.preview_view(tab.config.icon_sizes));
-                                    .push(item.preview_view(tab.config.icon_sizes, context_drawer));
                                 // Only show one property view to avoid issues like hangs when generating
                                 // preview images on thousands of files
                                 break;
@@ -1359,8 +1337,7 @@ impl App {
                     if let Some(items) = tab.items_opt() {
                         for item in items.iter() {
                             if item.selected {
-                                children
+                                children.push(item.preview_view(tab.config.icon_sizes));
-                                    .push(item.preview_view(tab.config.icon_sizes, context_drawer));
                                 // Only show one property view to avoid issues like hangs when generating
                                 // preview images on thousands of files
                                 break;
@@ -1368,15 +1345,20 @@ impl App {
                         }
                         if children.is_empty() {
                             if let Some(item) = &tab.parent_item_opt {
-                                children
+                                children.push(item.preview_view(tab.config.icon_sizes));
-                                    .push(item.preview_view(tab.config.icon_sizes, context_drawer));
                             }
                         }
                     }
                 }
             }
         }
-        widget::column::with_children(children).into()
+        widget::column::with_children(children)
+            .padding(if context_drawer {
+                [0, 0, 0, 0]
+            } else {
+                [0, space_l, space_l, space_l]
+            })
+            .into()
     }
 
     fn settings(&self) -> Element<Message> {
@@ -2745,7 +2727,6 @@ impl Application for App {
                         tab::Command::AddNetworkDrive => {
                             self.context_page = ContextPage::NetworkDrive;
                             self.set_show_context(true);
-                            self.set_context_title(self.context_page.title());
                         }
                         tab::Command::AddToSidebar(path) => {
                             let mut favorites = self.config.favorites.clone();
@@ -2813,7 +2794,6 @@ impl Application for App {
                         tab::Command::Preview(kind) => {
                             self.context_page = ContextPage::Preview(Some(entity), kind);
                             self.set_show_context(true);
-                            self.set_context_title(self.context_page.title());
                         }
                         tab::Command::WindowDrag => {
                             if let Some(window_id) = &self.window_id_opt {
@@ -2868,7 +2848,6 @@ impl Application for App {
                     self.set_show_context(true);
                 }
                 self.context_page = context_page;
-                self.set_context_title(self.context_page.title());
             }
             Message::Undo(_id) => {
                 // TODO: undo
@@ -3204,7 +3183,6 @@ impl Application for App {
                                     PreviewKind::Custom(PreviewItem(item)),
                                 );
                                 self.set_show_context(true);
-                                self.set_context_title(self.context_page.title());
                             }
                             Err(err) => {
                                 log::warn!("failed to get item from path {:?}: {}", path, err);
@@ -3323,17 +3301,69 @@ impl Application for App {
         Task::none()
     }
 
-    fn context_drawer(&self) -> Option<Element<Message>> {
+    fn context_drawer(&self) -> Option<context_drawer::ContextDrawer<Message>> {
         if !self.core.window.show_context {
             return None;
         }
 
         Some(match &self.context_page {
-            ContextPage::About => self.about(),
+            ContextPage::About => context_drawer::context_drawer(
-            ContextPage::EditHistory => self.edit_history(),
+                self.about(),
-            ContextPage::NetworkDrive => self.network_drive(),
+                Message::ToggleContextPage(ContextPage::About),
-            ContextPage::Preview(entity_opt, kind) => self.preview(entity_opt, kind, true),
+            ),
-            ContextPage::Settings => self.settings(),
+            ContextPage::EditHistory => context_drawer::context_drawer(
+                self.edit_history(),
+                Message::ToggleContextPage(ContextPage::EditHistory),
+            )
+            .title(fl!("edit-history")),
+            ContextPage::NetworkDrive => {
+                let mut text_input =
+                    widget::text_input(fl!("enter-server-address"), &self.network_drive_input);
+                let button = if self.network_drive_connecting.is_some() {
+                    widget::button::standard(fl!("connecting"))
+                } else {
+                    text_input = text_input
+                        .on_input(Message::NetworkDriveInput)
+                        .on_submit(Message::NetworkDriveSubmit);
+                    widget::button::standard(fl!("connect")).on_press(Message::NetworkDriveSubmit)
+                };
+                context_drawer::context_drawer(
+                    self.network_drive(),
+                    Message::ToggleContextPage(ContextPage::NetworkDrive),
+                )
+                .title(fl!("add-network-drive"))
+                .header(text_input)
+                .footer(widget::row::with_children(vec![
+                    widget::horizontal_space().into(),
+                    button.into(),
+                ]))
+            }
+            ContextPage::Preview(entity_opt, kind) => {
+                let mut actions = Vec::with_capacity(3);
+                let entity = entity_opt.unwrap_or_else(|| self.tab_model.active());
+                if let Some(tab) = self.tab_model.data::<Tab>(entity) {
+                    if let Some(items) = tab.items_opt() {
+                        for item in items.iter() {
+                            if item.selected {
+                                actions.extend(item.preview_header())
+                            }
+                        }
+                    }
+                };
+                context_drawer::context_drawer(
+                    self.preview(entity_opt, kind, true),
+                    Message::ToggleContextPage(ContextPage::Preview(
+                        entity_opt.clone(),
+                        kind.clone(),
+                    )),
+                )
+                .header_actions(actions)
+            }
+            ContextPage::Settings => context_drawer::context_drawer(
+                self.settings(),
+                Message::ToggleContextPage(ContextPage::Settings),
+            )
+            .title(fl!("settings")),
         })
     }
 
@@ -3885,10 +3915,7 @@ impl Application for App {
         }
 
         let cosmic_theme::Spacing {
-            space_xxs,
+            space_xs, space_s, ..
-            space_xs,
-            space_s,
-            ..
         } = theme::active().cosmic().spacing;
 
         let mut title = String::new();
@@ -3993,7 +4020,7 @@ impl Application for App {
             .align_y(Alignment::Center)
             .into(),
         ]))
-        .padding([space_xxs, space_xs])
+        .padding([8, space_xs])
         .layer(cosmic_theme::Layer::Primary);
 
         Some(container.into())
@@ -4146,34 +4173,11 @@ impl Application for App {
             }
         };
 
-        //TODO: these are hacks to have a sane scroll bar
+        widget::container(widget::scrollable(content))
-        let cosmic_theme::Spacing { space_l, .. } = theme::active().cosmic().spacing;
+            .width(Length::Fill)
-        let scrollbar_width = 8;
+            .height(Length::Fill)
-        let scrollbar_margin = 8;
+            .class(theme::Container::WindowBackground)
-        widget::container(
+            .into()
-            widget::scrollable(widget::row::with_children(vec![
-                content,
-                widget::Space::with_width(Length::Fixed(
-                    (scrollbar_width + scrollbar_margin).into(),
-                ))
-                .into(),
-            ]))
-            .direction(scrollable::Direction::Vertical(
-                scrollable::Scrollbar::new()
-                    .width(scrollbar_width)
-                    .scroller_width(scrollbar_width),
-            )),
-        )
-        .width(Length::Fill)
-        .height(Length::Fill)
-        .padding([
-            0,
-            space_l - (scrollbar_width + scrollbar_margin),
-            space_l,
-            space_l,
-        ])
-        .class(theme::Container::WindowBackground)
-        .into()
     }
 
     fn subscription(&self) -> Subscription<Self::Message> {

src/dialog.rs

@@ -2,7 +2,7 @@
 // SPDX-License-Identifier: GPL-3.0-only
 
 use cosmic::{
-    app::{self, cosmic::Cosmic, message, Core, Task},
+    app::{self, context_drawer, cosmic::Cosmic, message, Core, Task},
     cosmic_config, cosmic_theme, executor,
     iced::{
         event,
@@ -461,7 +461,7 @@ impl App {
 
         widget::layer_container(col)
             .layer(cosmic_theme::Layer::Primary)
-            .padding([space_xxs, space_xs])
+            .padding([8, space_xs])
             .into()
     }
 
@@ -469,13 +469,13 @@ impl App {
         let mut children = Vec::with_capacity(1);
         match kind {
             PreviewKind::Custom(PreviewItem(item)) => {
-                children.push(item.preview_view(IconSizes::default(), true));
+                children.push(item.preview_view(IconSizes::default()));
             }
             PreviewKind::Location(location) => {
                 if let Some(items) = self.tab.items_opt() {
                     for item in items.iter() {
                         if item.location_opt.as_ref() == Some(location) {
-                            children.push(item.preview_view(self.tab.config.icon_sizes, true));
+                            children.push(item.preview_view(self.tab.config.icon_sizes));
                             // Only show one property view to avoid issues like hangs when generating
                             // preview images on thousands of files
                             break;
@@ -487,7 +487,7 @@ impl App {
                 if let Some(items) = self.tab.items_opt() {
                     for item in items.iter() {
                         if item.selected {
-                            children.push(item.preview_view(self.tab.config.icon_sizes, true));
+                            children.push(item.preview_view(self.tab.config.icon_sizes));
                             // Only show one property view to avoid issues like hangs when generating
                             // preview images on thousands of files
                             break;
@@ -495,7 +495,7 @@ impl App {
                     }
                     if children.is_empty() {
                         if let Some(item) = &self.tab.parent_item_opt {
-                            children.push(item.preview_view(self.tab.config.icon_sizes, true));
+                            children.push(item.preview_view(self.tab.config.icon_sizes));
                         }
                     }
                 }
@@ -794,13 +794,33 @@ impl Application for App {
         (app, commands)
     }
 
-    fn context_drawer(&self) -> Option<Element<Message>> {
+    fn context_drawer(&self) -> Option<context_drawer::ContextDrawer<Message>> {
         if !self.core.window.show_context {
             return None;
         }
 
         match &self.context_page {
-            ContextPage::Preview(_, kind) => Some(self.preview(kind).map(Message::from)),
+            ContextPage::Preview(_, kind) => {
+                let mut actions = Vec::with_capacity(3);
+                if let Some(items) = self.tab.items_opt() {
+                    for item in items.iter() {
+                        if item.selected {
+                            actions.extend(
+                                item.preview_header().into_iter().map(|element| {
+                                    element.map(move |message| Message::from(message))
+                                }),
+                            )
+                        }
+                    }
+                };
+                Some(
+                    context_drawer::context_drawer(
+                        self.preview(kind).map(Message::from),
+                        Message::Preview,
+                    )
+                    .header_actions(actions),
+                )
+            }
             _ => None,
         }
     }
@@ -1401,7 +1421,6 @@ impl Application for App {
                         tab::Command::Preview(kind) => {
                             self.context_page = ContextPage::Preview(None, kind);
                             self.set_show_context(true);
-                            self.set_context_title(self.context_page.title());
                         }
                         tab::Command::WindowDrag => {
                             commands.push(window::drag(self.flags.window_id));

src/tab.rs

@@ -1374,42 +1374,39 @@ impl Item {
         }
     }
 
-    pub fn preview_view<'a>(
+    pub fn preview_header(&self) -> Vec<Element<app::Message>> {
-        &'a self,
+        let mut row = Vec::with_capacity(3);
-        sizes: IconSizes,
+        row.push(
-        nav_row: bool,
+            widget::button::icon(widget::icon::from_name("go-previous-symbolic"))
-    ) -> Element<'a, app::Message> {
+                .on_press(app::Message::TabMessage(None, Message::ItemLeft))
+                .into(),
+        );
+        row.push(
+            widget::button::icon(widget::icon::from_name("go-next-symbolic"))
+                .on_press(app::Message::TabMessage(None, Message::ItemRight))
+                .into(),
+        );
+        if self.can_gallery() {
+            if let Some(_path) = self.path_opt() {
+                row.push(
+                    widget::button::icon(widget::icon::from_name("view-fullscreen-symbolic"))
+                        .on_press(app::Message::TabMessage(None, Message::Gallery(true)))
+                        .into(),
+                );
+            }
+        }
+        row
+    }
+
+    pub fn preview_view<'a>(&'a self, sizes: IconSizes) -> Element<'a, app::Message> {
         let cosmic_theme::Spacing {
             space_xxxs,
-            space_xxs,
             space_m,
             ..
         } = theme::active().cosmic().spacing;
 
         let mut column = widget::column().spacing(space_m);
 
-        if nav_row {
-            let mut row = widget::row::with_capacity(3).spacing(space_xxs);
-            row = row.push(
-                widget::button::icon(widget::icon::from_name("go-previous-symbolic"))
-                    .on_press(app::Message::TabMessage(None, Message::ItemLeft)),
-            );
-            row = row.push(
-                widget::button::icon(widget::icon::from_name("go-next-symbolic"))
-                    .on_press(app::Message::TabMessage(None, Message::ItemRight)),
-            );
-
-            if self.can_gallery() {
-                if let Some(_path) = self.path_opt() {
-                    row = row.push(
-                        widget::button::icon(widget::icon::from_name("view-fullscreen-symbolic"))
-                            .on_press(app::Message::TabMessage(None, Message::Gallery(true))),
-                    );
-                }
-            }
-            column = column.push(row);
-        }
-
         column = column.push(widget::row::with_children(vec![
             widget::horizontal_space().into(),
             self.preview(sizes),