modify btn class names

apps/app/src/components/CompleteUserRegistrationForm.module.scss

@@ -2,7 +2,7 @@
 
 :root {
   .complete-user-registration-form :global {
-    .register-btn {
+    .btn-register {
       @extend %btn-nologin;
       @extend %btn-register;
     }

apps/app/src/components/CompleteUserRegistrationForm.tsx

@@ -184,7 +184,7 @@ const CompleteUserRegistrationForm: React.FC<Props> = (props: Props) => {
                 <button
                   type="button"
                   disabled={forceDisableForm || disableForm}
-                  className="btn btn-secondary register-btn col-6 mx-auto d-flex justify-content-between"
+                  className="btn btn-secondary btn-register col-6 mx-auto d-flex"
                 >
                   <span>
                     <span className="material-symbols-outlined">person_add</span>

apps/app/src/components/InstallerForm.module.scss

@@ -2,7 +2,7 @@
 
 :root {
   .installer-form :global {
-    .register-btn {
+    .btn-register {
       @extend %btn-nologin;
       @extend %btn-register;
     }

apps/app/src/components/InstallerForm.tsx

@@ -214,7 +214,7 @@ const InstallerForm = memo((): JSX.Element => {
             <button
               data-testid="btnSubmit"
               type="submit"
-              className="btn btn-secondary register-btn col-6 d-flex justify-content-between"
+              className="btn btn-secondary btn-register col-6 d-flex"
               disabled={isLoading}
             >
               <span>

apps/app/src/components/LoginForm.module.scss

@@ -59,47 +59,47 @@
       @extend %btn-nologin;
     }
 
-    .register-btn {
+    .btn-register {
       @extend %btn-register;
     }
 
-    .login-btn {
+    .btn-login {
       --bs-btn-bg: #{rgba(#204986, 0.6)};
       --bs-btn-hover-bg: #{rgba(#204986, 0.8)};
       --bs-btn-active-bg: #{rgba(#204986, 0.8)};
     }
 
-    .function-btn {
+    .btn-function {
       --bs-btn-bg: #{rgba(bs.$gray-800, 0.8)};
       --bs-btn-hover-bg: #{rgba(bs.$gray-800, 0.5)};
       --bs-btn-active-bg: #{rgba(bs.$gray-800, 0.5)};
     }
 
-    .google-btn {
+    .btn-auth-google {
       --bs-btn-bg: #{rgba(#4285F4, 0.4)};
       --bs-btn-hover-bg: #{rgba(#4285F4, 0.8)};
       --bs-btn-active-bg: #{rgba(#4285F4, 0.8)};
     }
 
-    .github-btn {
+    .btn-auth-github {
       --bs-btn-bg: #{rgba(#403D3E, 0.4)};
       --bs-btn-hover-bg: #{rgba(#403D3E, 0.7)};
       --bs-btn-active-bg: #{rgba(#403D3E, 0.7)};
     }
 
-    .facebook-btn {
+    .btn-auth-facebook {
       --bs-btn-bg: #{rgba(#29487d, 0.4)};
       --bs-btn-hover-bg: #{rgba(#29487d, 0.9)};
       --bs-btn-active-bg: #{rgba(#29487d, 0.9)};
     }
 
-    .oidc-btn {
+    .btn-auth-oidc {
       --bs-btn-bg: #{rgba(#835B1A, 0.4)};
       --bs-btn-hover-bg: #{rgba(#835B1A, 0.8)};
       --bs-btn-active-bg: #{rgba(#835B1A, 0.8)};
     }
 
-    .saml-btn {
+    .btn-auth-saml {
       --bs-btn-bg: #{rgba(#138957, 0.4)};
       --bs-btn-hover-bg: #{rgba(#138957, 0.7)};
       --bs-btn-active-bg: #{rgba(#138957, 0.7)};

apps/app/src/components/LoginForm.tsx

@@ -236,7 +236,7 @@ export const LoginForm = (props: LoginFormProps): JSX.Element => {
           <div className="input-group my-4">
             <button
               type="submit"
-              className="btn btn-secondary login-btn col-6 mx-auto d-flex justify-content-between"
+              className="btn btn-secondary btn-login col-6 mx-auto d-flex justify-content-between"
               data-testid="btnSubmitForLogin"
               disabled={isLoading}
             >
@@ -274,7 +274,7 @@ export const LoginForm = (props: LoginFormProps): JSX.Element => {
       oidc: <span className="growi-custom-icons align-bottom">openid</span>,
       saml: <span className="material-symbols-outlined align-bottom">key</span>,
     };
-    const authBtn = `${auth}-btn`;
+    const authBtn = `btn-auth-${auth}`;
     const signin = {
       google: 'Google',
       github: 'GitHub',
@@ -506,7 +506,7 @@ export const LoginForm = (props: LoginFormProps): JSX.Element => {
           <div className="input-group justify-content-center my-4">
             <button
               type="submit"
-              className="btn btn-secondary register-btn d-flex col-7"
+              className="btn btn-secondary btn-register d-flex col-7"
               disabled={(!isMailerSetup && isEmailAuthenticationEnabled) || isLoading}
             >
               <span>
@@ -525,7 +525,7 @@ export const LoginForm = (props: LoginFormProps): JSX.Element => {
           <div className="text-end col-12 mb-5">
             <a
               href="#register"
-              className="d-block btn btn-secondary function-btn col-10 col-sm-9 mx-auto py-1"
+              className="d-block btn btn-secondary btn-function col-10 col-sm-9 mx-auto py-1"
               style={{ pointerEvents: isLoading ? 'none' : 'auto' }}
               onClick={switchForm}
             >
@@ -558,7 +558,7 @@ export const LoginForm = (props: LoginFormProps): JSX.Element => {
                   <div className="mt-4">
                     <a
                       href="/forgot-password"
-                      className="d-block btn btn-secondary function-btn col-10 col-sm-9 mx-auto py-1"
+                      className="d-block btn btn-secondary btn-function col-10 col-sm-9 mx-auto py-1"
                       style={{ pointerEvents: isLoading ? 'none' : 'auto' }}
                     >
                       <span className="material-symbols-outlined me-2 fs-5">vpn_key</span>{t('forgot_password.forgot_password')}
@@ -570,7 +570,7 @@ export const LoginForm = (props: LoginFormProps): JSX.Element => {
                   <div className="mt-2 mb-5">
                     <a
                       href="#register"
-                      className="d-block btn btn-secondary function-btn function-btn col-10 col-sm-9 mx-auto py-1"
+                      className="d-block btn btn-secondary btn-function col-10 col-sm-9 mx-auto py-1"
                       style={{ pointerEvents: isLoading ? 'none' : 'auto' }}
                       onClick={switchForm}
                     >