<ion-side-menus>
    <remove-main-nav></remove-main-nav>

    <ion-side-menu-content class="ipad-settings-container">
        <ion-nav-view name="settingsContent">

        </ion-nav-view>
    </ion-side-menu-content>

    <ion-side-menu side="left" width="350" expose-aside-when="large">
        <ion-header-bar class="bar-stable none-border">
            <div class="buttons">
                <a menu-close href="#/" class="button icon-left ion-chevron-left button-clear button-dark">{{'GoBack' | translate}}</a>
            </div>
            <h2 class="title">{{'MyStromSettings' | translate}}</h2>
        </ion-header-bar>
        <ion-content scroll="false">
            <div class="container-fluid">
                <div class="row-bootstrap tile-container">
                    <div ng-repeat="tile in settingsTiles" class="col-xs-12">

                        <div ng-class="{'active' : tile.deviceTypeId === activeSetting}" class="tile state-on settings-list"
                             on-tap="settingsChooser(tile.deviceTypeId)" on-hold="onHold()" on-release="onRelease(tile.deviceTypeId)"
                             ion-stop-event="tap">
                            <div class="tile-content">
                                <div class="name-container">
                                    <h2 class="no-top-padding">{{tile.name | translate}}</h2>
                                </div>

                                <ng-include src="'img/settings/'+tile.deviceTypeId+'.svg'"></ng-include>

                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </ion-content>
    </ion-side-menu>

</ion-side-menus>