Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to customize theme of FirebaseUI- Web

Tags:

I would like to customize the logo and colors only. Does anyone know a solution? I only saw solutions for android. Below the code.

 if (process.browser) {
      const firebaseui = require('firebaseui')

      console.log(firebaseui)

      const ui =
        firebaseui.auth.AuthUI.getInstance() || new firebaseui.auth.AuthUI(auth)

      const config = {
        credentialHelper: firebaseui.auth.CredentialHelper.NONE,
        signInOptions: [
          authProviders.Google,
          authProviders.Email,
          authProviders.Facebook
        ],
        signInFlow: 'popup',
        tosUrl: '/tos',
        privacyPolicyUrl: '/privacy-policy',
        callbacks: {
          signInSuccessWithAuthResult: this.signInResult
        }
      }
      ui.disableAutoSignIn()

      if (this.$store.state.userNfc) {
        this.openAppPage()
      } else {
        ui.start('#firebaseui-auth-container', config)
      }
    }
  }
like image 316
FabioMelo Avatar asked Jul 27 '20 20:07

FabioMelo


People also ask

What is FirebaseUI?

FirebaseUI is a library built on top of the Firebase Authentication SDK that provides drop-in UI flows for use in your app.


1 Answers

I asked the same question on google and I found nothing. It seems that there isn't interest on make it possible in a proper way : https://github.com/firebase/firebaseui-web/issues/586

I tried the pig old school way overwriting "node_modules/firebaseui/dist/firebaseui.css" on a custom css file.

like image 99
andreu Avatar answered Sep 20 '22 15:09

andreu