Notes

Notes are added by users, and can be combined with system-activity to show a timeline of what's going on. If needed, we can add a filter to the top of the page where people can choose to exclude certain updates/activity.

    Usage

    WO

    Add new note

    Use this notes field to communicate with your colleagues or your future-self.

    WO

    New comment added 4h ago by AppSignal

    Lorem ipsum dolor sit amet consectetur adipisicing elit. Expedita, hic? Commodi cumque similique id tempora molestiae deserunt at suscipit, dolor voluptatem, numquam, harum consequatur laboriosam voluptas tempore aut voluptatum alias? edit

    AS

    Incident state changed 4h ago by AppSignal

    Issue is now marked as open

    AS

    Incident state changed 4h ago by AppSignal

    Issue is now marked as closed

    AS

    Issue sent to Github 4h ago by Jeroen van Baarsen

    Issue #1231 was created in Github. View issue 

    <div class="c-box p-5 flex space-x-4">
  <span class="c-avatar c-avatar--lg">WO</span>
  <div class="flex-1 space-y-3">
    <header>
      <h2 class="font-medium">Add new note</h2>
      <p class="text-gray-700">Use this notes field to communicate with your colleagues or your future-self.</p>
    </header>
    <div class="c-textarea">
      <textarea rows="4" class="c-textarea__input" placeholder="Placeholder"></textarea>
    </div>
    <div class="flex items-center space-x-4">
      <button class="c-button c-button--sm">Add note</button>
      <label>
        <input type="checkbox" />
        Pin as solution
      </label>
    </div>
  </div>
</div>

<div class="c-button-group mb-5">
  <button class="c-button-group__item c-button c-button--sm c-button--white">
    All (211)
  </button>
  <button class="c-button-group__item c-button c-button--sm c-button--white c-button--white-inactive">
    Notes (4)
  </button>
  <button class="c-button-group__item c-button c-button--sm c-button--white c-button--white-inactive">
    State changes (12)
  </button>
  <button class="c-button-group__item c-button c-button--sm c-button--white c-button--white-inactive">
    Integrations (186)
  </button>
  <button class="c-button-group__item c-button c-button--sm c-button--white c-button--white-inactive">
    Notifiers (11)
  </button>
</div>

<div class="c-box p-5 flex space-x-4">
  <span class="c-avatar c-avatar--lg">WO</span>
  <div class="flex-1 space-y-3">
    <h2 class="flex justify-between">
      <b class="font-medium">New comment added</b>
      <span class="text-gray-700">4h ago by <a href="#" class="text-blue onderline">AppSignal</a></span>
    </h2>
    <p class="c-message">
      Lorem ipsum dolor sit amet consectetur adipisicing elit. Expedita, hic? Commodi cumque similique id tempora molestiae deserunt at suscipit, dolor voluptatem, numquam, harum consequatur laboriosam voluptas tempore aut voluptatum alias? <a href="#" class="text-blue underline">edit</a>
    </p>
  </div>
</div>

<div class="c-box p-5 flex space-x-4">
  <span class="c-avatar c-avatar--lg">AS</span>
  <div class="flex-1 space-y-3">
    <h2 class="flex justify-between">
      <b class="font-medium">Incident state changed</b>
      <span class="text-gray-700">4h ago by <a href="#" class="text-blue onderline">AppSignal</a></span>
    </h2>
    <p class="c-message c-message--red text-red-700">
      Issue is now marked as <b class="font-medium">open</b>
    </p>
  </div>
</div>

<div class="c-box p-5 flex space-x-4">
  <span class="c-avatar c-avatar--lg">AS</span>
  <div class="flex-1 space-y-3">
    <h2 class="flex justify-between">
      <b class="font-medium">Incident state changed</b>
      <span class="text-gray-700">4h ago by <a href="#" class="text-blue onderline">AppSignal</a></span>
    </h2>
    <p class="c-message c-message--green text-green-700">
      Issue is now marked as <b class="font-medium">closed</b>
    </p>
  </div>
</div>

<div class="c-box p-5 flex space-x-4">
  <span class="c-avatar c-avatar--lg">AS</span>
  <div class="flex-1 space-y-3">
    <h2 class="flex justify-between">
      <b class="font-medium">Issue sent to Github</b>
      <span class="text-gray-700">4h ago by <a href="#" class="text-blue underline">Jeroen van Baarsen</a></span>
    </h2>
    <p class="c-message">
      Issue #1231 was created in Github. <a href="#" class="text-blue">View issue</a>
    </p>
  </div>
</div>
    Show more