style: refactor avatar component styles

2026-06-23 08:02:31 +02:00
parent 455acd9552
commit 3e4d609d6c
1 changed files with 17 additions and 6 deletions
@@ -1,21 +1,32 @@
-@use '../../styles/tokens/typography' as *;
+@use "../../styles/tokens/typography" as *;

 .avatar {
-  display: flex;
+  display: inline-flex;
  align-items: center;
  justify-content: center;
-  border-radius: 50%;
+  border-radius: var(--nds-radius-full);
  overflow: hidden;
  width: 40px;
  height: 40px;
+  flex-shrink: 0;
+  background-color: var(--nds-primary-soft);
+  box-shadow: inset 0 0 0 1px var(--nds-border);
  &__content {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
-    @include text-base;
-    color: var(--nds-color-on-primary);
-    background-color: var(--nds-disabled);
+    @include text-label;
+    color: var(--nds-primary);
+    object-fit: cover;
+  }
+  &__fallback {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    height: 100%;
+    color: var(--nds-primary);
  }
 }