topic Popup Themes in ArcGIS JavaScript Maps SDK Questions

Popup Themes

SarojThapa1 — Tue, 10 Jan 2017 17:27:43 GMT

What are the different types of built-in Popup themes other than dark and light?

var fill = new SimpleFillSymbol("solid", null, new Color("#A4CE67"));
var popup = new Popup({
fillSymbol: fill,
titleInBody: false
}, domConstruct.create("div"));

domClass.add(popup.domNode, "dark");

Re: Popup Themes

KellyHutchins — Sat, 11 Dec 2021 07:52:26 GMT

The Popup page in the API reference has a link to the css for that widget. If you search the css for the widget you can see that there are the light and dark themes and also a blueTheme.

https://developers.arcgis.com/javascript/3/jsapi/css/esri/dijit/css/Popup.css

Reviewing the css can also be helpful if you'd like to create your own theme. Just copy/paste the light or dark theme css to your app stylesheet and modify the colors to suit your needs. For example if I wanted to create a new theme called 'redTheme' that has a red title bar with white text I could add this to my app stylesheet.

.esriPopup.light .titlePane,
.dj_ie7 .esriPopup.light .titlePane .title,
.esriPopup.light .contentPane,
.esriPopup.light .actionsPane {
    background-color: #ff0000;
    color: #fff;
}‍‍‍‍‍‍‍

Re: Popup Themes

RobertScheitlin__GISP — Tue, 10 Jan 2017 17:34:18 GMT

Saroj,

The esri.css file only has light, dark and blueTheme. The blueTheme is a very limited theme.