<div class="settings_modal_wrap modal_content_wrap" my-modal-position>

  <a class="modal-close-button" ng-click="$close()"><i></i></a>

  <div class="modal-body">

    <div class="user_modal_photo_profile_wrap">

      <div class="user_modal_image_wrap pull-left">
        <img
          class="user_modal_image"
          my-load-thumb
          thumb="photo"
        />
      </div>

      <div class="user_modal_info_wrap clearfix">
        <h4 class="user_modal_header" ng-bind-html="profile.rFullName"></h4>
        <p class="user_modal_status" ng-bind="profile | userStatus"></p>

        <div class="user_modal_actions_wrap clearfix">
          <span class="btn btn-primary user_modal_main_btn" ng-if="!photo.updating">
            <input my-file-upload  type="file" multiple="false" class="im_attach_input" size="120" multiple="false" accept="image/x-png, image/png, image/gif, image/jpeg" />
            Set profile photo
          </span>
          <span class="btn btn-primary user_modal_main_btn disabled" disabled ng-if="photo.updating">
            Updating<span my-loading-dots></span>
          </span>

          <div class="dropdown user_modal_other_btn">
            <button class="btn btn-link dropdown-toggle">More<i class="icon icon-caret"></i></button>
            <ul class="dropdown-menu">
              <li ng-if="photo.location">
                <a ng-click="deletePhoto()">Delete profile photo</a>
              </li>
              <li>
                <a ng-click="editProfile()">Edit profile</a>
              </li>
              <li>
                <a ng-click="terminateSessions()">Terminate all sessions</a>
              </li>
            </ul>
          </div>

        </div>
      </div>

    </div>

    <div class="modal_section" ng-if="profile.phone">
      <h3 class="modal_section_header">Phone</h3>
      <div class="modal_section_body">
        <p><span ng-bind="profile.phone | phoneNumber"></span></p>
      </div>
    </div>

    <div class="modal_section">
      <h3 class="modal_section_header">Settings</h3>
      <div class="modal_section_body">

        <div class="tg_form_group">
          <a class="tg_checkbox" ng-click="notify.desktop = !notify.desktop" ng-class="notify.desktop ? 'tg_checkbox_on' : ''">
            <span class="icon icon-checkbox-outer"><i class="icon-checkbox-inner"></i></span>
            <span class="tg_checkbox_label">Desktop notifications</span>
          </a>

          <a class="tg_checkbox" ng-click="notify.sound = !notify.sound" ng-class="notify.sound ? 'tg_checkbox_on' : ''">
            <span class="icon icon-checkbox-outer"><i class="icon-checkbox-inner"></i></span>
            <span class="tg_checkbox_label">Sound</span>
          </a>
        </div>

        <div class="tg_form_group">
          <a class="tg_radio" ng-click="send.enter = 1" ng-class="send.enter == 1 ? 'tg_radio_on' : ''">
            <i class="icon icon-radio"></i>
            <span>
              <strong>Enter</strong> - send message, <strong>Shift + Enter</strong> - new line
            </span>
          </a>

          <a class="tg_radio" ng-click="send.enter = 0" ng-class="send.enter == 0 ? 'tg_radio_on' : ''">
            <i class="icon icon-radio"></i>
            <span>
              <strong>Ctrl + Enter</strong> - send message, <strong>Enter</strong> - new line
            </span>
          </a>
        </div>

      </div>
    </div>

    <div class="modal_section">
      <h3 class="modal_section_header">About</h3>
      <div class="modal_section_body">
        <p><strong>Webogram</strong> v0.0.21, <a href="https://github.com/zhukov/webogram" target="_blank">GitHub</a></p>
      </div>
    </div>

  </div>
</div>