Visitar URL original
Make ModalDialog follow the shared themes of wicket-extensions · Issue #1645 · apache/wicket · GitHub
Skip to content

Make ModalDialog follow the shared themes of wicket-extensions #1645

Description

@reiern70

Part of #1639.

ModalDialog's default look comes from its DefaultTheme behavior (ajax/markup/html/modal/theme/theme.css): a dimmed overlay, a white dialog with a shadow, and nothing for a title bar or buttons, which every application styles itself. A page using the shared themes of #1638 (DynamicDataTable, ProgressBar, CollapsiblePanel, FloatingPanel) therefore shows a modal dialog that ignores the theme: white on a dark theme, with the application's own colors for its header.

Proposal:

  • theme.css reads the theme properties, with the current colors as fallbacks: the overlay dims with --wicket-theme-veil, the dialog takes --wicket-theme-surface, --wicket-theme-text and --wicket-theme-border, and its color scheme follows --wicket-theme-color-scheme, so form controls inside a dark-themed dialog are dark too.
  • Optional classes for the usual parts of a dialog (a header in the theme's primary colors, like a table header or the title bar of a FloatingPanel, a body and a footer), so a dialog content panel gets the themed look by using them, without CSS of its own.
  • As for the other themed components: the properties are only set inside a theme class, so an application that does not use a theme sees no change, and no inline style is needed, so it keeps working under a strict Content Security Policy.
  • The modal dialog example gets a theme drop-down, like the DynamicDataTable example.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions