Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Conversation

github-actions[bot]
Copy link
Contributor

@github-actions github-actions bot commented Sep 10, 2024

Backport of #57783 to release/9.0

/cc @javiercn

[Identity][Templates] Ensure placeholders don't overlap with text

Placeholder text on input textboxes overlaps with the label texts.

Description

  • As part of an accessibility fix, we started displaying placeholders on input elements.
  • In some circumstances, these placeholders overlap with the labels on the input text boxes, making it problematic to read them.
  • The fix addresses this by reducing the size of the placeholders and making inputs bigger to avoid any overlap.

Fixes https://github.com/dotnet/AspNetCore-ManualTests/issues/3081

Customer Impact

When the window size is small enough, customers could see overlapped text that's hard to read and is sometimes even impossible.

Regression?

  • Yes
  • No

8.0 since we introduced this behavior on 9.0 as part of accessibility fixes.

Risk

  • High
  • Medium
  • Low

The attached videos serve as validation of the fix, in addition to that, the UI is completely customizable by customers.

Verification

  • Manual (required)
  • Automated

Old behavior
image

image

New behavior

AccessibilityFix.mp4
Fix_MVC.mp4

Packaging changes reviewed?

  • Yes
  • No
  • N/A

When servicing release/2.1

  • Make necessary changes in eng/PatchConfig.props

@ghost ghost added the area-mvc Includes: MVC, Actions and Controllers, Localization, CORS, most templates label Sep 10, 2024
@RussKie
Copy link
Contributor

RussKie commented Sep 12, 2024

@javiercn has this been approved for servicing?

@javiercn
Copy link
Member

@RussKie I haven't taking it through servicing just yet.

You normally don't have to worry about this PRs unless they are marked servicing-consider or servicing-approved. We normally start the backporting of something we want to bring through tactics early to avoid dealing with the CI afterwards and ensuring there aren't any surprises.

@javiercn javiercn added the Servicing-consider Shiproom approval is required for the issue label Sep 12, 2024
Copy link
Contributor

@mkArtakMSFT mkArtakMSFT left a comment

Choose a reason for hiding this comment

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

Thanks @javiercn!
Both the screenshot with current issue and the video recording were very useful.

@javiercn javiercn added Servicing-approved Shiproom has approved the issue and removed Servicing-consider Shiproom approval is required for the issue labels Sep 13, 2024
@mkArtakMSFT mkArtakMSFT merged commit 18971d2 into release/9.0 Sep 13, 2024
25 checks passed
@mkArtakMSFT mkArtakMSFT deleted the backport/pr-57783-to-release/9.0 branch September 13, 2024 15:28
@dotnet-policy-service dotnet-policy-service bot added this to the 9.0-rc2 milestone Sep 13, 2024
captainsafia pushed a commit that referenced this pull request Dec 31, 2024
… with text (#57789)

Backport of #57783 to release/9.0

/cc @javiercn

# [Identity][Templates] Ensure placeholders don't overlap with text

Placeholder text on input textboxes overlaps with the label texts.

## Description

* As part of an accessibility fix, we started displaying placeholders on input elements.
* In some circumstances, these placeholders overlap with the labels on the input text boxes, making it problematic to read them.
* The fix addresses this by reducing the size of the placeholders and making inputs bigger to avoid any overlap.

Fixes dotnet/AspNetCore-ManualTests#3081

## Customer Impact

When the window size is small enough, customers could see overlapped text that's hard to read and is sometimes even impossible.

## Regression?

- [X] Yes
- [ ] No

8.0 since we introduced this behavior on 9.0 as part of accessibility fixes.

## Risk

- [ ] High
- [ ] Medium
- [x] Low

The attached videos serve as validation of the fix, in addition to that, the UI is completely customizable by customers.

## Verification

- [X] Manual (required)
- [ ] Automated

**Old behavior**
![image](https://github.com/user-attachments/assets/ae72b769-7215-4b0a-954b-a59fb84fbb7d)

![image](https://github.com/user-attachments/assets/f9e32542-7aa7-47ba-876e-567435ef4bdc)

**New behavior**

https://github.com/user-attachments/assets/6eae3396-9794-402d-af65-e0bc89257a44

https://github.com/user-attachments/assets/0343b4fc-5f55-4e46-a276-67c4c97645e2

## Packaging changes reviewed?

- [ ] Yes
- [ ] No
- [X] N/A

----

## When servicing release/2.1

- [ ] Make necessary changes in eng/PatchConfig.props
captainsafia pushed a commit that referenced this pull request Feb 11, 2025
… with text (#57789)

Backport of #57783 to release/9.0

/cc @javiercn

# [Identity][Templates] Ensure placeholders don't overlap with text

Placeholder text on input textboxes overlaps with the label texts.

## Description

* As part of an accessibility fix, we started displaying placeholders on input elements.
* In some circumstances, these placeholders overlap with the labels on the input text boxes, making it problematic to read them.
* The fix addresses this by reducing the size of the placeholders and making inputs bigger to avoid any overlap.

Fixes dotnet/AspNetCore-ManualTests#3081

## Customer Impact

When the window size is small enough, customers could see overlapped text that's hard to read and is sometimes even impossible.

## Regression?

- [X] Yes
- [ ] No

8.0 since we introduced this behavior on 9.0 as part of accessibility fixes.

## Risk

- [ ] High
- [ ] Medium
- [x] Low

The attached videos serve as validation of the fix, in addition to that, the UI is completely customizable by customers.

## Verification

- [X] Manual (required)
- [ ] Automated

**Old behavior**
![image](https://github.com/user-attachments/assets/ae72b769-7215-4b0a-954b-a59fb84fbb7d)

![image](https://github.com/user-attachments/assets/f9e32542-7aa7-47ba-876e-567435ef4bdc)

**New behavior**

https://github.com/user-attachments/assets/6eae3396-9794-402d-af65-e0bc89257a44

https://github.com/user-attachments/assets/0343b4fc-5f55-4e46-a276-67c4c97645e2

## Packaging changes reviewed?

- [ ] Yes
- [ ] No
- [X] N/A

----

## When servicing release/2.1

- [ ] Make necessary changes in eng/PatchConfig.props
This was referenced Sep 15, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area-mvc Includes: MVC, Actions and Controllers, Localization, CORS, most templates Servicing-approved Shiproom has approved the issue
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants