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

Provide k-checkbox-label when the label is placed on the left side #5037

Open
mbechev opened this issue May 15, 2024 · 0 comments
Open

Provide k-checkbox-label when the label is placed on the left side #5037

mbechev opened this issue May 15, 2024 · 0 comments
Assignees
Labels
C:Input Enhancement New feature of an existing functionality or an improvement of an existing functionality.

Comments

@mbechev
Copy link
Contributor

mbechev commented May 15, 2024

Describe the bug
The existing k-checkbox-label and k-radiobutton-label classes add space between the label and the input which makes them appear more user-friendly.

image
<kendo-checkbox #checkbox1 ></kendo-checkbox>
<kendo-label class="k-checkbox-label" [for]="checkbox1" text="Checkbox Component"></kendo-label>

However, there is no available class if the label is placed on the left side of the input:

image
<kendo-label [for]="checkbox3" text="Checkbox Component"></kendo-label>
<kendo-checkbox #checkbox3 [checkedState]="true"></kendo-checkbox>

The workaround is to use an inline style, which has been used for the k-checkbox-label:

<kendo-label 
    [for]="checkbox3" 
    text="Checkbox Component" 
    style="display: inline;margin-inline-end: 4px;">
</kendo-label>

https://stackblitz.com/edit/angular-q9mv5x?file=src%2Fapp%2Fapp.component.ts,src%2Fapp%2Fapp.module.ts

@mbechev mbechev added Enhancement New feature of an existing functionality or an improvement of an existing functionality. C:Input labels May 15, 2024
@inikolova inikolova self-assigned this Aug 13, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
C:Input Enhancement New feature of an existing functionality or an improvement of an existing functionality.
Projects
None yet
Development

No branches or pull requests

2 participants