penpot/frontend/resources/styles/main/partials/activity-bar.scss

// This Source Code Form is subject to the terms of the Mozilla Public
// License, v. 2.0. If a copy of the MPL was not distributed with this
// file, You can obtain one at http://mozilla.org/MPL/2.0/.
//
// Copyright (c) KALEIDOS INC

.activity-bar {
  background-color: $color-gray-50;
  bottom: 0;
  height: 100%;
  position: fixed;
  right: 0;
  width: 250px;

  .activity-bar-inside {
    align-items: center;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    padding-top: 70px;
  }

  h4 {
    color: $color-gray-40;
    font-size: $fs16;
    font-weight: $fw700;
    margin-bottom: $size-1;
  }

  .date-ribbon {
    background-color: lighten($color-gray-20, 12%);
    color: $color-white;
    font-size: $fs12;
    font-weight: $fw700;
    padding: 2px;
    text-align: center;
    width: 100%;
  }

  .activity-input {
    border-bottom: 1px solid $color-gray-10;
    display: flex;
    font-size: $fs12;
    padding: $size-2;
    width: 100%;

    img.activity-author {
      border-radius: 50%;
      flex-shrink: 0;
      height: 30px;
      margin-right: $size-4;
      width: 30px;
    }

    .activity-content {
      display: flex;
      flex-direction: column;

      .activity-project {
        align-items: center;
        display: flex;
        flex-wrap: wrap;

        a {
          font-weight: $fw700;
          margin: 0 3px;
        }
      }

      .activity-time {
        color: $color-gray-20;
        font-size: $fs12;
        font-style: italic;
      }
    }
  }
}