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;
}
Solved! Go to 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;
}
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;
}
Robert,
I tried with the above one but still does not change any thing. Any idea?
Thanks,
Irfan
Worked perfect for me...
Robert,
You are right! Refreshing app multiple time got it work. Thanks a lot!