theme/
theme.rs

1//! Custom canvas chrome via [`InitPluginContext::theme`] in [`Plugin::setup`].
2use ferrum_flow::*;
3use gpui::{AppContext as _, Application, WindowOptions};
4use serde_json::json;
5
6struct DarkGridThemePlugin;
7
8impl Plugin for DarkGridThemePlugin {
9    fn name(&self) -> &'static str {
10        "dark_grid_theme"
11    }
12
13    fn setup(&mut self, ctx: &mut InitPluginContext) {
14        ctx.theme.background = 0x001a1d2a;
15        ctx.theme.background_grid_dot = 0x003d4559;
16        ctx.theme.node_card_background = 0x0024283a;
17        ctx.theme.node_card_border = 0x004a5568;
18        ctx.theme.node_card_border_selected = 0x00f5a524;
19        ctx.theme.node_caption_text = 0x00e8eaef;
20        ctx.theme.default_port_fill = 0x004a5568;
21        ctx.theme.undefined_node_background = 0x00303845;
22        ctx.theme.undefined_node_border = 0x00f5a524;
23        ctx.theme.undefined_node_caption_text = 0x00b8bcc8;
24        ctx.theme.edge_stroke = 0x0050586b;
25        ctx.theme.edge_stroke_selected = 0x00f5a524;
26        ctx.theme.selection_rect_border = 0x006b8cff;
27        ctx.theme.selection_rect_fill_rgba = 0x6b8cff33;
28        ctx.theme.port_preview_line = 0x0050586b;
29        ctx.theme.port_preview_dot = 0x0060809e;
30        ctx.theme.minimap_background = 0x0018202e;
31        ctx.theme.minimap_border = 0x004a5568;
32        ctx.theme.minimap_edge = 0x0050586b;
33        ctx.theme.minimap_node_fill = 0x0024283a;
34        ctx.theme.minimap_node_stroke = 0x00607080;
35        ctx.theme.minimap_viewport_stroke = 0x006b8cff;
36        ctx.theme.zoom_controls_background = 0x0024283a;
37        ctx.theme.zoom_controls_border = 0x004a5568;
38        ctx.theme.zoom_controls_text = 0x00e8eaef;
39        ctx.theme.context_menu_background = 0x0024283a;
40        ctx.theme.context_menu_border = 0x004a5568;
41        ctx.theme.context_menu_text = 0x00e8eaef;
42        ctx.theme.context_menu_shortcut_text = 0x009098a8;
43        ctx.theme.context_menu_separator = 0x003d4559;
44    }
45}
46
47fn main() {
48    Application::new().run(|cx| {
49        let mut graph = Graph::new();
50
51        graph
52            .create_node("")
53            .position(100.0, 100.0)
54            .output()
55            .output()
56            .data(json!({ "label": "Themed" }))
57            .build(&mut graph);
58
59        cx.open_window(WindowOptions::default(), |window, cx| {
60            cx.new(|ctx| {
61                FlowCanvas::builder(graph, ctx, window)
62                    .plugin(DarkGridThemePlugin)
63                    .plugin(MinimapPlugin::new())
64                    .plugin(SelectionPlugin::new())
65                    .plugin(NodeInteractionPlugin::new())
66                    .plugin(SnapGuidesPlugin::new())
67                    .plugin(ViewportPlugin::new())
68                    .plugin(ZoomControlsPlugin::new())
69                    .plugin(BackgroundPlugin::new())
70                    .plugin(NodePlugin::new())
71                    .plugin(PortInteractionPlugin::new())
72                    .plugin(EdgePlugin::new())
73                    .plugin(ClipboardPlugin::new())
74                    .plugin(ContextMenuPlugin::new())
75                    .plugin(SelectAllViewportPlugin::new())
76                    .plugin(AlignPlugin::new())
77                    .plugin(FocusSelectionPlugin::new())
78                    .plugin(FitAllGraphPlugin::new())
79                    .plugin(DeletePlugin::new())
80                    .plugin(HistoryPlugin::new())
81                    .build()
82            })
83        })
84        .unwrap();
85    });
86}
theme/theme.rs

theme/
theme.rs
