Skip to content

Commit bb3b2e9

Browse files
javiercnjaviercn
authored
[Identity][Templates] Ensure placeholders don't overlap with labels (#57783)
* Fixes overlapping placeholders and labels
1 parent fb47e10 commit bb3b2e9

File tree

16 files changed

+42
-42
lines changed

16 files changed

+42
-42
lines changed

‎src/Identity/UI/src/Areas/Identity/Pages/V5/Account/Login.cshtml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77

88
<h1>@ViewData["Title"]</h1>
99
<div class="row">
10-
<div class="col-md-4">
10+
<div class="col-lg-6">
1111
<section>
1212
<form id="account" method="post">
1313
<h2>Use a local account to log in.</h2>
@@ -46,7 +46,7 @@
4646
</form>
4747
</section>
4848
</div>
49-
<div class="col-md-6 col-md-offset-2">
49+
<div class="col-lg-4 col-lg-offset-2">
5050
<section>
5151
<h3>Use another service to log in.</h3>
5252
<hr />

‎src/Identity/UI/src/Areas/Identity/Pages/V5/Account/Manage/ChangePassword.cshtml

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,21 +8,21 @@
88
<h3>@ViewData["Title"]</h3>
99
<partial name="_StatusMessage" for="StatusMessage" />
1010
<div class="row">
11-
<div class="col-md-6">
11+
<div class="col-xl-6">
1212
<form id="change-password-form" method="post">
1313
<div asp-validation-summary="ModelOnly" class="text-danger" role="alert"></div>
1414
<div class="form-floating mb-3">
15-
<input asp-for="Input.OldPassword" class="form-control" autocomplete="current-password" aria-required="true" placeholder="Please enter your old password." />
15+
<input asp-for="Input.OldPassword" class="form-control" autocomplete="current-password" aria-required="true" placeholder="Enter the old password" />
1616
<label asp-for="Input.OldPassword" class="form-label"></label>
1717
<span asp-validation-for="Input.OldPassword" class="text-danger"></span>
1818
</div>
1919
<div class="form-floating mb-3">
20-
<input asp-for="Input.NewPassword" class="form-control" autocomplete="new-password" aria-required="true" placeholder="Please enter your new password." />
20+
<input asp-for="Input.NewPassword" class="form-control" autocomplete="new-password" aria-required="true" placeholder="Enter the new password" />
2121
<label asp-for="Input.NewPassword" class="form-label"></label>
2222
<span asp-validation-for="Input.NewPassword" class="text-danger"></span>
2323
</div>
2424
<div class="form-floating mb-3">
25-
<input asp-for="Input.ConfirmPassword" class="form-control" autocomplete="new-password" aria-required="true" placeholder="Please confirm your new password."/>
25+
<input asp-for="Input.ConfirmPassword" class="form-control" autocomplete="new-password" aria-required="true" placeholder="Enter the new password"/>
2626
<label asp-for="Input.ConfirmPassword" class="form-label"></label>
2727
<span asp-validation-for="Input.ConfirmPassword" class="text-danger"></span>
2828
</div>

