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

   1 .no-notification {
   2   display: flex;
   3   justify-content: center;
   4   align-items: center;
   5   padding: 20px 0;
   6 }
   7
   8 .notification {
   9   display: flex;
  10   justify-content: space-between;
  11   align-items: center;
  12   font-size: inherit;
  13   padding: 15px 10px;
  14   border-bottom: 1px solid rgba(0, 0, 0, 0.10);
  15
  16   .mark-as-read {
  17     min-width: 35px;
  18
  19     .glyphicon {
  20       display: none;
  21       cursor: pointer;
  22       color: rgba(20, 20, 20, 0.5)
  23     }
  24   }
  25
  26   &.unread {
  27     background-color: rgba(0, 0, 0, 0.05);
  28
  29     &:hover .mark-as-read .glyphicon {
  30       display: block;
  31
  32       &:hover {
  33         color: rgba(20, 20, 20, 0.8);
  34       }
  35     }
  36   }
  37 }