diff --git a/src/components/ContentComponents/Konnector/KonnectorForm.tsx b/src/components/ContentComponents/Konnector/KonnectorForm.tsx index c2fb1577b620935b80450c6e191de52301796c87..cfd77ac8e05f1568b8dcd8081b8d07ef37cb5f95 100644 --- a/src/components/ContentComponents/Konnector/KonnectorForm.tsx +++ b/src/components/ContentComponents/Konnector/KonnectorForm.tsx @@ -111,13 +111,13 @@ const KonnectorForm: React.FC<KonnectorFormProps> = ({ </span> </div> - <div className="koauthform-button"> - <StyledNoOauthButton type="submit" color="primary"> - <div className="oauthform-button-content"> - <div className="oauthform-button-content-icon"> + <div className="knooauthform-button"> + <StyledNoOauthButton type="submit" color="primary" disabled={loading}> + <div className="nooauthform-button-content"> + <div className="nooauthform-button-content-icon"> {icon && <StyledIcon icon={icon} size={48} />} </div> - <div className="oauthform-button-text text-18-bold"> + <div className="nooauthform-button-text text-18-bold"> <div> {t('nooauth.connection.text')}{' '} {t('nooauth.' + fluidConfig.name + '.text')} @@ -127,7 +127,7 @@ const KonnectorForm: React.FC<KonnectorFormProps> = ({ </StyledNoOauthButton> </div> <br /> - <div className="koauthform-text text-16-bold"> + <div className="knooauthform-text text-16-bold"> <div className="text-16-bold"> {t('nooauth.creation.no_account')}{' '} {t('nooauth.' + fluidConfig.name + '.text')} ? diff --git a/src/styles/components/_konnector.scss b/src/styles/components/_konnector.scss index f12600f8c40f89692e245945242f78f4f827865b..41704c852f6f11da08a06f696df59a76f3bb106e 100644 --- a/src/styles/components/_konnector.scss +++ b/src/styles/components/_konnector.scss @@ -126,6 +126,21 @@ } } +// KonnectorForm +.knooauthform{ + margin: 0 1.5rem; + @media #{$large-phone} { + margin: 0; + } + .knooauthform-text{ + color: $text-bright; + padding-top: 1rem; + } + .knooauthform-button{ + margin-bottom: 1rem; + } +} + // KonnectorLoading .kload-content { margin: 0.5rem 1.5rem; diff --git a/src/styles/components/_nooauth.scss b/src/styles/components/_nooauth.scss new file mode 100644 index 0000000000000000000000000000000000000000..3c418a4b553fd30597da402e6d05b9398d5927b9 --- /dev/null +++ b/src/styles/components/_nooauth.scss @@ -0,0 +1,17 @@ +@import '../base/color'; +@import '../base/breakpoint'; + +.nooauthform-button-content{ + display: flex; + justify-content: center; + align-items: center; + .nooauthform-button-content-icon{ + margin: 0 1.375rem; + } + .nooauthform-button-text{ + display: flex; + flex-direction: column; + align-items: flex-start; + text-align: left; + } +} \ No newline at end of file diff --git a/src/styles/index.scss b/src/styles/index.scss index 840c8d99c5335c425aec2a8b469b6b8318629034..3844047faac0fc9594ef183f76a91e9f57b1650e 100644 --- a/src/styles/index.scss +++ b/src/styles/index.scss @@ -23,6 +23,7 @@ @import 'components/faq'; @import 'components/splash'; @import 'components/oauth'; +@import 'components/nooauth'; :root { --blue: #{$blue};