From cd6f2b3cbc8dc20c26c6f92f5c0ef3ae906fc2f0 Mon Sep 17 00:00:00 2001
From: Claire <claire.github-309c@sitedethib.com>
Date: Mon, 7 Aug 2023 17:58:29 +0200
Subject: [PATCH] Fix interaction modal layout (#26368)

---
 .../features/interaction_modal/index.jsx      | 47 ++++++-------------
 .../features/ui/components/sign_in_banner.jsx |  4 +-
 2 files changed, 16 insertions(+), 35 deletions(-)

diff --git a/app/javascript/mastodon/features/interaction_modal/index.jsx b/app/javascript/mastodon/features/interaction_modal/index.jsx
index a8b86b7212..220719a94a 100644
--- a/app/javascript/mastodon/features/interaction_modal/index.jsx
+++ b/app/javascript/mastodon/features/interaction_modal/index.jsx
@@ -331,36 +331,24 @@ class InteractionModal extends React.PureComponent {
     }
 
     let signupButton;
-    let signUpOrSignInButton;
 
     if (sso_redirect) {
-      signUpOrSignInButton = (
-        <a href={sso_redirect} data-method='post' className='button button--block button-tertiary'>
-          <FormattedMessage id='sign_in_banner.sso_redirect' defaultMessage='Login or Register' />
+      signupButton = (
+        <a href={sso_redirect} data-method='post' className='link-button'>
+          <FormattedMessage id='sign_in_banner.create_account' defaultMessage='Create account' />
         </a>
-      )
+      );
+    } else if (registrationsOpen) {
+      signupButton = (
+        <a href='/auth/sign_up' className='link-button'>
+          <FormattedMessage id='sign_in_banner.create_account' defaultMessage='Create account' />
+        </a>
+      );
     } else {
-      if(registrationsOpen) {
-        signupButton = (
-          <a href='/auth/sign_up' className='link-button'>
-            <FormattedMessage id='sign_in_banner.create_account' defaultMessage='Create account' />
-          </a>
-        );
-      } else {
-        signupButton = (
-          <button className='button button--block button-tertiary' onClick={this.handleSignupClick}>
-            <FormattedMessage id='sign_in_banner.create_account' defaultMessage='Create account' />
-          </button>
-        );
-      }
-
-      signUpOrSignInButton = (
-        <>
-          <a href='/auth/sign_in' className='button button--block'>
-            <FormattedMessage id='sign_in_banner.sign_in' defaultMessage='Login' />
-          </a>
-          {signupButton}
-        </>
+      signupButton = (
+        <button className='link-button' onClick={this.handleSignupClick}>
+          <FormattedMessage id='sign_in_banner.create_account' defaultMessage='Create account' />
+        </button>
       );
     }
 
@@ -371,13 +359,6 @@ class InteractionModal extends React.PureComponent {
           <p>{actionDescription} <strong><FormattedMessage id='interaction_modal.sign_in' defaultMessage='You are not logged in to this server. Where is your account hosted?' /></strong></p>
         </div>
 
-        <div className='interaction-modal__choices'>
-          <div className='interaction-modal__choices__choice'>
-            <h3><FormattedMessage id='interaction_modal.on_this_server' defaultMessage='On this server' /></h3>
-            {signUpOrSignInButton}
-          </div>
-        </div>
-
         <IntlLoginForm resourceUrl={url} />
 
         <p className='hint'><FormattedMessage id='interaction_modal.sign_in_hint' defaultMessage="Tip: That's the website where you signed up. If you don't remember, look for the welcome e-mail in your inbox. You can also enter your full username! (e.g. @Mastodon@mastodon.social)" /></p>
diff --git a/app/javascript/mastodon/features/ui/components/sign_in_banner.jsx b/app/javascript/mastodon/features/ui/components/sign_in_banner.jsx
index db85c6cbfb..d5f0c00dca 100644
--- a/app/javascript/mastodon/features/ui/components/sign_in_banner.jsx
+++ b/app/javascript/mastodon/features/ui/components/sign_in_banner.jsx
@@ -17,9 +17,9 @@ const SignInBanner = () => {
 
   let signupButton;
 
-      const signupUrl = useAppSelector((state) => state.getIn(['server', 'server', 'registrations', 'url'], null) || '/auth/sign_up');
+  const signupUrl = useAppSelector((state) => state.getIn(['server', 'server', 'registrations', 'url'], null) || '/auth/sign_up');
 
-      if (sso_redirect) {
+  if (sso_redirect) {
     return (
       <div className='sign-in-banner'>
         <p><FormattedMessage id='sign_in_banner.text' defaultMessage='Login to follow profiles or hashtags, favorite, share and reply to posts. You can also interact from your account on a different server.' /></p>