‎src/Identity/UI/src/Areas/Identity/Pages/V5/Account/Manage/Email.cshtml

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,13 +8,13 @@
88
<h3>@ViewData["Title"]</h3>
99
<partial name="_StatusMessage" for="StatusMessage" />
1010
<div class="row">
11-
<div class="col-md-6">
11+
<div class="col-xl-6">
1212
<form id="email-form" method="post">
1313
<div asp-validation-summary="All" class="text-danger" role="alert"></div>
1414
@if (Model.IsEmailConfirmed)
1515
{
1616
<div class="form-floating mb-3 input-group">
17-
<input asp-for="Email" class="form-control" placeholder="Please enter your email." disabled />
17+
<input asp-for="Email" class="form-control" placeholder="Enter your email" disabled />
1818
<div class="input-group-append">
1919
<span class="h-100 input-group-text text-success font-weight-bold">✓</span>
2020
</div>
@@ -24,13 +24,13 @@
2424
else
2525
{
2626
<div class="form-floating mb-3">
27-
<input asp-for="Email" class="form-control" placeholder="Please enter your email." disabled />
27+
<input asp-for="Email" class="form-control" placeholder="Enter your email" disabled />
2828
<label asp-for="Email" class="form-label"></label>
2929
<button id="email-verification" type="submit" asp-page-handler="SendVerificationEmail" class="btn btn-link">Send verification email</button>
3030
</div>
3131
}
3232
<div class="form-floating mb-3">
33-
<input asp-for="Input.NewEmail" class="form-control" autocomplete="email" aria-required="true" placeholder="Please enter new email." />
33+
<input asp-for="Input.NewEmail" class="form-control" autocomplete="email" aria-required="true" placeholder="Enter new email" />
3434
<label asp-for="Input.NewEmail" class="form-label"></label>
3535
<span asp-validation-for="Input.NewEmail" class="text-danger"></span>
3636
</div>

‎src/Identity/UI/src/Areas/Identity/Pages/V5/Account/Manage/EnableAuthenticator.cshtml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@
3232
with a unique code. Enter the code in the confirmation box below.
3333
</p>
3434
<div class="row">
35-
<div class="col-md-6">
35+
<div class="col-xl-6">
3636
<form id="send-code" method="post">
3737
<div class="form-floating mb-3">
3838
<input asp-for="Input.Code" class="form-control" autocomplete="off" placeholder="Please enter the code."/>

‎src/Identity/UI/src/Areas/Identity/Pages/V5/Account/Manage/Index.cshtml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,11 +12,11 @@
1212
<form id="profile-form" method="post">
1313
<div asp-validation-summary="ModelOnly" class="text-danger" role="alert"></div>
1414
<div class="form-floating mb-3">
15-
<input asp-for="Username" class="form-control" placeholder="Please choose your username." disabled />
15+
<input asp-for="Username" class="form-control" placeholder="Choose your username" disabled />
1616
<label asp-for="Username" class="form-label"></label>
1717
</div>
1818
<div class="form-floating mb-3">
19-
<input asp-for="Input.PhoneNumber" class="form-control" placeholder="Please enter your phone number."/>
19+
<input asp-for="Input.PhoneNumber" class="form-control" placeholder="Enter your phone number"/>
2020
<label asp-for="Input.PhoneNumber" class="form-label"></label>
2121
<span asp-validation-for="Input.PhoneNumber" class="text-danger"></span>
2222
</div>

‎src/Identity/UI/src/Areas/Identity/Pages/V5/Account/Manage/SetPassword.cshtml

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,16 +12,16 @@
1212
account so you can log in without an external login.
1313
</p>
1414
<div class="row">
15-
<div class="col-md-6">
15+
<div class="col-xl-6">
1616
<form id="set-password-form" method="post">
1717
<div asp-validation-summary="ModelOnly" class="text-danger" role="alert"></div>
1818
<div class="form-floating mb-3">
19-
<input asp-for="Input.NewPassword" class="form-control" autocomplete="new-password" placeholder="Please enter your new password."/>
19+
<input asp-for="Input.NewPassword" class="form-control" autocomplete="new-password" placeholder="Enter the new password"/>
2020
<label asp-for="Input.NewPassword" class="form-label"></label>
2121
<span asp-validation-for="Input.NewPassword" class="text-danger"></span>
2222
</div>
2323
<div class="form-floating mb-3">
24-
<input asp-for="Input.ConfirmPassword" class="form-control" autocomplete="new-password" placeholder="Please confirm your new password."/>
24+
<input asp-for="Input.ConfirmPassword" class="form-control" autocomplete="new-password" placeholder="Enter the new password"/>
2525
<label asp-for="Input.ConfirmPassword" class="form-label"></label>
2626
<span asp-validation-for="Input.ConfirmPassword" class="text-danger"></span>
2727
</div>

‎src/Identity/UI/src/Areas/Identity/Pages/V5/Account/Manage/_Layout.cshtml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,10 +15,10 @@
1515
<h2>Change your account settings</h2>
1616
<hr />
1717
<div class="row">
18-
<div class="col-md-3">
18+
<div class="col-lg-3">
1919
<partial name="_ManageNav" />
2020
</div>
21-
<div class="col-md-9">
21+
<div class="col-lg-9">
2222
@RenderBody()
2323
</div>
2424
</div>

‎src/Identity/UI/src/Areas/Identity/Pages/V5/Account/Register.cshtml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
<h1>@ViewData["Title"]</h1>
88

99
<div class="row">
10-
<div class="col-md-4">
10+
<div class="col-lg-6">
1111
<form id="registerForm" asp-route-returnUrl="@Model.ReturnUrl" method="post">
1212
<h2>Create a new account.</h2>
1313
<hr />
@@ -30,7 +30,7 @@
3030
<button id="registerSubmit" type="submit" class="w-100 btn btn-lg btn-primary">Register</button>
3131
</form>
3232
</div>
33-
<div class="col-md-6 col-md-offset-2">
33+
<div class="col-lg-4 col-lg-offset-2">
3434
<section>
3535
<h3>Use another service to register.</h3>
3636
<hr />

‎src/ProjectTemplates/Web.ProjectTemplates/content/BlazorWeb-CSharp/BlazorWeb-CSharp/Components/Account/Pages/Login.razor

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414

1515
<h1>Log in</h1>
1616
<div class="row">
17-
<div class="col-md-4">
17+
<div class="col-lg-6">
1818
<section>
1919
<StatusMessage Message="@errorMessage" />
2020
<EditForm Model="Input" method="post" OnValidSubmit="LoginUser" FormName="login">
@@ -55,7 +55,7 @@
5555
</EditForm>
5656
</section>
5757
</div>
58-
<div class="col-md-6 col-md-offset-2">
58+
<div class="col-lg-4 col-lg-offset-2">
5959
<section>
6060
<h3>Use another service to log in.</h3>
6161
<hr />

‎src/ProjectTemplates/Web.ProjectTemplates/content/BlazorWeb-CSharp/BlazorWeb-CSharp/Components/Account/Pages/Manage/ChangePassword.razor

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,22 +15,22 @@
1515
<h3>Change password</h3>
1616
<StatusMessage Message="@message" />
1717
<div class="row">
18-
<div class="col-md-6">
18+
<div class="col-xl-6">
1919
<EditForm Model="Input" FormName="change-password" OnValidSubmit="OnValidSubmitAsync" method="post">
2020
<DataAnnotationsValidator />
2121
<ValidationSummary class="text-danger" role="alert" />
2222
<div class="form-floating mb-3">
23-
<InputText type="password" @bind-Value="Input.OldPassword" id="Input.OldPassword" class="form-control" autocomplete="current-password" aria-required="true" placeholder="Please enter your old password." />
23+
<InputText type="password" @bind-Value="Input.OldPassword" id="Input.OldPassword" class="form-control" autocomplete="current-password" aria-required="true" placeholder="Enter the old password" />
2424
<label for="Input.OldPassword" class="form-label">Old password</label>
2525
<ValidationMessage For="() => Input.OldPassword" class="text-danger" />
2626
</div>
2727
<div class="form-floating mb-3">
28-
<InputText type="password" @bind-Value="Input.NewPassword" id="Input.NewPassword" class="form-control" autocomplete="new-password" aria-required="true" placeholder="Please enter your new password." />
28+
<InputText type="password" @bind-Value="Input.NewPassword" id="Input.NewPassword" class="form-control" autocomplete="new-password" aria-required="true" placeholder="Enter the new password" />
2929
<label for="Input.NewPassword" class="form-label">New password</label>
3030
<ValidationMessage For="() => Input.NewPassword" class="text-danger" />
3131
</div>
3232
<div class="form-floating mb-3">
33-
<InputText type="password" @bind-Value="Input.ConfirmPassword" id="Input.ConfirmPassword" class="form-control" autocomplete="new-password" aria-required="true" placeholder="Please confirm your new password." />
33+
<InputText type="password" @bind-Value="Input.ConfirmPassword" id="Input.ConfirmPassword" class="form-control" autocomplete="new-password" aria-required="true" placeholder="Enter the new password" />
3434
<label for="Input.ConfirmPassword" class="form-label">Confirm password</label>
3535
<ValidationMessage For="() => Input.ConfirmPassword" class="text-danger" />
3636
</div>

‎src/ProjectTemplates/Web.ProjectTemplates/content/BlazorWeb-CSharp/BlazorWeb-CSharp/Components/Account/Pages/Manage/Email.razor

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818

1919
<StatusMessage Message="@message"/>
2020
<div class="row">
21-
<div class="col-md-6">
21+
<div class="col-xl-6">
2222
<form @onsubmit="OnSendEmailVerificationAsync" @formname="send-verification" id="send-verification-form" method="post">
2323
<AntiforgeryToken />
2424
</form>
@@ -28,7 +28,7 @@
2828
@if (isEmailConfirmed)
2929
{
3030
<div class="form-floating mb-3 input-group">
31-
<input type="text" value="@email" id="email" class="form-control" placeholder="Please enter your email." disabled />
31+
<input type="text" value="@email" id="email" class="form-control" placeholder="Enter your email" disabled />
3232
<div class="input-group-append">
3333
<span class="h-100 input-group-text text-success font-weight-bold">✓</span>
3434
</div>
@@ -38,13 +38,13 @@
3838
else
3939
{
4040
<div class="form-floating mb-3">
41-
<input type="text" value="@email" id="email" class="form-control" placeholder="Please enter your email." disabled />
41+
<input type="text" value="@email" id="email" class="form-control" placeholder="Enter your email" disabled />
4242
<label for="email" class="form-label">Email</label>
4343
<button type="submit" class="btn btn-link" form="send-verification-form">Send verification email</button>
4444
</div>
4545
}
4646
<div class="form-floating mb-3">
47-
<InputText @bind-Value="Input.NewEmail" id="Input.NewEmail" class="form-control" autocomplete="email" aria-required="true" placeholder="Please enter new email." />
47+
<InputText @bind-Value="Input.NewEmail" id="Input.NewEmail" class="form-control" autocomplete="email" aria-required="true" placeholder="Enter a new email" />
4848
<label for="Input.NewEmail" class="form-label">New email</label>
4949
<ValidationMessage For="() => Input.NewEmail" class="text-danger" />
5050
</div>

‎src/ProjectTemplates/Web.ProjectTemplates/content/BlazorWeb-CSharp/BlazorWeb-CSharp/Components/Account/Pages/Manage/EnableAuthenticator.razor

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -48,11 +48,11 @@ else
4848
with a unique code. Enter the code in the confirmation box below.
4949
</p>
5050
<div class="row">
51-
<div class="col-md-6">
51+
<div class="col-xl-6">
5252
<EditForm Model="Input" FormName="send-code" OnValidSubmit="OnValidSubmitAsync" method="post">
5353
<DataAnnotationsValidator />
5454
<div class="form-floating mb-3">
55-
<InputText @bind-Value="Input.Code" id="Input.Code" class="form-control" autocomplete="off" placeholder="Please enter the code." />
55+
<InputText @bind-Value="Input.Code" id="Input.Code" class="form-control" autocomplete="off" placeholder="Enter the code" />
5656
<label for="Input.Code" class="control-label form-label">Verification Code</label>
5757
<ValidationMessage For="() => Input.Code" class="text-danger" />
5858
</div>

‎src/ProjectTemplates/Web.ProjectTemplates/content/BlazorWeb-CSharp/BlazorWeb-CSharp/Components/Account/Pages/Manage/Index.razor

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -15,16 +15,16 @@
1515
<StatusMessage />
1616

1717
<div class="row">
18-
<div class="col-md-6">
18+
<div class="col-xl-6">
1919
<EditForm Model="Input" FormName="profile" OnValidSubmit="OnValidSubmitAsync" method="post">
2020
<DataAnnotationsValidator />
2121
<ValidationSummary class="text-danger" role="alert" />
2222
<div class="form-floating mb-3">
23-
<input type="text" value="@username" id="username" class="form-control" placeholder="Please choose your username." disabled />
23+
<input type="text" value="@username" id="username" class="form-control" placeholder="Choose your username." disabled />
2424
<label for="username" class="form-label">Username</label>
2525
</div>
2626
<div class="form-floating mb-3">
27-
<InputText @bind-Value="Input.PhoneNumber" id="Input.PhoneNumber" class="form-control" placeholder="Please enter your phone number." />
27+
<InputText @bind-Value="Input.PhoneNumber" id="Input.PhoneNumber" class="form-control" placeholder="Enter your phone number" />
2828
<label for="Input.PhoneNumber" class="form-label">Phone number</label>
2929
<ValidationMessage For="() => Input.PhoneNumber" class="text-danger" />
3030
</div>

‎src/ProjectTemplates/Web.ProjectTemplates/content/BlazorWeb-CSharp/BlazorWeb-CSharp/Components/Account/Pages/Manage/SetPassword.razor

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -18,17 +18,17 @@
1818
account so you can log in without an external login.
1919
</p>
2020
<div class="row">
21-
<div class="col-md-6">
21+
<div class="col-xl-6">
2222
<EditForm Model="Input" FormName="set-password" OnValidSubmit="OnValidSubmitAsync" method="post">
2323
<DataAnnotationsValidator />
2424
<ValidationSummary class="text-danger" role="alert" />
2525
<div class="form-floating mb-3">
26-
<InputText type="password" @bind-Value="Input.NewPassword" id="Input.NewPassword" class="form-control" autocomplete="new-password" placeholder="Please enter your new password." />
26+
<InputText type="password" @bind-Value="Input.NewPassword" id="Input.NewPassword" class="form-control" autocomplete="new-password" placeholder="Enter the new password" />
2727
<label for="Input.NewPassword" class="form-label">New password</label>
2828
<ValidationMessage For="() => Input.NewPassword" class="text-danger" />
2929
</div>
3030
<div class="form-floating mb-3">
31-
<InputText type="password" @bind-Value="Input.ConfirmPassword" id="Input.ConfirmPassword" class="form-control" autocomplete="new-password" placeholder="Please confirm your new password." />
31+
<InputText type="password" @bind-Value="Input.ConfirmPassword" id="Input.ConfirmPassword" class="form-control" autocomplete="new-password" placeholder="Enter the new password" />
3232
<label for="Input.ConfirmPassword" class="form-label">Confirm password</label>
3333
<ValidationMessage For="() => Input.ConfirmPassword" class="text-danger" />
3434
</div>

‎src/ProjectTemplates/Web.ProjectTemplates/content/BlazorWeb-CSharp/BlazorWeb-CSharp/Components/Account/Pages/Register.razor

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
<h1>Register</h1>
2121

2222
<div class="row">
23-
<div class="col-md-4">
23+
<div class="col-lg-6">
2424
<StatusMessage Message="@Message" />
2525
<EditForm Model="Input" asp-route-returnUrl="@ReturnUrl" method="post" OnValidSubmit="RegisterUser" FormName="register">
2626
<DataAnnotationsValidator />
@@ -45,7 +45,7 @@
4545
<button type="submit" class="w-100 btn btn-lg btn-primary">Register</button>
4646
</EditForm>
4747
</div>
48-
<div class="col-md-6 col-md-offset-2">
48+
<div class="col-lg-4 col-lg-offset-2">
4949
<section>
5050
<h3>Use another service to register.</h3>
5151
<hr />

‎src/ProjectTemplates/Web.ProjectTemplates/content/BlazorWeb-CSharp/BlazorWeb-CSharp/Components/Account/Shared/ManageLayout.razor

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,10 +11,10 @@
1111
<h2>Change your account settings</h2>
1212
<hr />
1313
<div class="row">
14-
<div class="col-md-3">
14+
<div class="col-lg-3">
1515
<ManageNavMenu />
1616
</div>
17-
<div class="col-md-9">
17+
<div class="col-lg-9">
1818
@Body
1919
</div>
2020
</div>

0 commit comments

Comments
 (0)