<div class="container-fluid users-container">

    <!--   <label for="err" id="err" class="modal-err-msg">{{errMsg}}</label> -->

        <h1>{{ formTitle }}</h1>
        <form [formGroup]="userForm"
          (ngSubmit)="onSubmit(userForm.value)"
          class="ui form"
          [class.error]="!userForm.valid && userForm.touched">

            <div class="row">
                <div class="col-xs-12">
                    <div class="search-form-group">
                        <label for="category" class="search-input-label">Skill Category</label>
                        <input type="text"  id="category" class="search-input" placeholder="Enter" formControlName="category" required>
                    </div>
                  </div>
            </div>
            <div class="row">
              <div class="col-xs-12">
                <div class="search-form-group">
                    <label for="master" class="search-input-label">Skill Master</label>
                    <input type="text"  id="master" class="search-input" placeholder="Enter" formControlName="master" required>
                </div>
              </div>
            </div>
            <div class="row">
              <div class="col-xs-12">
                <div class="search-form-group">
                    <label for="skills" class="search-input-label">Skills</label>
                    <input type="text"  id="skills" class="search-input" placeholder="Enter" formControlName="skills" required>
                    <div class="btn-role-add">
                      <a (click)="addSkill()">
                        <img src="{{img_path + 'add_button_orange.png'}}">
                      </a>
                    </div>
                </div>
              </div>
            </div>
            <div class="row">
              <div class="col-xs-12">
                <div class="search-form-group">
                  <div *ngFor="let skill of skills; let i = index" class="skills">
                    <p>{{skill}}</p>
                    <div class="btn-skill-remove" (click)="skills.splice(i,1)">x</div>
                  </div>
                </div>
              </div>
            </div>
            <button *ngIf="!editForm" type="submit" class="btn btn-add" >ADD</button>
            <button *ngIf="editForm" type="submit" class="btn btn-update" >UPDATE</button>
        </form>
      </div>
