Gradience/data/ui/window.blp

using Gtk 4.0;
using Adw 1;

template GradienceMainWindow : Adw.ApplicationWindow {
  title: _("Gradience");
  default-width: 1000;
  default-height: 700;

  ShortcutController {
    Shortcut {
      trigger: "<primary>q";
      action: "action(window.close)";
    }
  }

  Adw.ToastOverlay toast_overlay {
    Adw.Leaflet leaflet {
      can-navigate-back: true;
      can-unfold: false;

      Gtk.Box main_view {
        orientation: vertical;

        Adw.HeaderBar titlebar {
          centering-policy: strict;

          Button apply-button {
            styles ["suggested-action"]
            label: _("Apply");
            tooltip-text: _("Apply Preset");
            action-name: "app.apply_color_scheme";
          }

          [start]
          Button {
            icon-name: "applications-science-symbolic";
            tooltip-text: _("Show Preview Window");
            visible: false;
          }

          [title]
          Adw.ViewSwitcherTitle title {
            stack: view_stack;
          }

          [end]
          Gtk.MenuButton {
            tooltip-text: _("Main Menu");
            icon-name: "open-menu-symbolic";
            menu-model: main-menu;
          }

          [end]
          MenuButton presets-dropdown {
            menu-model: presets-menu;
            label: _("Presets");
            tooltip-text: _("Presets Menu");
            icon-name: "palette-symbolic";
          }

          [end]
          Button save-preset-button {
            action-name: "app.save_preset";
            tooltip-text: _("Save Preset");
            Adw.ButtonContent {
              icon-name: "drive-symbolic";
            }
          }

          [end]
          MenuButton errors-button {
            styles ["raised", "error"]
            tooltip-text: _("CSS Errors");
            icon-name: "dialog-warning-symbolic";
            popover: errors-popover;
          }
        }

        Gtk.Box {
          orientation: vertical;

          Adw.ViewStack view_stack {
            vexpand: true;
            hexpand: true;

            Adw.ViewStackPage {
              name: "colors";
              title: _("Colors");
              icon-name: "larger-brush-symbolic";

              child: Adw.PreferencesPage content { };
            }

            Adw.ViewStackPage {
              name: "monet";
              title: _("Monet");
              icon-name: "color-picker-symbolic";

              child: Adw.PreferencesPage content_monet { };
            }

            Adw.ViewStackPage {
              name: "plugins";
              title: _("Advanced");
              icon-name: "settings-symbolic";

              child: Adw.PreferencesPage content_plugins { };
            }
          }

          Adw.ViewSwitcherBar {
            stack: view_stack;
            reveal: bind title.title-visible;
          }
        }
      }
    }
  }
}


menu main-menu {
  section {
    item {
      label: _("Restore Applied Color Scheme");
      action: "app.restore_color_scheme";
    }

    item {
      label: _("Reset Applied Color Scheme");
      action: "app.reset_color_scheme";
    }
  }
  section {
    item {
      label: _("Preferences");
      action: "app.preferences";
    }

    item {
      label: _("About Gradience");
      action: "app.about";
    }
  }
}

menu presets-menu {
  section {
    label: _("Built-In Presets");

    item {
      label: "Adwaita";
      action: "app.load_preset";
      target: "adwaita";
    }

    item {
      label: "Adwaita Dark";
      action: "app.load_preset";
      target: "adwaita-dark";
    }

     item {
      label: "Pretty Purple";
      action: "app.load_preset";
      target: "pretty-purple";
    }

    item {
      label: _("Manage Presets");
      action: "app.manage_presets";
    }
  }
}


Popover errors-popover {
  ListBox errors-list {
    selection-mode: none;

    [placeholder]
    Label {
      margin-top: 6;
      margin-bottom: 6;
      margin-start: 12;
      margin-end: 12;
      halign: start;
      styles ["dim-label"]
      max-width-chars: 50;
      wrap: true;
      justify: left;
    }
  }
}