fix: add dynamic truncate for email in list of signers #1865
fix: add dynamic truncate for email in list of signers #1865prafull-opensignlabs merged 1 commit intostagingfrom
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
There was a problem hiding this comment.
Pull Request Overview
This PR improves the layout and text overflow handling in signer and recipient list components by replacing hardcoded width constraints with flexible CSS utilities for better responsive design.
- Replaces fixed width classes with flex utilities for better responsive behavior
- Switches from manual overflow/ellipsis handling to Tailwind's
truncateutility - Adds
flex-shrink-0to prevent avatar icons from being compressed
Reviewed Changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated 2 comments.
| File | Description |
|---|---|
| SignerListComponent.jsx | Updates flex layout and text truncation for signer items |
| RecipientList.jsx | Improves layout flexibility and text overflow handling for recipient items |
| className={`${ | ||
| obj.Name ? "flex-col" : "flex-row" | ||
| } flex items-center`} | ||
| } flex overflow-hidden flex-grow-0`} |
There was a problem hiding this comment.
[nitpick] The class flex-grow-0 is redundant when combined with overflow-hidden in this context. Consider removing flex-grow-0 as the parent container already controls the flex behavior, and overflow-hidden will handle the text truncation needs.
| } flex overflow-hidden flex-grow-0`} | |
| } flex overflow-hidden`} |
| </div> | ||
| <div className="flex flex-col"> | ||
| <span className="text-[12px] font-bold text-[#424242] w-[100px] whitespace-nowrap overflow-hidden text-ellipsis"> | ||
| <div className="flex flex-grow-0 flex-col overflow-hidden pr-2"> |
There was a problem hiding this comment.
[nitpick] The class flex-grow-0 is redundant when combined with overflow-hidden in this context. Consider removing flex-grow-0 as the parent container already controls the flex behavior, and overflow-hidden will handle the text truncation needs.
| <div className="flex flex-grow-0 flex-col overflow-hidden pr-2"> | |
| <div className="flex flex-col overflow-hidden pr-2"> |
No description provided.