Information This site is moving

The Pattern Library is moving to its new home on the Summit design system site.

Go to the Summit site
Pattern Library (ver. 2)

Map

Map

Skip map

Map skip anchor

Code


<p>
    <a class="map-skip" href="#ESRIMapSkip">Skip map</a>
</p>
<button id="ESRIMapDataShowHideButton" type="button" class="cui btn-sm utility-btn" aria-expanded="false" style="margin-bottom: 10px;">
    <span id="ESRIMapDataShowHideButtonIcon" class="cicon-minus" aria-hidden="true">
        <xsl:text> </xsl:text>
    </span>
    <span id="ESRIMapDataShowHideButtonText">
        Hide data panel
    </span>
</button>
<div id="ESRIMapContainer" class="map-container">
    <div class="row">
        <div id="ESRIMapData" class="map-data col-md-4">
            <button id="ESRIMapDataButton" type="button" class="map-data-button cui btn-sm utility-btn" aria-expanded="false" style="display: none;">
                <span class="cicon-angle-left" aria-hidden="true">
                    <xsl:text> </xsl:text>
                </span>
                View full items list
            </button>
            <div id="ESRIMapDataAll" class="map-data-all">
                <xsl:text> </xsl:text>
            </div>
        </div>
        <div class="col-md-8">
            <div id="ESRIMap" class="map" aria-labelledby="ESRIMapTitle">
                <xsl:text> </xsl:text>
            </div>
        </div>
    </div>
</div>
<a id="ESRIMapSkip" style="font-size: 0;">Map skip anchor</a>