Jewelry Box on screen widgets icon in mobile view

[James_001]

Hi all, 

I am trying to add css rules for mobile view of on screen widgets in Jewelry Box theme of WAB 2.7.

I added these css rules in G:\WebAppBuilderForArcGIS\server\apps\24\jimu.js\css\jimu-theme.css. 

They are not working here!

These rules are define in Launchpad theme from jimu-theme.css

.is-mobile .jimu-widget-placeholder {
  width: 30px !important;
  height: 30px !important;
}
.is-mobile .jimu-widget-placeholder .inner {
  width: 16px;
  height: 16px;
  margin: 6px;
  line-height: 16px;
}
.is-mobile .jimu-widget-onscreen-icon {
  width: 30px !important;
  height: 30px !important;
}
.is-mobile .jimu-widget-onscreen-icon img {
  width: 14px;
  height: 14px;
  margin: 8px;
}‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

[RobertScheitlin__GISP · Accepted solution]

Irfan,

   The css rules should be:

.jimu-ismobile .jimu-widget-placeholder {
  width: 30px !important;
  height: 30px !important;
}
.jimu-ismobile .jimu-widget-placeholder .inner {
  width: 16px;
  height: 16px;
  margin: 6px;
  line-height: 16px;
}
.jimu-ismobile .jimu-widget-onscreen-icon {
  width: 30px !important;
  height: 30px !important;
}
.jimu-ismobile .jimu-widget-onscreen-icon img {
  width: 14px;
  height: 14px;
  margin: 8px;
}‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

[James_001]

Robert,

I tried with the above one but still does not change any thing. Any idea?

Thanks,

Irfan

[RobertScheitlin__GISP]

Worked perfect for me...

[James_001]

Robert,

You are right! Refreshing app multiple time got it work. Thanks  a lot!