theme_customization/
theme_customization.rs

1use operad::debug::DebugThemeSnapshot;
2use operad::native::NativeWindowResult;
3use operad::widgets;
4use operad::widgets::ext::{self as ext_widgets, ThemeEditorPanelOptions};
5use operad::{
6    root_style, ColorRgba, LayoutStyle, StrokeStyle, TextStyle, Theme, UiDocument, UiNode, UiSize,
7    UiVisual,
8};
9
10fn main() -> NativeWindowResult {
11    operad::native::run("Theme customization", theme_document)
12}
13
14fn theme_document(viewport: UiSize) -> UiDocument {
15    let mut ui = UiDocument::new(root_style(viewport.width, viewport.height));
16    let panel = ui.add_child(
17        ui.root(),
18        UiNode::container(
19            "theme.panel",
20            LayoutStyle::column()
21                .with_width_percent(1.0)
22                .with_height_percent(1.0)
23                .with_padding(16.0)
24                .with_gap(12.0),
25        )
26        .with_visual(UiVisual::panel(ColorRgba::new(13, 17, 23, 255), None, 0.0)),
27    );
28
29    widgets::label(
30        &mut ui,
31        panel,
32        "theme.title",
33        "Theme customization",
34        TextStyle {
35            font_size: 22.0,
36            line_height: 30.0,
37            color: ColorRgba::WHITE,
38            ..TextStyle::default()
39        },
40        LayoutStyle::new().with_width_percent(1.0).with_height(34.0),
41    );
42
43    let theme = Theme::dark();
44    let snapshot = DebugThemeSnapshot::from_theme(&theme);
45    let mut options = ThemeEditorPanelOptions::default().with_action_prefix("theme");
46    options.layout = LayoutStyle::column()
47        .with_width_percent(1.0)
48        .with_height(0.0)
49        .with_flex_grow(1.0)
50        .with_gap(8.0);
51    options.max_token_rows = 18;
52    options.max_component_rows = 10;
53    options.label_width = 220.0;
54    options.row_height = 28.0;
55
56    let editor = ui.add_child(
57        panel,
58        UiNode::container(
59            "theme.editor.surface",
60            LayoutStyle::column()
61                .with_width_percent(1.0)
62                .with_height(0.0)
63                .with_flex_grow(1.0)
64                .with_padding(12.0),
65        )
66        .with_visual(UiVisual::panel(
67            ColorRgba::new(24, 29, 36, 255),
68            Some(StrokeStyle::new(ColorRgba::new(58, 68, 84, 255), 1.0)),
69            6.0,
70        )),
71    );
72
73    ext_widgets::theme_editor_panel(&mut ui, editor, "theme.editor", &snapshot, options);
74    ui
75}
theme_customization/theme_customization.rs

theme_customization/
theme_customization.rs
