Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added ellipsis in card #6053

Merged

Conversation

NishantSinghhhhh
Copy link
Contributor

@NishantSinghhhhh NishantSinghhhhh commented Nov 2, 2024

Description
This CSS update enforces a multi-line ellipsis on text within .card .text, ensuring it displays up to a specified number of lines (i.e. 3) before truncating. The ellipsis will appear at the end of the last visible line, hiding any content that extends beyond this point.

Details

1). Sets display: -webkit-box with -webkit-line-clamp: 3 to limit text display to three lines.
2). Adds overflow: hidden and text-overflow: ellipsis to manage overflow and apply an ellipsis (...) at the end of the visible lines.

==> Notes for Reviewers
1). Adjust the line-height and -webkit-line-clamp values as needed for different line limits.
2). Ensure compatibility with WebKit browsers, as -webkit-line-clamp may not work in non-WebKit environments.

Screenshot 2024-11-02 122201

Signed commits

  • Yes, I signed my commits.

Signed-off-by: NishantSinghhhhh <[email protected]>
@l5io
Copy link
Contributor

l5io commented Nov 2, 2024

🚀 Preview for commit db51dab at: https://6725cf10d4550a43be1423c7--layer5.netlify.app

Signed-off-by: NISHANT SINGH <[email protected]>
@l5io
Copy link
Contributor

l5io commented Nov 2, 2024

🚀 Preview for commit e1f1bd9 at: https://6726555a2a603eba4f801e1a--layer5.netlify.app

Copy link
Member

@sudhanshutech sudhanshutech left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@NishantSinghhhhh have you checked these changes not effecting badly somewhere else if this card would have been reused somewhere?

@vishalvivekm
Copy link
Contributor

@NishantSinghhhhh Let's discuss this on websites call on Monday at 6:30 PM IST (7:00 AM CT). Add it as an agenda item to the meeting minutes, if you would :)

@NishantSinghhhhh
Copy link
Contributor Author

Sure Sir

1 similar comment
@NishantSinghhhhh
Copy link
Contributor Author

Sure Sir

@NishantSinghhhhh
Copy link
Contributor Author

@NishantSinghhhhh have you checked these changes not effecting badly somewhere else if this card would have been reused somewhere?

Yes sir , I just did this, it was working fine

Signed-off-by: NISHANT SINGH <[email protected]>
@l5io
Copy link
Contributor

l5io commented Nov 3, 2024

🚀 Preview for commit 8de89d2 at: https://67279ec6388ea8539a5763df--layer5.netlify.app

@sudhanshutech sudhanshutech merged commit b78a103 into layer5io:master Nov 4, 2024
5 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Development

Successfully merging this pull request may close these issues.

4 participants