admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Add blue focus on text inputs (#8343)

Browse Source 
We removed the blue focus on phone/domain/array/email floating inputs
but we want to keep it in the app settings.

<img width="644" alt="Screenshot 2024-11-05 at 15 55 04"
src="https://github.com/user-attachments/assets/afcbe6b2-2d6b-4e0d-8397-4268d529127c">
<img width="606" alt="Screenshot 2024-11-05 at 15 55 23"
src="https://github.com/user-attachments/assets/004becf8-41e7-45d6-9ad9-9e487b8db8f3">
<img width="351" alt="Screenshot 2024-11-05 at 15 55 33"
src="https://github.com/user-attachments/assets/6a4c06e6-04d3-46bf-940b-9fd61ee91995">
<img width="330" alt="Screenshot 2024-11-05 at 15 55 41"
src="https://github.com/user-attachments/assets/e6fc8bbd-eca3-47bc-93f1-d6ff8d3d8a13">
<img width="588" alt="Screenshot 2024-11-05 at 15 56 07"
src="https://github.com/user-attachments/assets/0d0f5e80-3501-4346-94a1-6ea4b77ee7ba">
<img width="211" alt="Screenshot 2024-11-05 at 15 56 31"
src="https://github.com/user-attachments/assets/9cd85f4d-8052-4c6b-a694-84c691c6217d">
This commit is contained in:
Félix Malfait
2024-11-06 14:23:34 +01:00
committed by GitHub
parent 5a293b8d60
commit b627c55b9a
9 changed files with 58 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
packages/twenty-front/src/modules/auth/sign-in-up/components/SignInUpForm.tsx
View File

@ -73,6 +73,15 @@ export const SignInUpForm = () => {
submitSSOEmail,
} = useSignInUp(form);
if (
signInUpStep === SignInUpStep.Init &&
!authProviders.google &&
!authProviders.microsoft &&
!authProviders.sso
) {
continueWithEmail();
}
const toggleSSOMode = () => {
if (signInUpStep === SignInUpStep.SSOEmail) {
continueWithEmail();
@ -155,6 +164,9 @@ export const SignInUpForm = () => {
Icon={() => <IconGoogle size={theme.icon.size.lg} />}
title="Continue with Google"
onClick={signInWithGoogle}
variant={
signInUpStep === SignInUpStep.Init ? undefined : 'secondary'
}
fullWidth
/>
<HorizontalSeparator visible={false} />
@ -167,6 +179,9 @@ export const SignInUpForm = () => {
Icon={() => <IconMicrosoft size={theme.icon.size.lg} />}
title="Continue with Microsoft"
onClick={signInWithMicrosoft}
variant={
signInUpStep === SignInUpStep.Init ? undefined : 'secondary'
}
fullWidth
/>
<HorizontalSeparator visible={false} />
@ -176,6 +191,9 @@ export const SignInUpForm = () => {
<>
<MainButton
Icon={() => <IconKey size={theme.icon.size.lg} />}
variant={
signInUpStep === SignInUpStep.Init ? undefined : 'secondary'
}
title={
signInUpStep === SignInUpStep.SSOEmail
? 'Continue with email'
@ -282,9 +300,11 @@ export const SignInUpForm = () => {
</StyledFullWidthMotionDiv>
)}
<MainButton
variant="secondary"
title={buttonTitle}
type="submit"
variant={
signInUpStep === SignInUpStep.Init ? 'secondary' : 'primary'
}
onClick={async () => {
if (signInUpStep === SignInUpStep.Init) {
continueWithEmail();
@ -301,7 +321,7 @@ export const SignInUpForm = () => {
setShowErrors(true);
form.handleSubmit(submitCredentials)();
}}
Icon={() => form.formState.isSubmitting && <Loader />}
Icon={() => (form.formState.isSubmitting ? <Loader /> : null)}
disabled={isSubmitButtonDisabled}
fullWidth
/>