-
Notifications
You must be signed in to change notification settings - Fork 265
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
feat(ui5-label): add showColon property #965
Conversation
Part of issue #834
The asterisk marking the ui5-label as required is now positioned to the right side of the label text. A new property "showColon" was introduced for proper positioning and avoiding truncation of the "colon"
The asterisk marking the ui5-label as required is now positioned to the right side of the label text. A new property "showColon" was introduced for proper positioning and avoiding truncation of the "colon"
Please check the failing tests |
The asterisk marking the ui5-label as required is now positioned to the right side of the label text. A new property "showColon" was introduced for proper positioning and avoiding truncation of the "colon"
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
When I comment those styles, I think the result is the same, but I might miss something.
Can you look at it?
/* :host([show-colon][required]) .label-required-colon {
display: inline-block;
line-height: 1rem;
vertical-align: top;
}
:host([show-colon][required]) .label-required-colon:before {
line-height: 1rem;
vertical-align: top;
} */
Also, it`s good to add one new sample section within the Label.sample.html to show the new property in the official documentation. How to run locally the playground, you can reach @fifoosid .
The asterisk marking the ui5-label as required is now positioned to the right side of the label text. A new property "showColon" was introduced for proper positioning and avoiding truncation of the "colon"
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There is just one comment about direction: ltr
left. The rest is fine. Thanks in advance.
The asterisk marking the ui5-label as required is now positioned to the right side of the label text. A new property "showColon" was introduced for proper positioning and avoiding truncation of the "colon"
packages/main/src/themes/Label.css
Outdated
:host([wrap]) .ui5-label-root { | ||
white-space: normal; | ||
line-height: 1.4rem; | ||
:host(:not([wrap])) .label-text-wrapper { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Sorry I forgot to mention the new css classes does not follow the naming conventions:
Rename those:
.label-text-wrapper -> .ui5-label-text-wrapper
.label-required-colon -> .ui5-label-colon (it`s not only for required label right)
The asterisk marking the ui5-label as required is now positioned to the right side of the label text. A new property "showColon" was introduced for proper positioning and avoiding truncation of the "colon"
The asterisk marking the ui5-label as required is now positioned to the right side of the label text. A new property "showColon" was introduced for proper positioning and avoiding truncation of the "colon"
The asterisk marking the ui5-label as required is now positioned to the right side of the label text. A new property "showColon" was introduced for proper positioning and avoiding truncation of the "colon"
fix degradation caused by recent commit in the ui5 -label #965 resulting in a bug with the ui5-checkbox wrapping
No description provided.