如何编写用于Firebase身份验证的红色电子邮件登录按钮？

<button id="email-login-button" class="red-button">红色电子邮件登录按钮</button>

.red-button {
  background-color: red;
  color: white;
  padding: 10px 20px;
  border: none;
  border-radius: 5px;
  cursor: pointer;
}

// 获取按钮元素
var emailLoginButton = document.getElementById("email-login-button");

// 添加点击事件监听器
emailLoginButton.addEventListener("click", function() {
  // 在此处编写Firebase身份验证的红色电子邮件登录逻辑
  // 可以使用Firebase的Auth API进行身份验证操作
});

<script src="https://www.gstatic.com/firebasejs/9.0.2/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.0.2/firebase-auth.js"></script>

// Firebase初始化配置
var firebaseConfig = {
  apiKey: "YOUR_API_KEY",
  authDomain: "YOUR_AUTH_DOMAIN",
  projectId: "YOUR_PROJECT_ID",
  // 其他配置项...
};

// 初始化Firebase应用
firebase.initializeApp(firebaseConfig);

// 获取按钮元素
var emailLoginButton = document.getElementById("email-login-button");

// 添加点击事件监听器
emailLoginButton.addEventListener("click", function() {
  // 获取用户的电子邮件和密码
  var email = "user@example.com";
  var password = "password123";

  // 使用Firebase的Auth API进行电子邮件登录
  firebase.auth().signInWithEmailAndPassword(email, password)
    .then(function(userCredential) {
      // 登录成功，可以在此处进行相关操作
      var user = userCredential.user;
      console.log("用户登录成功:", user);
    })
    .catch(function(error) {
      // 登录失败，可以在此处处理错误
      var errorCode = error.code;
      var errorMessage = error.message;
      console.error("登录失败:", errorCode, errorMessage);
    });
});