client/src/app/shared/shared-account-avatar/account-avatar.component.scss

   1 @import '_variables';
   2 @import '_mixins';
   3
   4 .avatar-25 {
   5   @include avatar(25px);
   6 }
   7
   8 .avatar-32 {
   9   @include avatar(32px);
  10 }
  11
  12 .avatar-34 {
  13   @include avatar(34px);
  14 }
  15
  16 .avatar-36 {
  17   @include avatar(36px);
  18 }
  19
  20 .avatar-40 {
  21   @include avatar(40px);
  22 }
  23
  24 .avatar-120 {
  25   @include avatar(120px);
  26
  27   &.initial {
  28     font-size: 46px;
  29   }
  30 }
  31
  32 a:hover {
  33   text-decoration: none;
  34 }
  35
  36 .initial {
  37   background-color: #3C2109;
  38   color: #fff;
  39   display: flex;
  40   align-items: center;
  41   justify-content: center;
  42   font-size: 22px;
  43   border-radius: 50%;
  44
  45   &.blue {
  46     background-color: #009FD4;
  47   }
  48
  49   &.green {
  50     background-color: #00AA55;
  51   }
  52
  53   &.purple {
  54     background-color: #B381B3;
  55   }
  56
  57   &.gray {
  58     background-color: #939393;
  59   }
  60
  61   &.yellow {
  62     background-color: #AA8F00;
  63   }
  64
  65   &.orange {
  66     background-color: #D47500;
  67   }
  68
  69   &.red {
  70     background-color: #E76E3C;
  71   }
  72
  73   &.dark-blue {
  74     background-color: #0A3055;
  75   }
  76 }