@import "../../../style/mixin";

@include export-module('co-avatar-layout') {
  .co-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: $tp-co-avatar-font-family;
    height: $tp-co-avatar-image-size;
    width: $tp-co-avatar-image-size;
    border-radius: 50%;
    //background: #0084de; // todo make dynamic
    svg {
      height: 100%;
      width: 100%;
      text {
        fill: white;
      }
    }

    .co-image-display {
      width: 30px;
      height: 30px;
      overflow: hidden;
      border-radius: 50px;

      .image {
        object-fit: cover;
      }
    }
  }
}