Avatar

- Update icon size for 20px foe default (medium size)
appwrite · Aug 25, 2023 · cad1b43 · cad1b43
1 parent 11f4939
commit cad1b43
Showing 1 changed file with 8 additions and 8 deletions.
diff --git a/packages/ui/src/6-elements/_avatar.scss b/packages/ui/src/6-elements/_avatar.scss
@@ -97,7 +97,7 @@
   line-height: 1;
 
   [class*="icon"] { font-size:var(--p-text-size); }
-  img, svg { inline-size:var(--p-text-size); block-size:var(--p-text-size);  }
+  img, svg { inline-size:var(--p-text-size); aspect-ratio:1 / 1; }
   &-link {
     display:block; border-radius:var(--border-radius-circular);
     &:focus-visible { box-shadow:var(--focus-box-shadow); }
@@ -109,7 +109,7 @@
   }
   &.is-size-small    {
     --p-text-size:var(--font-size-00); $size:pxToRem(32); --p-size:#{$size};
-    [class*="icon"] { --p-text-size:var(x-); }
+    [class*="icon"] { --p-text-size:var(--font-size-0); }
   }
   &.is-size-medium        {
     /* default */
@@ -202,7 +202,7 @@
 
 .avatars-group {
   --p-avatar-group-border-color: var(--avatar-group-border-color, var(--color-neutral-5));
-  position:relative; z-index:0; display:flex; padding-inline-end:.6rem;
+  position:relative; z-index:0; display:flex;
   &-item {
     position: relative;
     display: inline-flex;
@@ -214,13 +214,13 @@
     }
     .avatar {
       border:solid pxToRem(2) hsl(var(--p-avatar-group-border-color)); border-radius:var(--border-radius-circular);
-      margin-inline-end: -.6rem;
+      margin-inline-start: -.6rem;
     }
-    .image-item { margin-inline-end: -.6rem; }
+    .image-item { margin-inline-start: -.6rem; }
 
-    .is-size-x-small  { margin-inline-end: -.5rem; }
-    .is-size-small    { margin-inline-end: -.5rem; }
-    .is-size-large    { margin-inline-end: -0.8rem; }
+    .is-size-x-small  { margin-inline-start: -.5rem; }
+    .is-size-small    { margin-inline-start: -.5rem; }
+    .is-size-large    { margin-inline-start: -0.8rem; }
   }
   &.is-with-border .avatar {
     --p-avatar-group-border-color:var(--p-avatar-border-color-default)!important;