Page MenuHomePhorge
Files F32562035

D12086.1767330877.diff
No OneTemporary
Actions

Size
1 KB
Referenced Files
None
Subscribers
None

D12086.1767330877.diff
View Options

diff --git a/web/account/log-in-form.css b/web/account/log-in-form.css
--- a/web/account/log-in-form.css
+++ b/web/account/log-in-form.css
@@ -36,10 +36,19 @@
}
div.form_footer > button:disabled {
- min-height: 48px;
opacity: 0.5;
}
+div.loadingIndicator {
+ position: absolute;
+}
+div.hiddenLoadingIndicator {
+ display: none;
+}
+div.invisibleButtonText {
+ visibility: hidden;
+}
+
div.modal_form_error {
font-size: 14px;
color: var(--error);
diff --git a/web/account/traditional-login-form.react.js b/web/account/traditional-login-form.react.js
--- a/web/account/traditional-login-form.react.js
+++ b/web/account/traditional-login-form.react.js
@@ -186,12 +186,23 @@
],
);
- const loginButtonContent = React.useMemo(() => {
- if (inputDisabled) {
- return <LoadingIndicator status="loading" />;
- }
- return 'Sign in';
- }, [inputDisabled]);
+ const loadingIndicatorClassName = inputDisabled
+ ? css.loadingIndicator
+ : css.hiddenLoadingIndicator;
+ const buttonTextClassName = inputDisabled
+ ? css.invisibleButtonText
+ : undefined;
+ const loginButtonContent = React.useMemo(
+ () => (
+ <>
+ <div className={loadingIndicatorClassName}>
+ <LoadingIndicator status="loading" />
+ </div>
+ <div className={buttonTextClassName}>Sign in</div>
+ </>
+ ),
+ [loadingIndicatorClassName, buttonTextClassName],
+ );
const signInButtonColor = React.useMemo(
() => ({ backgroundColor: '#6A20E3' }),

File Metadata

Mime Type
text/plain
Expires
Fri, Jan 2, 5:14 AM (8 h, 8 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5876761
Default Alt Text
D12086.1767330877.diff (1 KB)

Event Timeline