956 feedback implementation #958
Closed
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Co-authored-by: Erbil Nas <erbil.nas@trendyol.com>
This PR updates the cursor style of the Switch component to
`not-allowed` when it is disabled, improving user experience by
indicating that the component is not interactive in its disabled state.
### Changes
- Added the following CSS rule to the Switch component:
```css
:host([disabled]) .switch {
opacity: 0.5;
cursor: not-allowed; /* added this part */
}
### Issue Resolved
this PR resolves #942
Co-authored-by: Buse Selvi <106681486+buseselvi@users.noreply.github.com>
#940) ### Changes - Added visually hidden text to the navigation buttons for improved accessibility: - `<span class="visually-hidden">Previous Calendar View</span>` was added to the previous button. - `<span class="visually-hidden">Next Calendar View</span>` was added to the next button. ### CSS - Added the following CSS class to hide the text visually while keeping it accessible to screen readers: ```css .visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; } ### Related Issue Fixes #939 --------- Co-authored-by: Erbil <erbilnas071@gmail.com>
improves type safety for * input * icon
#949) Add accessibility labels to close buttons of dialog and drawer component and also aria-label added to progress indicator ### Changes - Added a label to the close button in the dialog component for better accessibility. - Added a label to the close button in the drawer component for better accessibility. - Added aria-label to the progress indicator component for better accessibility. Co-authored-by: Erbil <erbilnas071@gmail.com>
#946) ### Summary of Changes - Added keyboard functionality to the input component to toggle the checked state when the Enter or Space key is pressed. ### Changes Made 1. Implemented the handleKeyDown function: ``` private handleKeyDown(event: KeyboardEvent) { if (event.code === "Enter" || event.code === "Space") { this.checked = !this.checked; this.onChange(this.checked); event.preventDefault(); } } ``` 2. Associated the function with the @keydown event listener: `<input @keydown=${this.handleKeyDown} />` ### Reason for Changes This change was made to enhance user interaction with form elements via the keyboard and to improve accessibility. --------- Co-authored-by: Buse Selvi <106681486+buseselvi@users.noreply.github.com> Co-authored-by: Erbil <erbilnas071@gmail.com>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
No description provided.