nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Enable mobile popup/infowindow for tablet Web AppBuilder

CodyBarrett1

I'm trying to avoid using mediaqueries in my CSS. I've scoured the internet trying to find out how to enable a mobile popup for a tablet in Web AppBuilder. Has anyone accomplished this?

Find more posts tagged with

Accepted answers

RobertScheitlin__GISP

You can also Change the breakPoints in the main.js file

All comments

RobertScheitlin__GISP

Don't forget to mark this question as answered by clicking on the "Correct Answer" link on the reply that answered your question.

RobertScheitlin__GISP

You can also Change the breakPoints in the main.js file

CodyBarrett1

Beautiful! That is exactly what I was searching for. I'm actually using WAB version 1.2(plan to upgrade), so mobileBreakPoint did not exist. However, there is a "widthBreaks" property that I changed.

jimuConfig <SPAN class="operator token">=</SPAN> lang<SPAN class="punctuation token">.</SPAN><SPAN class="token function">mixin</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>
loadingId<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">'main-loading'</SPAN><SPAN class="punctuation token">,</SPAN>
layoutId<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">'jimu-layout-manager'</SPAN><SPAN class="punctuation token">,</SPAN>
mapId<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">'map'</SPAN><SPAN class="punctuation token">,</SPAN>
mainPageId<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">'main-page'</SPAN><SPAN class="punctuation token">,</SPAN>
timeout<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">5000</SPAN><SPAN class="punctuation token">,</SPAN>
widthBreaks<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">[</SPAN><SPAN class="number token">800</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">1280</SPAN><SPAN class="punctuation token">]</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN> jimuConfig<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

Thanks Robert for your very quick response!

RobertScheitlin__GISP

Cody,

You can set the mobile break point in the url:

Use URL parameters—Web AppBuilder for ArcGIS | ArcGIS |Mobile Break Point

Join the Conversation

Signed in members can post, follow updates, and more. New here? Register a free account.

Quick Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.