refactor: use palette for custom theming

decipher3114 · Sep 26, 2024 · 69b67a2 · 69b67a2
1 parent e653608
commit 69b67a2
Show file tree

Hide file tree

Showing 6 changed files with 78 additions and 91 deletions.
diff --git a/src/entities/theme.rs b/src/entities/theme.rs
@@ -1,3 +1,4 @@
+use iced::Color;
 use serde::{Deserialize, Serialize};
 
 #[derive(Debug, Clone, Default, PartialEq, Serialize, Deserialize)]
@@ -6,3 +7,13 @@ pub enum Theme {
     Light,
     Dark,
 }
+
+pub struct Palette {
+    pub background: Color,
+    pub surface: Color,
+    pub text: Color,
+    pub primary: Color,
+    pub secondary: Color,
+    pub danger_primary: Color,
+    pub danger_secondary: Color,
+}
diff --git a/src/style/button.rs b/src/style/button.rs
@@ -14,53 +14,23 @@ impl Catalog for Theme {
     }
 
     fn style(&self, class: &Self::Class<'_>, status: Status) -> Style {
+        let palette = self.palette();
         Style {
             background: {
                 match status {
-                    Status::Active => match self {
-                        Self::Light => match class {
-                            ButtonClass::Default => {
-                                Some(Background::Color(Color::from_rgb8(190, 190, 190)))
-                            }
-                            ButtonClass::Danger => {
-                                Some(Background::Color(Color::from_rgb8(255, 100, 100)))
-                            }
-                        },
-                        Self::Dark => match class {
-                            ButtonClass::Default => {
-                                Some(Background::Color(Color::from_rgb8(70, 70, 70)))
-                            }
-                            ButtonClass::Danger => {
-                                Some(Background::Color(Color::from_rgb8(228, 67, 67)))
-                            }
-                        },
+                    Status::Active => match class {
+                        ButtonClass::Default => Some(Background::Color(palette.primary)),
+                        ButtonClass::Danger => Some(Background::Color(palette.danger_primary)),
                     },
-                    Status::Hovered | Status::Pressed => match self {
-                        Self::Light => match class {
-                            ButtonClass::Default => {
-                                Some(Background::Color(Color::from_rgb8(180, 180, 180)))
-                            }
-                            ButtonClass::Danger => {
-                                Some(Background::Color(Color::from_rgb8(245, 90, 90)))
-                            }
-                        },
-                        Self::Dark => match class {
-                            ButtonClass::Default => {
-                                Some(Background::Color(Color::from_rgb8(80, 80, 80)))
-                            }
-                            ButtonClass::Danger => {
-                                Some(Background::Color(Color::from_rgb8(238, 77, 77)))
-                            }
-                        },
+                    Status::Hovered | Status::Pressed => match class {
+                        ButtonClass::Default => Some(Background::Color(palette.secondary)),
+                        ButtonClass::Danger => Some(Background::Color(palette.danger_secondary)),
                     },
                     _ => Some(Background::Color(Color::default())),
                 }
             },
             border: Border {
-                color: match self {
-                    Theme::Light => Color::from_rgb8(180, 180, 180),
-                    Theme::Dark => Color::from_rgb8(80, 80, 80),
-                },
+                color: palette.secondary,
                 width: 0.5,
                 radius: Radius::new(8),
             },

diff --git a/src/style/container.rs b/src/style/container.rs
@@ -1,4 +1,8 @@
-use iced::{border::Radius, widget::container, Background, Border, Color};
+use iced::{
+    border::Radius,
+    widget::container::{self, Style},
+    Background, Border,
+};
 
 use crate::entities::{style::ContainerClass, theme::Theme};
 
@@ -9,26 +13,16 @@ impl container::Catalog for Theme {
         ContainerClass
     }
 
-    fn style(&self, _class: &Self::Class<'_>) -> container::Style {
-        match self {
-            Self::Light => container::Style {
-                background: Some(Background::Color(Color::from_rgb8(210, 210, 210))),
-                border: Border {
-                    color: Color::from_rgb8(190, 190, 190),
-                    width: 0.5,
-                    radius: Radius::new(8),
-                },
-                ..Default::default()
-            },
-            Self::Dark => container::Style {
-                background: Some(Background::Color(Color::from_rgb8(50, 50, 50))),
-                border: Border {
-                    color: Color::from_rgb8(80, 80, 80),
-                    width: 0.5,
-                    radius: Radius::new(8),
-                },
-                ..Default::default()
+    fn style(&self, _class: &Self::Class<'_>) -> Style {
+        let palette = self.palette();
+        Style {
+            background: Some(Background::Color(palette.surface)),
+            border: Border {
+                color: palette.secondary,
+                width: 0.5,
+                radius: Radius::new(8),
             },
+            ..Default::default()
         }
     }
 }
diff --git a/src/style/mod.rs b/src/style/mod.rs
@@ -1,18 +1,48 @@
 use std::fmt::Display;
 
+use iced::{
+    color,
+    daemon::{Appearance, DefaultStyle},
+    Color,
+};
+
+use crate::entities::theme::{Palette, Theme};
+
 mod button;
 mod container;
 mod svg;
 mod text;
 
-use iced::{
-    daemon::{self, DefaultStyle},
-    Color,
+pub type Element<'a, Message> = iced::Element<'a, Message, Theme>;
+
+pub const LIGHT: Palette = Palette {
+    background: color!(220, 220, 220),
+    surface: color!(210, 210, 210),
+    text: color!(50, 50, 50),
+    primary: color!(190, 190, 190),
+    secondary: color!(170, 170, 170),
+    danger_primary: color!(255, 100, 100),
+    danger_secondary: color!(245, 90, 90),
 };
 
-use crate::entities::theme::Theme;
+pub const DARK: Palette = Palette {
+    background: color!(40, 40, 40),
+    surface: color!(50, 50, 50),
+    text: color!(210, 210, 210),
+    primary: color!(70, 70, 70),
+    secondary: color!(90, 90, 90),
+    danger_primary: color!(228, 67, 67),
+    danger_secondary: color!(238, 77, 77),
+};
 
-pub type Element<'a, Message> = iced::Element<'a, Message, Theme>;
+impl Theme {
+    pub fn palette(&self) -> Palette {
+        match self {
+            Theme::Light => LIGHT,
+            Theme::Dark => DARK,
+        }
+    }
+}
 
 impl Display for Theme {
     fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
@@ -24,16 +54,10 @@ impl Display for Theme {
 }
 
 impl DefaultStyle for Theme {
-    fn default_style(&self) -> daemon::Appearance {
-        match self {
-            Self::Light => daemon::Appearance {
-                background_color: Color::from_rgb8(220, 220, 220),
-                text_color: Color::default(),
-            },
-            Self::Dark => daemon::Appearance {
-                background_color: Color::from_rgb8(40, 40, 40),
-                text_color: Color::default(),
-            },
+    fn default_style(&self) -> Appearance {
+        Appearance {
+            background_color: self.palette().background,
+            text_color: Color::default(),
         }
     }
 }
diff --git a/src/style/svg.rs b/src/style/svg.rs
@@ -1,23 +1,17 @@
-use iced::{
-    widget::svg::{self, Status, Style},
-    Color,
-};
+use iced::widget::svg::{Catalog, Status, Style};
 
 use crate::entities::{style::SvgClass, theme::Theme};
 
-impl svg::Catalog for Theme {
+impl Catalog for Theme {
     type Class<'a> = SvgClass;
 
     fn default<'a>() -> Self::Class<'a> {
         SvgClass
     }
 
-    fn style(&self, _class: &Self::Class<'_>, _status: Status) -> svg::Style {
+    fn style(&self, _class: &Self::Class<'_>, _status: Status) -> Style {
         Style {
-            color: Some(match self {
-                Theme::Light => Color::from_rgb8(50, 50, 50),
-                Theme::Dark => Color::from_rgb8(210, 210, 210),
-            }),
+            color: Some(self.palette().text),
         }
     }
 }
diff --git a/src/style/text.rs b/src/style/text.rs
@@ -1,7 +1,4 @@
-use iced::{
-    widget::text::{Catalog, Style},
-    Color,
-};
+use iced::widget::text::{Catalog, Style};
 
 use crate::entities::{style::TextClass, theme::Theme};
 
@@ -14,10 +11,7 @@ impl Catalog for Theme {
 
     fn style(&self, _item: &Self::Class<'_>) -> Style {
         Style {
-            color: Some(match self {
-                Theme::Light => Color::from_rgb8(50, 50, 50),
-                Theme::Dark => Color::from_rgb8(210, 210, 210),
-            }),
+            color: Some(self.palette().text),
         }
     }
 }