@vaadin/vaadin-avatar - npm Package Compare versions

Comparing version 2.0.1 to 2.0.2

package.json

 {
   "name": "@vaadin/vaadin-avatar",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "description": "vaadin-avatar",
@@ -5,0 +5,0 @@ "main": "vaadin-avatar-group.js",

src/vaadin-avatar-group.js

@@ -80,4 +80,4 @@ /**
         [part='avatar']:not(:first-child) {
-          -webkit-mask-image: url('data:image/svg+xml;utf8,<svg viewBox=%2.0.1 300 300%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22><path fill-rule=%22evenodd%22 clip-rule=%22evenodd%22 d=%22M300 0H0V300H300V0ZM150 200C177.614 200 200 177.614 200 150C200 122.386 177.614 100 150 100C122.386 100 100 122.386 100 150C100 177.614 122.386 200 150 200Z%22 fill=%22black%22/></svg>');
-          mask-image: url('data:image/svg+xml;utf8,<svg viewBox=%2.0.1 300 300%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22><path fill-rule=%22evenodd%22 clip-rule=%22evenodd%22 d=%22M300 0H0V300H300V0ZM150 200C177.614 200 200 177.614 200 150C200 122.386 177.614 100 150 100C122.386 100 100 122.386 100 150C100 177.614 122.386 200 150 200Z%22 fill=%22black%22/></svg>');
+          -webkit-mask-image: url('data:image/svg+xml;utf8,<svg viewBox=%220 0 300 300%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22><path fill-rule=%22evenodd%22 clip-rule=%22evenodd%22 d=%22M300 0H0V300H300V0ZM150 200C177.614 200 200 177.614 200 150C200 122.386 177.614 100 150 100C122.386 100 100 122.386 100 150C100 177.614 122.386 200 150 200Z%22 fill=%22black%22/></svg>');
+          mask-image: url('data:image/svg+xml;utf8,<svg viewBox=%220 0 300 300%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22><path fill-rule=%22evenodd%22 clip-rule=%22evenodd%22 d=%22M300 0H0V300H300V0ZM150 200C177.614 200 200 177.614 200 150C200 122.386 177.614 100 150 100C122.386 100 100 122.386 100 150C100 177.614 122.386 200 150 200Z%22 fill=%22black%22/></svg>');
           -webkit-mask-size: calc(
@@ -160,3 +160,3 @@ 300% + var(--vaadin-avatar-group-overlap-border) * 6 - var(--vaadin-avatar-outline-width) * 6
   static get version() {
-    return '2.0.1';
+    return '2.0.2';
   }
@@ -163,0 +163,0 @@

src/vaadin-avatar.js

@@ -150,3 +150,3 @@ /**
   static get version() {
-    return '2.0.1';
+    return '2.0.2';
   }
@@ -153,0 +153,0 @@

theme/lumo/vaadin-avatar-group-styles.js

@@ -11,17 +11,11 @@ import { registerStyles, css } from '@vaadin/vaadin-themable-mixin/register-styles.js';
     :host {
-      --_lumo-avatar-group-offset: var(--lumo-size-m);
+      --vaadin-avatar-size: var(--lumo-size-m);
     }
 
-    [part='avatar']:not([dir='rtl']):not(:first-child) {
-      -webkit-mask-position: calc(50% - var(--_lumo-avatar-group-offset) + var(--vaadin-avatar-group-overlap));
-      mask-position: calc(50% - var(--_lumo-avatar-group-offset) + var(--vaadin-avatar-group-overlap));
+    :host([theme~='small']) {
+      --vaadin-avatar-size: var(--lumo-size-s);
     }
 
-    [part='avatar'][dir='rtl']:not(:first-child) {
-      -webkit-mask-position: calc(
-        50% + var(--_lumo-avatar-group-offset) - var(--vaadin-avatar-group-overlap) + var(--vaadin-avatar-outline-width)
-      );
-      mask-position: calc(
-        50% + var(--_lumo-avatar-group-offset) - var(--vaadin-avatar-group-overlap) + var(--vaadin-avatar-outline-width)
-      );
+    :host([theme~='xsmall']) {
+      --vaadin-avatar-size: var(--lumo-size-xs);
     }
@@ -32,3 +26,3 @@
       --vaadin-avatar-group-overlap-border: 3px;
-      --_lumo-avatar-group-offset: var(--lumo-size-xl);
+      --vaadin-avatar-size: var(--lumo-size-xl);
     }
@@ -39,3 +33,3 @@
       --vaadin-avatar-group-overlap-border: 3px;
-      --_lumo-avatar-group-offset: var(--lumo-size-l);
+      --vaadin-avatar-size: var(--lumo-size-l);
     }
@@ -46,3 +40,3 @@
       --vaadin-avatar-group-overlap-border: 2px;
-      --_lumo-avatar-group-offset: var(--lumo-size-s);
+      --vaadin-avatar-size: var(--lumo-size-s);
     }
@@ -53,3 +47,3 @@
       --vaadin-avatar-group-overlap-border: 2px;
-      --_lumo-avatar-group-offset: var(--lumo-size-xs);
+      --vaadin-avatar-size: var(--lumo-size-xs);
     }
@@ -56,0 +50,0 @@ `,

theme/lumo/vaadin-avatar-styles.js

@@ -60,19 +60,15 @@ import { registerStyles, css } from '@vaadin/vaadin-themable-mixin/register-styles.js';
     :host([theme~='xlarge']) {
-      width: var(--lumo-size-xl);
-      height: var(--lumo-size-xl);
+      --vaadin-avatar-size: var(--lumo-size-xl);
     }
 
     :host([theme~='large']) {
-      width: var(--lumo-size-l);
-      height: var(--lumo-size-l);
+      --vaadin-avatar-size: var(--lumo-size-l);
     }
 
     :host([theme~='small']) {
-      width: var(--lumo-size-s);
-      height: var(--lumo-size-s);
+      --vaadin-avatar-size: var(--lumo-size-s);
     }
 
     :host([theme~='xsmall']) {
-      width: var(--lumo-size-xs);
-      height: var(--lumo-size-xs);
+      --vaadin-avatar-size: var(--lumo-size-xs);
     }
@@ -79,0 +75,0 @@ `,

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

62159

decreased by-0.96%

Lines of code

1332

decreased by-0.75%

No dependency changes