<md-dialog aria-label="Device Unreachable" md-theme="{{ ctrl.theme }}">
    <form ng-cloak>
        <md-toolbar>
            <div class="md-toolbar-tools">
                <h2 translate>deviceUnreachable.DEVICE_UNREACHABLE</h2>
                <span flex></span>
                <md-button class="button-small" ng-click="ctrl.close()">
                    <i class="material-icons">close</i>
                </md-button>
            </div>
        </md-toolbar>
        <md-dialog-content>
            <div class="md-dialog-content" ng-if="ctrl.highPriorityPushes">
                <h3 translate style="margin-bottom: 12px;">deviceUnreachable.UNABLE_TO_CONNECT</h3>
                <ul class="material-icons-list">
                    <li class="help">
                        <span translate>troubleshooting.PHONE_ONLINE</span>
                    </li>
                    <li class="help">
                        <span translate>troubleshooting.APP_STARTED</span>
                    </li>
                    <li class="help">
                        <span translate>troubleshooting.WEBCLIENT_ENABLED</span>
                    </li>
                    <li class="info">
                        <span translate>troubleshooting.UNLOCK_OR_CHARGE</span>
                    </li>
                    <li class="info">
                        <span translate>troubleshooting.PUSH_FAQ</span>
                    </li>
                </ul>
            </div>
            <div class="md-dialog-content" ng-if="!ctrl.highPriorityPushes">
                <p translate translate-values="{'faqUrl': 'https://three.ma/webios'}">troubleshooting.PLEASE_OPEN_AND_UNLOCK</p>
            </div>
        </md-dialog-content>
        <md-dialog-actions layout="row">
            <span flex></span>
            <md-button role="button" class="md-primary reload-btn" ng-click="ctrl.reload()" aria-labelledby="aria-label-reload">
                <span translate id="aria-label-reload">welcome.RESTART_SESSION</span>
            </md-button>
            <md-button ng-if="ctrl.canRetry" autofocus role="button" class="md-primary reload-btn circular-progress-button" ng-click="ctrl.retry()" ng-disabled="ctrl.retrying" aria-labelledby="aria-label-retry">
                <md-progress-circular ng-if="ctrl.retrying" md-mode="determinate" md-diameter="20" value="{{ctrl.progress}}"></md-progress-circular>
                <i ng-if="!ctrl.retrying" class="material-icons">refresh</i>
                <span translate id="aria-label-retry">welcome.RETRY</span>
            </md-button>
        </md-dialog-actions>
    </form>
</md-dialog>

