client/src/app/shared/users/user-notifications.component.scss

   1 @import '_variables';
   2 @import '_mixins';
   3
   4 .no-notification {
   5   display: flex;
   6   justify-content: center;
   7   align-items: center;
   8   padding: 20px 0;
   9 }
  10
  11 .notification {
  12   display: flex;
  13   align-items: center;
  14   font-size: inherit;
  15   padding: 15px 5px 15px 10px;
  16   border-bottom: 1px solid $separator-border-color;
  17   word-break: break-word;
  18
  19   &.unread {
  20     background-color: rgba(0, 0, 0, 0.05);
  21   }
  22
  23   my-global-icon {
  24     width: 24px;
  25     margin-right: 11px;
  26     margin-left: 3px;
  27
  28     @include apply-svg-color(#333);
  29   }
  30
  31   .avatar {
  32     @include avatar(30px);
  33
  34     margin-right: 10px;
  35   }
  36
  37   .message {
  38     flex-grow: 1;
  39
  40     a {
  41       font-weight: $font-semibold;
  42     }
  43   }
  44
  45   .from-date {
  46     font-size: 0.85em;
  47     color: var(--greyForegroundColor);
  48     padding-left: 5px;
  49     min-width: 70px;
  50     text-align: right;
  51     margin-left: auto;
  52   }
  53 }