Refector sass

Signed-off-by: Ajay Bura <ajbura@gmail.com>

src/app/atoms/avatar/Avatar.jsx

@@ -26,7 +26,7 @@ function Avatar({
           : (
             <span
               style={{ backgroundColor: iconSrc === null ? bgColor : 'transparent' }}
-              className={`avatar__border${iconSrc !== null ? ' avatar__bordered' : ''} inline-flex--center`}
+              className={`avatar__border${iconSrc !== null ? '--active' : ''}`}
             >
               {
                 iconSrc !== null

src/app/atoms/avatar/Avatar.scss

@@ -1,3 +1,5 @@
+@use '../../partials/flex';
+
 .avatar-container {
   display: inline-flex;
   width: 42px;
@@ -31,11 +33,9 @@
     border-radius: inherit;
   }
 
-  .avatar__bordered {
-    box-shadow: var(--bs-surface-border);
-  }
-
   .avatar__border {
+    @extend .cp-fx__row--c-c;
+    
     position: absolute;
     top: 0;
     left: 0;
@@ -47,5 +47,9 @@
     .text {
       color: white;
     }
+    &--active {
+      @extend .avatar__border;
+      box-shadow: var(--bs-surface-border);
+    }
   }
 }