Update AliasesList responsive styles

pshenmic · Dec 11, 2024 · 991d0c3 · 991d0c3
1 parent 88c8d7e
commit 991d0c3
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 2 deletions.
diff --git a/packages/frontend/src/app/identity/[identifier]/AliasesList.js b/packages/frontend/src/app/identity/[identifier]/AliasesList.js
@@ -14,11 +14,11 @@ function AliasesList ({ aliases = [], smallCount = 5 }) {
 
   return (
     <div className={'AliasesList'}>
-      <SmoothSize>
+      <SmoothSize className={'AliasesList__SmoothSize'}>
         <div className={'AliasesList__ItemsContainer'}>
           {filteredArray?.map((alias, i) => (
             <div className={'AliasesList__Item'} key={i}>
-              <Alias status={alias.status} key={i}>{alias.alias}</Alias>
+              <Alias status={alias.status} ellipsis={false} key={i}>{alias.alias}</Alias>
               <DateBlock timestamp={1233123333332} format={'deltaOnly'}/>
             </div>
           ))}

diff --git a/packages/frontend/src/app/identity/[identifier]/AliasesList.scss b/packages/frontend/src/app/identity/[identifier]/AliasesList.scss
@@ -14,6 +14,7 @@
     align-items: center;
     gap: 0.5rem;
     justify-content: flex-end;
+    max-width: 100%;
   }
 
   &__ShowMoreButton {
@@ -25,4 +26,8 @@
       transition: .2s;
     }
   }
+
+  &__SmoothSize {
+    max-width: 100%;
+  }
 }
diff --git a/packages/frontend/src/app/identity/[identifier]/IdentityTotalCard.scss b/packages/frontend/src/app/identity/[identifier]/IdentityTotalCard.scss
@@ -53,6 +53,12 @@
   &__InfoLine {
     &--Names {
       align-items: baseline;
+      flex-wrap: wrap;
+
+      .InfoLine__Value {
+        margin-left: auto;
+        max-width: 100%;
+      }
     }
   }