openproject/frontend/app/templates/work_packages/activities/_user.html

<div class="work-package-details-activities-activity-contents"
     tabindex="0"
     aria-label="{{ activityLabelWithComment || activityLabel  }}"
     ng-mouseover="focus()"
     ng-mouseout="blur()">
  <div ng-if="userAvatar">
    <img class="avatar" ng-src="{{ userAvatar }}" alt="Avatar" title="{{userName}}" />
  </div>
  <span class="user" ng-if="userActive">
    <a ng-href="{{ userPath(userId) }}"
       name="{{ currentAnchor }}"
       aria-label="{{ userLabel }}"
       ng-bind="userName">
    </a>
  </span>
  <span class="user" ng-if="!userActive">{{ userName }}</span>
  <span class="date">{{ isInitial ? I18n.t('js.label_created_on') : I18n.t('js.label_updated_on') }} <op-date-time date-time-value="activity.props.createdAt" /></span>
  <div class="comments-number">
    <activity-link work-package="workPackage"
                   activity-no="activityNo"
                   ></activity-link>
    <div class="comments-icons"
         ng-show="activity.props._type == 'Activity::Comment' && (focussing() || accessibilityModeEnabled)">
      <accessible-by-keyboard ng-if="userCanQuote"
                              execute="quoteComment()"
                              link-title="{{ I18n.t('js.label_quote_comment') }}">
        <icon-wrapper icon-name="quote"
                      icon-title="{{ I18n.t('js.label_quote_comment') }}"
                      css-class="action-icon">
        </icon-wrapper>
      </accessible-by-keyboard>
      <accessible-by-keyboard ng-if="userCanEdit"
                              execute="editComment()"
                              link-title="{{ I18n.t('js.label_edit_comment') }}">
        <icon-wrapper icon-name="edit"
                      icon-title="{{ I18n.t('js.label_edit_comment') }}"
                      css-class="action-icon">
        </icon-wrapper>
      </accessible-by-keyboard>
    </div>
  </div>
  <span class="user-comment wiki">
    <div ng-if="inEdit">
      <div class="user-comment--form inplace-edit--write-value">
        <div class="textarea-wrapper" ng-class="{'-preview': inPreview}">
            <textarea wiki-toolbar
                      msd-elastic="\n"
                      class="edit-comment-text focus-input inplace-edit--textarea"
                      ng-hide="inPreview"
                      ng-model="activity.editedComment"
                      preview-toggle="toggleCommentPreview()"
                      required>
            </textarea>
            <div class="inplace-edit--preview" ng-if="inPreview">
              <span ng-bind-html="previewHtml"></span>
            </div>
        </div>
        <div class="inplace-edit--dashboard">
          <div class="inplace-edit--controls">
            <accessible-by-keyboard execute="updateComment()"
                                    ng-disabled="editCommentForm.$invalid"
                                    class="inplace-edit--control inplace-edit--control--save">
              <icon-wrapper icon-name="yes" icon-title="{{ I18n.t('js.button_save') }}">
              </icon-wrapper>
            </accessible-by-keyboard>
            <accessible-by-keyboard execute="cancelEdit()"
                                    class="inplace-edit--control inplace-edit--control--cancel">
              <icon-wrapper icon-name="close" icon-title="{{ I18n.t('js.button_cancel') }}">
              </icon-wrapper>
            </accessible-by-keyboard>
          </div>
        </div>
      </div>
    </div>
    <span ng-if="!inEdit"
          class="message"
          ng-show="activity.props._type == 'Activity::Comment'"
          ng-bind-html="postedComment"/>
    <ul class="work-package-details-activities-messages" ng-if="!isInitial">
      <li ng-repeat="detail in details track by $index">
        <span class="message" ng-bind-html="detail"/>
      </li>
    </ul>
  </span>
</div>