Andal.LND/frontend-app-authn
6
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: update username suggestions placement

Browse Source
This commit is contained in:
Shahbaz Shabbir
2023-07-18 05:39:25 +05:00
committed by Shahbaz Shabbir
parent 60578189bd
commit 59fa7d5de3
2 changed files with 21 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/register/registrationFields/UsernameField.jsx
View File

@@ -42,7 +42,7 @@ const UsernameField = (props) => {
iconButton = <IconButton src={Close} iconAs={Icon} alt="Close" onClick={() => handleUsernameSuggestionClose()} variant="black" size="sm" className="username-suggestions__close__button" />;
suggestedUsernameDiv = suggestedUsernames();
} else if (usernameSuggestions.length > 0 && props.value === ' ') {
className = 'username-suggestions';
className = 'username-suggestions d-flex align-items-center';
iconButton = <IconButton src={Close} iconAs={Icon} alt="Close" onClick={() => handleUsernameSuggestionClose()} variant="black" size="sm" className="username-suggestions__close__button" />;
suggestedUsernameDiv = suggestedUsernames();
} else if (usernameSuggestions.length > 0 && errorMessage) {

22
src/sass/_registration.scss
View File

@@ -67,7 +67,7 @@
.username-suggestions {
position: relative;
margin-top: -8.7%;
margin-top: -2.5rem;
margin-left: 15px;
}
@@ -84,8 +84,26 @@
}
.username-scroll-suggested--form-field {
width: 21rem;
width: 20rem;
white-space: nowrap;
overflow-x: auto;
display: inline-flex;
}
@media (max-width: 372px) {
.username-scroll-suggested--form-field {
width: 11rem !important;
}
.username-suggestions__close__button {
right: 0.5rem;
}
}
@media (max-width: map-get($grid-breakpoints, "sm")) {
.username-scroll-suggested--form-field {
width: 15rem;
}
.username-suggestions__close__button {
right: 0.5rem;
}
}