FusionAuth / fusionauth-quickstart-javascript-vue-web

Other
0 stars 0 forks source link

Typo in Width Property Resulting in Check Mark Not Fully Displaying #8

Closed BriDavidson closed 5 months ago

BriDavidson commented 5 months ago

Description There appears to be a typo on the width property value for input[type="checkbox"]:checked:after located in the kickstart > styles.css file that is resulting in the checkmark not fully displaying within the checkbox on the login page.

Steps to Reproduce Navigate to the login page on port 9011 Click the checkbox to "Keep me signed in" and ensure that it is in the checked state Observe the checkmark positioning within the checkbox

Expected Result Checkmark should fully display within the checkbox

Actual Result We can see that the checkmark is not in proper positioning relative to the checkbox. This is due to the added space between the width value and rem


input[type="checkbox"]:checked:after {
  content: '';
  background: transparent;
  border: 2px solid #fff;
  border-right: none;
  border-top: none;
  height: .25rem;
  left: .25rem;
  top: .3125rem;
  transform: rotate(-46deg);
  **width: .625 rem;**
  display: block;
  position: absolute;
}
**```
Recommendation**

Remove the space between the width value and unit of measurement located in the kickstart > [styles.css] file

Please let me know if further information or clarification is needed.
JakeLo123 commented 5 months ago

Closing - https://github.com/FusionAuth/fusionauth-quickstart-javascript-vue-web/pull/9