IBX-12056: Applied dark mode to the preview header, kept popups light

[tischsoic]

🎫 Issue	IBX-12056

Related PRs:

• IBX-12056: Added scoped dark mode mechanism and dark Button variants design-system#126 — must be merged first; adds the dark mode mechanism this PR relies on
• https://github.com/ibexa/page-builder/pull/570 — Page Builder / Dashboard Builder / Form Builder menu bar
• https://github.com/ibexa/form-builder/pull/246 — form builder modal header
• https://github.com/ibexa/image-editor/pull/137 — image editor header

Description:

Two changes, both using the design system's new --ids-mode flag.

Content preview header — flagged as a dark surface, so the design system buttons it contains (the "Close" link-button and the device switcher) use their dark variants:

.ibexa-preview-header {
    --ids-mode: dark;
    ...
}

Extra actions and popup menus — these are white panels that are frequently rendered inside a dark container: the Page Builder menu bar hosts both the "Send to review" and "Publish later" extra-action panels in its own DOM subtree. Since --ids-mode inherits, they would pick up the dark styling and render white buttons on their white background. Both now assert light mode explicitly:

.ibexa-extra-actions {
    --ids-mode: light;
    ...
}

.ibexa-popup-menu {
    --ids-mode: light;
    ...
}

This is a general safeguard rather than a fix for one page — any future dark surface hosting these panels gets the correct behaviour for free. Popup menus that are moved to document.body on init (the multilevel popup menu, the image editor's save menu) never inherited the flag in the first place, but the declaration keeps them correct if that ever changes.

For QA:

Content preview — preview a content item; the dark header's "Close" button should be white text on a light-neutral border, and the device switcher icons white. Check hover and focus.

Popups on a dark surface — edit a Landing Page draft, then in the dark Page Builder menu bar open "Send to review" and the "Publish" chevron → "Publish later". Both panels must stay white with dark text and dark-on-white buttons.

Regression: extra-action panels and popup menus on ordinary light pages (e.g. Create buttons on list pages, context menus) must be unchanged.

Documentation:

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud