sunrise-cms/public/html/contract-editInterment.html

<div class="modal" role="dialog">
  <div class="modal-background"></div>
  <div class="modal-card">
    <header class="modal-card-head">
      <h3 class="modal-card-title">
        Update <span class="alias" data-alias="Occupant"></span>
      </h3>
      <button
        class="delete is-close-modal-button"
        aria-label="close"
        type="button"
      ></button>
    </header>
    <section class="modal-card-body">
      <form id="form--contractOccupantEdit">
        <input
          id="contractOccupantEdit--contractId"
          name="contractId"
          type="hidden"
          value=""
        />
        <input
          id="contractOccupantEdit--lotOccupantIndex"
          name="lotOccupantIndex"
          type="hidden"
          value=""
        />
        <label class="label" for="contractOccupantEdit--lotOccupantTypeId"
          ><span class="alias" data-alias="Occupant"></span> Type</label
        >
        <div class="field has-addons">
          <div class="control is-expanded">
            <div class="select is-fullwidth">
              <select
                id="contractOccupantEdit--lotOccupantTypeId"
                name="lotOccupantTypeId"
                required
              ></select>
            </div>
          </div>
          <div class="control">
            <span class="button is-static" id="contractOccupantEdit--fontAwesomeIconClass"></span>
          </div>
        </div>
        <div class="columns mt-2 mb-0">
          <div class="column">
            <div class="field">
              <label class="label" for="contractOccupantEdit--occupantName"
                ><span class="alias" data-alias="Occupant"></span> Name</label
              >
              <div class="control">
                <input
                  class="input"
                  id="contractOccupantEdit--occupantName"
                  name="occupantName"
                  type="text"
                  maxlength="200"
                  autocomplete="off"
                  required
                />
              </div>
            </div>
          </div>
          <div class="column">
            <div class="field">
              <label class="label" for="contractOccupantEdit--occupantFamilyName"
                >Family Name</label
              >
              <div class="control">
                <input
                  class="input"
                  id="contractOccupantEdit--occupantFamilyName"
                  name="occupantFamilyName"
                  type="text"
                  maxlength="200"
                  autocomplete="off"
                />
              </div>
            </div>
          </div>
        </div>
        <div class="field">
          <label class="label" for="contractOccupantEdit--occupantAddress1"
            >Address</label
          >
          <div class="control">
            <input
              class="input"
              id="contractOccupantEdit--occupantAddress1"
              name="occupantAddress1"
              type="text"
              maxlength="50"
              placeholder="Line 1"
              autocomplete="off"
            />
          </div>
        </div>
        <div class="field">
          <div class="control">
            <input
              class="input"
              id="contractOccupantEdit--occupantAddress2"
              name="occupantAddress2"
              type="text"
              maxlength="50"
              placeholder="Line 2"
              aria-label="Address Line 2"
              autocomplete="off"
            />
          </div>
        </div>
        <div class="columns">
          <div class="column">
            <div class="field">
              <label class="label" for="contractOccupantEdit--occupantCity"
                >City</label
              >
              <div class="control">
                <input
                  class="input"
                  id="contractOccupantEdit--occupantCity"
                  name="occupantCity"
                  type="text"
                  maxlength="20"
                />
              </div>
            </div>
          </div>
          <div class="column">
            <div class="field">
              <label
                class="label"
                for="contractOccupantEdit--occupantProvince"
                >Province</label
              >
              <div class="control">
                <input
                  class="input"
                  id="contractOccupantEdit--occupantProvince"
                  name="occupantProvince"
                  type="text"
                  maxlength="2"
                />
              </div>
            </div>
          </div>
          <div class="column">
            <div class="field">
              <label
                class="label"
                for="contractOccupantEdit--occupantPostalCode"
                >Postal Code</label
              >
              <div class="control">
                <input
                  class="input"
                  id="contractOccupantEdit--occupantPostalCode"
                  name="occupantPostalCode"
                  type="text"
                  maxlength="7"
                  autocomplete="off"
                />
              </div>
            </div>
          </div>
        </div>
        <div class="columns">
          <div class="column">
            <label
              class="label"
              for="contractOccupantEdit--occupantPhoneNumber"
              >Phone Number</label
            >
            <div class="field">
              <div class="control has-icons-left">
                <input
                  class="input"
                  id="contractOccupantEdit--occupantPhoneNumber"
                  name="occupantPhoneNumber"
                  type="text"
                  maxlength="30"
                  autocomplete="off"
                />
                <span class="icon is-small is-left">
                  <i class="fas fa-phone" aria-hidden="true"></i>
                </span>
              </div>
            </div>
          </div>
          <div class="column">
            <label
              class="label"
              for="contractOccupantEdit--occupantEmailAddress"
              >Email Address</label
            >
            <div class="field">
              <div class="control has-icons-left">
                <input
                  class="input"
                  id="contractOccupantEdit--occupantEmailAddress"
                  name="occupantEmailAddress"
                  type="email"
                  maxlength="200"
                  autocomplete="off"
                />
                <span class="icon is-small is-left">
                  <i class="fas fa-envelope" aria-hidden="true"></i>
                </span>
              </div>
            </div>
          </div>
        </div>
        <div class="field">
          <label
            class="label"
            id="contractOccupantEdit--occupantCommentTitle"
            for="contractOccupantEdit--occupantComment"
            >Comment</label
          >
          <div class="control">
            <textarea
              class="textarea"
              id="contractOccupantEdit--occupantComment"
              name="occupantComment"
            ></textarea>
          </div>
        </div>
      </form>
    </section>
    <footer class="modal-card-foot justify-right">
      <button
        class="button is-success"
        type="submit"
        form="form--contractOccupantEdit"
      >
        <span class="icon"><i class="fas fa-plus" aria-hidden="true"></i></span>
        <span>Update <span class="alias" data-alias="Occupant"></span></span>
      </button>
      <button class="button is-close-modal-button" type="button">Cancel</button>
    </footer>
  </div>
</div>