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 rgba(0, 0, 0, 0.10);
  17
  18   &.unread {
  19     background-color: rgba(0, 0, 0, 0.05);
  20   }
  21
  22   my-global-icon {
  23     width: 24px;
  24     margin-right: 11px;
  25     margin-left: 3px;
  26
  27     @include apply-svg-color(#333);
  28   }
  29
  30   .avatar {
  31     @include avatar(30px);
  32
  33     margin-right: 10px;
  34   }
  35
  36   .message {
  37     flex-grow: 1;
  38
  39     a {
  40       font-weight: $font-semibold;
  41     }
  42   }
  43
  44   .from-date {
  45     font-size: 0.85em;
  46     color: $grey-foreground-color;
  47     padding-left: 5px;
  48     min-width: 70px;
  49     text-align: right;
  50   }
  51 }