Introduce an appearance for a scrollable, ability to customize the scrollbar gap.

Update scrollable.rs

2 files changed, 30 insertions, 4 deletions

diff --git a/style/src/scrollable.rs b/style/src/scrollable.rs
index 6f37305f..3daa8886 100644
--- a/style/src/scrollable.rs
+++ b/style/src/scrollable.rs
@@ -1,14 +1,14 @@
 //! Change the appearance of a scrollable.
 use crate::core::{Background, Border, Color};
 
-/// The appearance of a scrollable.
+/// The appearance of the scrollbar of a scrollable.
 #[derive(Debug, Clone, Copy)]
 pub struct Scrollbar {
-    /// The [`Background`] of a scrollable.
+    /// The [`Background`] of a scrollbar.
     pub background: Option<Background>,
-    /// The [`Border`] of a scrollable.
+    /// The [`Border`] of a scrollbar.
     pub border: Border,
-    /// The appearance of the [`Scroller`] of a scrollable.
+    /// The appearance of the [`Scroller`] of a scrollbar.
     pub scroller: Scroller,
 }
 
@@ -21,11 +21,23 @@ pub struct Scroller {
     pub border: Border,
 }
 
+/// The appearance of a scrolable.
+#[derive(Debug, Clone, Copy)]
+pub struct Appearance {
+    /// The [`Background`] of a scrollable.
+    pub background: Option<Background>,
+    /// The [`Background`] of the gap between a horizontal and vertical scrollbar.
+    pub gap: Option<Background>,
+}
+
 /// A set of rules that dictate the style of a scrollable.
 pub trait StyleSheet {
     /// The supported style of the [`StyleSheet`].
     type Style: Default;
 
+    /// Produces the style of the scrollable container.
+    fn appearance(&self, style: &Self::Style) -> Appearance;
+
     /// Produces the style of an active scrollbar.
     fn active(&self, style: &Self::Style) -> Scrollbar;
 
diff --git a/style/src/theme.rs b/style/src/theme.rs
index 5909498f..4579181b 100644
--- a/style/src/theme.rs
+++ b/style/src/theme.rs
@@ -1188,6 +1188,20 @@ impl Scrollable {
 impl scrollable::StyleSheet for Theme {
     type Style = Scrollable;
 
+    fn appearance(&self, style: &Self::Style) -> scrollable::Appearance {
+        match style {
+            Scrollable::Default => {
+                let palette = self.extended_palette();
+
+                scrollable::Appearance {
+                    background: None,
+                    gap: Some(palette.background.weak.color.into()),
+                }
+            }
+            Scrollable::Custom(custom) => custom.appearance(self),
+        }
+    }
+
     fn active(&self, style: &Self::Style) -> scrollable::Scrollbar {
         match style {
             Scrollable::Default => {