ui/src/main/webapp/app/BluvalUI/RegisterTimeslot/RegisterTimeslotTemplate.html

   1 <!--
   2 Copyright (c) 2019 AT&T Intellectual Property. All rights reserved.
   3
   4 Licensed under the Apache License, Version 2.0 (the "License");
   5 you may not use this file except in compliance with the License.
   6 You may obtain a copy of the License at
   7
   8        http://www.apache.org/licenses/LICENSE-2.0
   9
  10 Unless required by applicable law or agreed to in writing, software
  11 distributed under the License is distributed on an "AS IS" BASIS,
  12 WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13 See the License for the specific language governing permissions and
  14 limitations under the License.
  15 -->
  16
  17 <div id="page-content" class="content" style="padding: 25px;">
  18     <style>
  19 $
  20 melon
  21 :
  22
  23 #F97D75
  24
  25  ; $ black
  26 :
  27
  28 #2E3641
  29
  30  ; *
  31
  32 button {
  33     background-color: $melon;
  34     border: 0;
  35     padding: 8px 20px;
  36     color: white;
  37     text-transform: uppercase;
  38     cursor: pointer;
  39     &:
  40     focus
  41     ,
  42     &
  43     :
  44     active
  45     {
  46
  47
  48
  49
  50
  51
  52     outline
  53     :
  54
  55
  56
  57
  58
  59
  60     0;
  61 }
  62
  63 }
  64 ul.ul-timeslot {
  65     list-style: none;
  66     padding-left: 0;
  67     margin-top: 25px;
  68 }
  69
  70 li.li-timeslot {
  71     border: 1px solid black;
  72     display: inline-block;
  73     padding: 5px 10px;
  74     margin-right: 5px;
  75     margin-bottom: 5px;
  76     text-transform: capitalize;
  77 }
  78
  79 .fa-close {
  80     cursor: pointer;
  81 }
  82 </style>
  83     <div>
  84         <h1 class="heading-page">Register Timeslot</h1>
  85
  86         <div class="Column">
  87             <div class="form-row">
  88                 <label for="textinputID-3a">Define start date
  89                     and time : </label> <input ng-model="definedStart" readonly></input>
  90             </div>
  91         </div>
  92         <br>
  93
  94         <div>
  95             <div class="form-row">
  96                 <label for="textinputID-3a">Select Lab: </label> <select
  97                     ng-model="selectedLab"
  98                     ng-change="selectedLabChange()"
  99                     ng-options="v for v in labs">
 100                 </select>
 101             </div>
 102         </div>
 103         <br>
 104
 105         <div>
 106             <div class="form-row">
 107                 <label for="textinputID-3a">Add Blueprint
 108                     Instance: </label> <select
 109                     ng-model="selectedDeclerativeInst"
 110                     ng-change="selectedDeclerativeInstChange()"
 111                     ng-options="v for v in declerativeInsts">
 112                 </select>
 113                 <button ng-disabled="!selectedDeclerativeInst"
 114                     ng-click="addInst(selectedDeclerativeInst)">Add</button>
 115             </div>
 116         </div>
 117         <br>
 118
 119         <ul class="ul-timeslot">
 120             <li ng-repeat="inst in insts" class="li-timeslot"><span
 121                 ng-click="deleteInst($index)"><i
 122                     class="fa fa-close"></i></span> {{inst}}</li>
 123         </ul>
 124
 125         <div ng-show="loadingLabs || loadingBlueprintInstances">
 126             <img src=" static/fusion/images/giphy.gif" />
 127         </div>
 128
 129         <div class="fn-ebz-container"
 130             style="position: relative; top: 25px;">
 131             <button href="javascript:void(0)" id="addbtn"
 132                 style="bottom: -17px;" size="small"
 133                 att-accessibility-click="13,32"
 134                 class="btn btn-alt btn-small" ng-click="register();">Register</button>
 135         </div>
 136     </div>
 137 </div>