Fade out the edges of ScrollAreas (#8018)

## Before:
<img width="381" height="307" alt="image"
src="https://github.com/user-attachments/assets/0528ae2a-44bf-4d9e-89a4-c3f4ab438eb2"
/>

It is very hard here to realize this is a scrollable area

## After
<img width="383" height="310" alt="image"
src="https://github.com/user-attachments/assets/9e0ee6de-8b96-4e5c-a505-f57977010990"
/>

The fade at the bottom tells the user they should try scrolling.

You can turn if off with `style.spacing.scroll.fade.enabled`

crates/epaint/src/direction.rs

@@ -0,0 +1,27 @@
+/// A cardinal direction, one of [`LeftToRight`](Direction::LeftToRight), [`RightToLeft`](Direction::RightToLeft), [`TopDown`](Direction::TopDown), [`BottomUp`](Direction::BottomUp).
+#[derive(Clone, Copy, Debug, PartialEq, Eq)]
+#[cfg_attr(feature = "serde", derive(serde::Deserialize, serde::Serialize))]
+pub enum Direction {
+    LeftToRight,
+    RightToLeft,
+    TopDown,
+    BottomUp,
+}
+
+impl Direction {
+    #[inline(always)]
+    pub fn is_horizontal(self) -> bool {
+        match self {
+            Self::LeftToRight | Self::RightToLeft => true,
+            Self::TopDown | Self::BottomUp => false,
+        }
+    }
+
+    #[inline(always)]
+    pub fn is_vertical(self) -> bool {
+        match self {
+            Self::LeftToRight | Self::RightToLeft => false,
+            Self::TopDown | Self::BottomUp => true,
+        }
+    }
+}