fix(b-avatar): image fit and scale (closes #5610, #5655) (#5675)

jacobmllr95 · web-flow · commit 9812248ea686 · 2020-08-21T07:16:35.000+02:00
* fix(b-avavtar): image fit and scale

* Update _avatar.scss

* Update _avatar.scss
diff --git a/src/components/avatar/_avatar.scss b/src/components/avatar/_avatar.scss
@@ -57,6 +57,8 @@
     display: flex;
     justify-content: center;
     align-items: center;
+    // https://gist.github.com/ayamflow/b602ab436ac9f05660d9c15190f4fd7b
+    mask-image: radial-gradient(white, black);
   }
 
   .b-avatar-text {
@@ -79,6 +81,9 @@
     height: 100%;
     max-height: auto;
     border-radius: inherit;
+    // This is not supported in IE11 and Edge <16
+    // https://caniuse.com/#feat=object-fit
+    object-fit: cover;
   }
 
   .b-avatar-badge {
