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

fix: polish list item #10022

Merged
merged 1 commit into from
Aug 21, 2024
Merged

fix: polish list item #10022

merged 1 commit into from
Aug 21, 2024

Conversation

GretaD
Copy link
Contributor

@GretaD GretaD commented Aug 20, 2024

Request:

950-714-max

after. Please notice that the avatar is already 40px
Screenshot from 2024-08-20 11-27-06
Screenshot from 2024-08-20 11-21-34
Screenshot from 2024-08-20 11-21-30

@GretaD GretaD requested a review from GVodyanov August 20, 2024 09:29
@GretaD GretaD self-assigned this Aug 20, 2024
Copy link
Member

@ChristophWurst ChristophWurst left a comment

Choose a reason for hiding this comment

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

  • Avatar has size=40 but is 45x45px tall
  • Tags looks wonky Bildschirmfoto vom 2024-08-20 11-49-15
  • Tags resize on hover and make the element appear jittery
  • Actions menu handle overflows the element image

@@ -1072,13 +1072,19 @@ export default {
}
:deep(.list-item) {
flex-wrap: wrap;
padding: var(--default-grid-baseline);
Copy link
Member

Choose a reason for hiding this comment

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

Could you move this into the skeleton component? list item is our own component now. we don't need the deep selectors to patch styles

}
:deep(.line-two__subtitle) {
display: flex;
flex-basis: 100%;
padding-left: 40px;
width: 450px;
}
:deep(.list-item__actions) {
Copy link
Member

Choose a reason for hiding this comment

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

same here

Copy link
Member

@ChristophWurst ChristophWurst left a comment

Choose a reason for hiding this comment

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

Wygląda dobrze!

image

nit: tags should probably wrap line when there are many or have a long label. the ellipsis looks strange

@GretaD
Copy link
Contributor Author

GretaD commented Aug 20, 2024

Wygląda dobrze!

image

nit: tags should probably wrap line when there are many or have a long label. the ellipsis looks strange

the ellipsis happen only when there are too many tags, up to 3 its shown correctly, unless these 3 have longer translations or are personalized ones with long strings. But yes, i agree with you.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants