<div>
    <div id="legend-btn-border" class="map-btn-border" tooltip-placement="left" tooltip-append-to-body="true"
         tooltip="{{'toggle_legend' | translate}}">
        <div id="legend-btn" ng-click="toggleLegend()">
            <i class="glyphicon glyphicon-list-alt"></i>
        </div>
    </div>
    <div id="legend-container" class="panel">
        <div id="legend-panel" class="panel collapse legend-panel-body">
            <div id="legend-title-heading" class="panel-heading">
                <div class="legend-panel-title pull-left" id="legend-title-text" translate="legend_title"></div>
                <i class="glyphicon glyphicon-remove legend-panel-title pull-right" ng-click="toggleLegend()"></i>
            </div>
            <div class="panel in legend-panel-body" ng-repeat="layer in mapService.getLayers();">
                <div class="panel-heading legend-item-header" data-toggle="collapse"
                    data-target="{{'#' + layer.get('metadata').uniqueID + 'legend'}}">{{layer.get('metadata').config.titleAlias || layer.get('metadata').title}}
                </div>
                <div class="panel-collapse legend-item in legend-panel-body" id="{{layer.get('metadata').uniqueID + 'legend'}}">
                    <img ng-src="{{getLegendUrl(layer)}}">
                </div>
            </div>
        </div>
    </div>
</div>

<div>
    <div id="legend-btn-border" class="map-btn-border" tooltip-placement="left" tooltip-append-to-body="true"
         tooltip="{{'toggle_legend' | translate}}">
        <div id="legend-btn" ng-click="toggleLegend()">
            <i class="glyphicon glyphicon-list-alt"></i>
        </div>
    </div>
    <div id="legend-container" class="panel">
        <div id="legend-panel" class="panel collapse legend-panel-body">
            <div id="legend-title-heading" class="panel-heading">
                <div class="legend-panel-title pull-left" id="legend-title-text" translate="legend_title"></div>
                <i class="glyphicon glyphicon-remove legend-panel-title pull-right" ng-click="toggleLegend()"></i>
            </div>
            <div class="panel in legend-panel-body" ng-repeat="layer in mapService.getStoryLayers();">
                <div class="panel-heading legend-item-header" data-toggle="collapse"
                    data-target="{{'#' + layer.get('metadata').uniqueID + 'legend'}}">{{layer.get('metadata').config.titleAlias || layer.get('metadata').title}}
                </div>
                <div class="panel-collapse legend-item in legend-panel-body" id="{{layer.get('metadata').uniqueID + 'legend'}}">
                    <img ng-src="{{getLegendUrl(layer)}}">
                </div>
            </div>
        </div>
    </div>
</div>

Fix the legend so it matches the sidebar with getStoryLayers()
Fix the legend so it matches the sidebar with getStoryLayers()
