Angular - Dual Routes

by abehnaz

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular-route.min.js"></script>
<div id="header">
    Header
</div>
<div id="wrapper">
    <div id="slider" ng-view>
        Slider
    </div>
    <div id="mainWindow" ng-view>
        Main window
    </div>
</div>

CSS

body {
    display: flex;
    min-height: 100vh; /*100% of vertical viewport height*/
    flex-direction: column;
}
#header {
    width:100%;
    height: 50px;
    background-color: #2980b9;
}
#wrapper {
    flex: 1;
    display: flex;
    flex-flow: row;
}
#slider {
    width: 200px;
    background-color: #d35400;
}
#mainWindow {
    flex:1;
    width: 300px;
    background-color: #27ae60;
}