gui/app/views/layout/sideNav.html

   1 <div class="naviSide">
   2
   3
   4
   5
   6     <ul class="nav bs-sidenav">
   7
   8         <div class="panel-group " role="tablist " aria-multiselectable="true " bs-collapse style="margin-bottom:0px; ">
   9             <div class="panel panel-default ">
  10                 <div class="panel-heading " role="tab ">
  11                     <h4 class="panel-title ">
  12                         <a bs-collapse-toggle style=" text-decoration: none;" ng-click="gotoProject();">
  13         Project
  14         </a>
  15                     </h4>
  16
  17                 </div>
  18
  19             </div>
  20         </div>
  21         <div class="panel-group" role="tablist" aria-multiselectable="true" bs-collapse style="margin-bottom:0px;" ng-model="activeStatus">
  22             <div class="panel panel-default">
  23                 <div class="panel-heading" role="tab">
  24                     <h4 class="panel-title">
  25                         <a bs-collapse-toggle style=" text-decoration: none;">
  26                             <div style="display:inline;" ng-click="gotoEnviron()">Environment </div>
  27                             <i class="fa fa-sort-asc" aria-hidden="true" style="margin-left: 71px;display:inline" ng-show="activeStatus==0"></i>
  28                             <i class="fa fa-sort-desc" aria-hidden="true" style="margin-left: 71px;display:inline" ng-show="activeStatus==-1"></i>
  29                         </a>
  30                     </h4>
  31                 </div>
  32                 <div class="panel-collapse" role="tabpanel" bs-collapse-target>
  33                     <div class="panel-body" style="border-top: 2px solid grey;text-align: right;cursor:pointer" ng-click="gotoOpenrcPage()" ng-class="{active:$state.includes('app.environmentDetail')}">
  34                         Openrc
  35                     </div>
  36                     <div class="panel-body " style="border:none;text-align: right;cursor:pointer" ng-click="gotoUploadPage()" ng-class="{active:$state.includes('app.uploadImage')}">
  37                         Image
  38                     </div>
  39                     <div class="panel-body " style="border:none;text-align: right;cursor:pointer" ng-click="gotoPodPage()" ng-class="{active:$state.includes('app.podUpload')}">
  40                         Pod File
  41                     </div>
  42                     <div class="panel-body " style="border:none;text-align: right;cursor:pointer" ng-click="gotoContainerPage()" ng-class="{active:$state.includes('app.container')}">
  43                         Container
  44                     </div>
  45                     <div class="panel-body " style="border:none;text-align: right;">
  46                         Others
  47                     </div>
  48                 </div>
  49             </div>
  50         </div>
  51
  52         <div class="panel-group " role="tablist " aria-multiselectable="true " bs-collapse style="margin-bottom:0px; ">
  53             <div class="panel panel-default ">
  54                 <div class="panel-heading " role="tab ">
  55                     <h4 class="panel-title ">
  56                         <a bs-collapse-toggle style=" text-decoration: none;" ng-click="gotoTestcase()">
  57          Test Case
  58         </a>
  59                     </h4>
  60
  61                 </div>
  62
  63             </div>
  64         </div>
  65
  66         <div class="panel-group " role="tablist " aria-multiselectable="true " bs-collapse style="margin-bottom:0px; ">
  67             <div class="panel panel-default ">
  68                 <div class="panel-heading " role="tab ">
  69                     <h4 class="panel-title ">
  70                         <a bs-collapse-toggle style=" text-decoration: none;" ng-click="gotoSuite()">
  71         Test Suite
  72         </a>
  73                     </h4>
  74
  75                 </div>
  76
  77             </div>
  78         </div>
  79
  80
  81
  82     </ul>
  83
  84
  85
  86
  87
  88 </div>
  89
  90
  91 <style>
  92     .bs-sidenav {
  93         margin-top: 21px;
  94         margin-bottom: 20px;
  95         width: 124px;
  96     }
  97
  98     .naviSide {
  99         height: 150%;
 100     }
 101
 102     .nav {
 103         margin-bottom: 0;
 104         padding-left: 0;
 105         list-style: none;
 106     }
 107
 108     .nav>li {
 109         position: relative;
 110         display: block;
 111     }
 112
 113     li {
 114         display: list-item;
 115         text-align: -webkit-match-parent;
 116     }
 117
 118     a {
 119         cursor: pointer;
 120     }
 121
 122     a.active {
 123         background-color: #EEEEEE;
 124         border-radius: 5px;
 125         width: 165px;
 126     }
 127     /*
 128     a:hover {
 129         width: 165px;
 130     }*/
 131
 132     .nav>li>a:hover,
 133     .nav>li>a:focus {
 134         text-decoration: underline;
 135         background-color: transparent;
 136     }
 137
 138     .active.panel-body {
 139         background-color: #dfe3e4;
 140     }
 141 </style>