client/src/app/shared/shared-main/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     width: 30px;
  33     height: 30px;
  34     min-width: 30px;
  35     min-height: 30px;
  36     border-radius: 5px;
  37     margin-right: 10px;
  38   }
  39
  40   .message {
  41     flex-grow: 1;
  42
  43     a {
  44       font-weight: $font-semibold;
  45     }
  46   }
  47
  48   .from-date {
  49     font-size: 0.85em;
  50     color: pvar(--greyForegroundColor);
  51     padding-left: 5px;
  52     min-width: 70px;
  53     text-align: right;
  54     margin-left: auto;
  55   }
  56 }