Reduce contrast of dark theme in `scrollable` example

1 files changed, 37 insertions, 39 deletions

diff --git a/examples/scrollable/src/style.rs b/examples/scrollable/src/style.rs
index c6a33192..24d711ac 100644
--- a/examples/scrollable/src/style.rs
+++ b/examples/scrollable/src/style.rs
@@ -56,45 +56,39 @@ mod dark {
     use iced::{container, radio, rule, scrollable, Color};
 
     const BACKGROUND: Color = Color::from_rgb(
-        0x0f as f32 / 255.0,
-        0x14 as f32 / 255.0,
-        0x19 as f32 / 255.0,
-    );
-
-    const LIGHTER_BACKGROUND: Color = Color::from_rgb(
-        0x14 as f32 / 255.0,
-        0x19 as f32 / 255.0,
-        0x1f as f32 / 255.0,
+        0x36 as f32 / 255.0,
+        0x39 as f32 / 255.0,
+        0x3F as f32 / 255.0,
     );
 
-    const YELLOW: Color = Color::from_rgb(
-        0xff as f32 / 255.0,
-        0xb4 as f32 / 255.0,
-        0x54 as f32 / 255.0,
+    const SURFACE: Color = Color::from_rgb(
+        0x40 as f32 / 255.0,
+        0x44 as f32 / 255.0,
+        0x4B as f32 / 255.0,
     );
 
-    const CYAN: Color = Color::from_rgb(
-        0x39 as f32 / 255.0,
-        0xaf as f32 / 255.0,
-        0xd7 as f32 / 255.0,
+    const ACCENT: Color = Color::from_rgb(
+        0x6F as f32 / 255.0,
+        0xFF as f32 / 255.0,
+        0xE9 as f32 / 255.0,
     );
 
-    const CYAN_LIGHT: Color = Color::from_rgb(
-        0x5d as f32 / 255.0,
-        0xb7 as f32 / 255.0,
-        0xd5 as f32 / 255.0,
+    const ACTIVE: Color = Color::from_rgb(
+        0x72 as f32 / 255.0,
+        0x89 as f32 / 255.0,
+        0xDA as f32 / 255.0,
     );
 
-    const ORANGE: Color = Color::from_rgb(
-        0xff as f32 / 255.0,
-        0x77 as f32 / 255.0,
+    const SCROLLBAR: Color = Color::from_rgb(
+        0x2E as f32 / 255.0,
         0x33 as f32 / 255.0,
+        0x38 as f32 / 255.0,
     );
 
-    const ORANGE_DARK: Color = Color::from_rgb(
-        0xe6 as f32 / 255.0,
-        0x5b as f32 / 255.0,
-        0x16 as f32 / 255.0,
+    const SCROLLER: Color = Color::from_rgb(
+        0x20 as f32 / 255.0,
+        0x22 as f32 / 255.0,
+        0x25 as f32 / 255.0,
     );
 
     pub struct Container;
@@ -118,16 +112,16 @@ mod dark {
     impl radio::StyleSheet for Radio {
         fn active(&self) -> radio::Style {
             radio::Style {
-                background: BACKGROUND.into(),
-                dot_color: CYAN,
+                background: SURFACE.into(),
+                dot_color: ACTIVE,
                 border_width: 1,
-                border_color: CYAN,
+                border_color: ACTIVE,
             }
         }
 
         fn hovered(&self) -> radio::Style {
             radio::Style {
-                background: LIGHTER_BACKGROUND.into(),
+                background: Color { a: 0.5, ..SURFACE }.into(),
                 ..self.active()
             }
         }
@@ -138,12 +132,16 @@ mod dark {
     impl scrollable::StyleSheet for Scrollable {
         fn active(&self) -> scrollable::Scrollbar {
             scrollable::Scrollbar {
-                background: CYAN.into(),
+                background: Color {
+                    a: 0.8,
+                    ..SCROLLBAR
+                }
+                .into(),
                 border_radius: 2,
                 border_width: 0,
                 border_color: Color::TRANSPARENT,
                 scroller: scrollable::Scroller {
-                    color: YELLOW,
+                    color: Color { a: 0.7, ..SCROLLER },
                     border_radius: 2,
                     border_width: 0,
                     border_color: Color::TRANSPARENT,
@@ -155,9 +153,9 @@ mod dark {
             let active = self.active();
 
             scrollable::Scrollbar {
-                background: CYAN_LIGHT.into(),
+                background: SCROLLBAR.into(),
                 scroller: scrollable::Scroller {
-                    color: ORANGE,
+                    color: SCROLLER,
                     ..active.scroller
                 },
                 ..active
@@ -169,7 +167,7 @@ mod dark {
 
             scrollable::Scrollbar {
                 scroller: scrollable::Scroller {
-                    color: ORANGE_DARK,
+                    color: ACCENT,
                     ..hovered.scroller
                 },
                 ..hovered
@@ -182,10 +180,10 @@ mod dark {
     impl rule::StyleSheet for Rule {
         fn style(&self) -> rule::Style {
             rule::Style {
-                color: CYAN,
+                color: SURFACE,
                 width: 2,
                 radius: 1,
-                fill_mode: rule::FillMode::Percent(15.0),
+                fill_mode: rule::FillMode::Percent(30.0),
             }
         }
     }