Added custom themes

edfloreshz · Feb 4, 2024 · 9f35df2 · 9f35df2
1 parent bee4e30
commit 9f35df2
Showing 1 changed file with 81 additions and 59 deletions.
diff --git a/gui/freya/src/main.rs b/gui/freya/src/main.rs
@@ -6,16 +6,37 @@
 use freya::hotreload::FreyaCtx;
 use freya::prelude::*;
 
-const CUSTOM_THEME: Theme = Theme {
+const LIGHT_CUSTOM: Theme = Theme {
     button: ButtonTheme {
-        background: Cow::Borrowed("rgb(40, 40, 40)"),
-        hover_background: Cow::Borrowed("rgb(50, 50, 50)"),
-        border_fill: Cow::Borrowed("rgb(120, 120, 120)"),
+        background: cow_borrowed!("rgb(230, 219, 204)"),
+        hover_background: cow_borrowed!("rgb(132, 115, 108)"),
+        border_fill: cow_borrowed!("rgb(230, 219, 204)"),
         font_theme: FontTheme {
-            color: Cow::Borrowed("white"),
+            color: cow_borrowed!("black"),
+        },
+        ..LIGHT_THEME.button
+    },
+    body: BodyTheme {
+        background: cow_borrowed!("rgb(240, 234, 226)"),
+        ..LIGHT_THEME.body
+    },
+    ..LIGHT_THEME
+};
+
+const DARK_CUSTOM: Theme = Theme {
+    button: ButtonTheme {
+        background: cow_borrowed!("rgb(132, 115, 108)"),
+        hover_background: cow_borrowed!("rgb(56, 49, 46)"),
+        border_fill: cow_borrowed!("rgb(56, 49, 46)"),
+        font_theme: FontTheme {
+            color: cow_borrowed!("white"),
         },
         ..DARK_THEME.button
     },
+    body: BodyTheme {
+        background: cow_borrowed!("rgb(47, 42, 39)"),
+        ..DARK_THEME.body
+    },
     ..DARK_THEME
 };
 
@@ -49,70 +70,71 @@ fn app(cx: Scope) -> Element {
     let app = use_ref(cx, || Devmode::default());
 
     render!(
-        rect {
-            width: "100%",
-            height: "100%",
-            ThemeProvider {
-                theme: DARK_THEME,
+        ThemeProvider {
+            theme: LIGHT_CUSTOM,
+            Body {
                 rect {
                     width: "100%",
-                    background: "rgb(32, 32, 32)",
-                    color: "white",
-                    direction: "horizontal",
-                    cross_align: "center",
-                    main_align: "center",
-                    Button {
-                        onclick: move |_| app.with_mut(|app| app.page = Page::Clone),
-                        label {
-                            "Clone"
+                    height: "100%",
+                    rect {
+                        width: "100%",
+                        padding: "10 0 0 0",
+                        direction: "horizontal",
+                        cross_align: "center",
+                        main_align: "center",
+                        Button {
+                            onclick: move |_| app.with_mut(|app| app.page = Page::Clone),
+                            label {
+                                "Clone"
+                            }
                         }
-                    }
-                    Button {
-                        onclick: move |_| app.with_mut(|app| app.page = Page::Open),
-                        label {
-                            "Open"
+                        Button {
+                            onclick: move |_| app.with_mut(|app| app.page = Page::Open),
+                            label {
+                                "Open"
+                            }
                         }
-                    }
-                    Button {
-                        onclick: move |_| app.with_mut(|app| app.page = Page::Workspaces),
-                        label {
-                            "Workspaces"
+                        Button {
+                            onclick: move |_| app.with_mut(|app| app.page = Page::Workspaces),
+                            label {
+                                "Workspaces"
+                            }
                         }
-                    }
-                    Button {
-                        onclick: move |_| app.with_mut(|app| app.page = Page::Preferences),
-                        label {
-                            "Preferences"
+                        Button {
+                            onclick: move |_| app.with_mut(|app| app.page = Page::Preferences),
+                            label {
+                                "Preferences"
+                            }
                         }
                     }
-                }
-                rect {
-                    width: "100%",
-                    background: "rgb(32, 32, 32)",
-                    cross_align: "center",
                     rect {
                         width: "100%",
-                        height: "calc(100% - 65)",
-                        padding: "15",
-                        margin: "15",
-                        background: "rgb(40, 40, 40)",
-                        color: "white",
-                        corner_radius: "10",
-                        corner_smoothing: "75%",
-                        Page {
-                            page: app.read().page.clone()
+                        cross_align: "center",
+                        rect {
+                            width: "100%",
+                            height: "calc(100% - 65)",
+                            padding: "15",
+                            margin: "15",
+                            corner_radius: "10",
+                            corner_smoothing: "75%",
+                            // background: "rgb(132, 115, 108)",
+                            // shadow: "0 0 10 1 rgb(0, 0, 0, 120)",
+                            background: "rgb(255, 255, 255)",
+                            shadow: "0 0 10 1 rgb(100, 100, 100, 120)",
+                            Page {
+                                page: app.read().page.clone()
+                            }
                         }
-                    }
-                    rect {
-                        width: "100%",
-                        height: "65",
-                        padding: "10",
-                        background: "rgb(32, 32, 32)",
-                        color: "white",
-                        shadow: "0 0 10 1 rgb(0, 0, 0, 120)",
-                        Button {
-                            label {
-                                "Clone"
+                        rect {
+                            width: "100%",
+                            height: "65",
+                            padding: "10",
+                            cross_align: "center",
+                            main_align: "center",
+                            Button {
+                                label {
+                                    "Clone"
+                                }
                             }
                         }
                     }