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

feat(ui5-label): add showColon property #965

Merged
merged 9 commits into from
Nov 27, 2019
Merged

feat(ui5-label): add showColon property #965

merged 9 commits into from
Nov 27, 2019

Conversation

kskondov
Copy link
Contributor

@kskondov kskondov commented Nov 25, 2019

No description provided.

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"
@ilhan007 ilhan007 changed the title Label asterisk fix(ui5-label): Asterisk moved to the right Nov 25, 2019
@ilhan007 ilhan007 changed the title fix(ui5-label): Asterisk moved to the right fix(ui5-label): move asterisk to the right Nov 25, 2019
@vladitasev
Copy link
Contributor

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"
Copy link
Member

@ilhan007 ilhan007 left a 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 .

@ilhan007 ilhan007 changed the title fix(ui5-label): move asterisk to the right fix(ui5-label): add showColon property Nov 26, 2019
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"
Copy link
Member

@ilhan007 ilhan007 left a 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.

packages/main/src/themes/Label.css Outdated Show resolved Hide resolved
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"
:host([wrap]) .ui5-label-root {
white-space: normal;
line-height: 1.4rem;
:host(:not([wrap])) .label-text-wrapper {
Copy link
Member

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"
@ilhan007 ilhan007 changed the title fix(ui5-label): add showColon property feat(ui5-label): add showColon property Nov 27, 2019
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"
@ilhan007 ilhan007 merged commit ae95a8d into SAP:master Nov 27, 2019
ilhan007 added a commit that referenced this pull request Nov 28, 2019
fix degradation caused by recent commit in the ui5 -label #965
resulting in a bug with the ui5-checkbox wrapping
ilhan007 added a commit that referenced this pull request Nov 28, 2019
Fixes degradation caused by recent commit in the ui5 -label #965
resulting in a bug with the ui5-checkbox wrapping
ilhan007 added a commit that referenced this pull request Dec 3, 2019
Fixes degradation caused by recent commit in the ui5 -label #965
resulting in a bug with the ui5-checkbox wrapping
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants