<div class="WorkflowControls-ZoomToFit">
    <i class="fa fa-desktop" ng-click="zoomToFit()"></i>
</div>
<div class="WorkflowControls-Zoom">
    <div class="WorkflowControls-Zoom--button WorkflowControls-Zoom--minus" ng-click="zoomOut()">
        <i class="fa fa-minus" aria-hidden="true"></i>
    </div>
    <div class="WorkflowControls-zoomSlider">
        <div class="WorkflowControls-zoomPercentage">{{zoom}}%</div>
        <div id="slider"></div>
    </div>
    <div class="WorkflowControls-Zoom--button WorkflowControls-Zoom--plus" ng-click="zoomIn()">
        <i class="fa fa-plus" aria-hidden="true"></i>
    </div>
</div>
<div class="WorkflowControls-Pan">
    <i class="fa fa-caret-up WorkflowControls-Pan--button WorkflowControls-Pan--up" ng-click="pan('up')"></i>
    <i class="fa fa-caret-down WorkflowControls-Pan--button WorkflowControls-Pan--down" ng-click="pan('down')"></i>
    <i class="fa fa-caret-left WorkflowControls-Pan--button WorkflowControls-Pan--left" ng-click="pan('left')"></i>
    <i class="fa fa-caret-right WorkflowControls-Pan--button WorkflowControls-Pan--right" ng-click="pan('right')"></i>
    <i class="fa fa-home WorkflowControls-Pan--button WorkflowControls-Pan--home" ng-click="reset()"></i>
</div>
