Geocoder and other widget popup colors

4152
13
Jump to solution
05-30-2015 09:12 AM
JeffWard
Occasional Contributor III

Hello again AppBuilders,

I thought I had seen this question answered already but I couldn't find it.  The geocoder results popup - I can't find where to change the color of the title pane.  I deleted the following entry in the style.css file in \stemapp\widgets\Geocoder\css\ folder.

.esriPopup .titlePane {
  background-color: #5491B8;
  border-color: #777777;
}

And I added my own entry in the style.css in my custom style I created that matches my organization's color scheme.  I thought this css entry would override anything else.  Here is my entry in that file:

.jimu-widget-geocoder .esriPopup .titlePane{
  background-color: #6f2a2a;
  border-color: #777777;
}

I tried it without the jimu-widget-geocoder reference and that didn't work either.

Any help would be much appreciated.

Thanks,

Jeff Ward

Jeff Ward
Summit County, Utah
0 Kudos
13 Replies
RobertScheitlin__GISP
MVP Emeritus

Jeff,

   Once I saw that the element had the class 'blueTheme' and I knew that I did not apply it I just did a text search in the files to find that text. I use Brackets as my IDE and I can search all files in my workspace folders for a string.

JeffWard
Occasional Contributor III

I really appreciate everyone's input.  I'm grateful for your tolerance for such rookie questions.  I have downloaded Brackets and will be trying that out.  My search method using the windows search wasn't cutting it.

Thanks Robert Scheitlin, GISP​, Stan McShinsky​ and Larry Stout​.

Jeff Ward
Summit County, Utah
RobertScheitlin__GISP
MVP Emeritus

Jeff,

   This is what I did in my app.

  1. In the Geocoder widgets widget.js @ line 501 I commented out the 'class': 'blueTheme'
  2. In my custom theme color style.css I added

.esriPopup .titlePane {

  background-color: #5a6b4d;

  border-color: #777;

}

JeffWard
Occasional Contributor III

Thanks again Robert.

Jeff Ward
Summit County, Utah
0 Kudos