這段JavaScript代碼主要在處理輸入框的開啟、關閉以及切換功能

function open() {
    target.showModal();
    target.focus();
}

此段為開啟輸入框的功能

function close() {
    target.close();

}
此段為開啟輸入框的功能

function toggle() {
target.open ? close() : open();

}
此段為切換輸入框的開關狀態

const buttons = document.querySelectorAll(`[aria-controls="${target.id}"]`);
for (const button of buttons) {
    button.addEventListener("click", () => {
        toggle();
    });
}

選取所有與這個輸入框關聯的按鈕並設定點擊事件

target.addEventListener("click", (event) => {
    const boundingRect = modal.getBoundingClientRect();
    const isInDialog = boundingRect.top <= event.clientY &&
        event.clientY <= boundingRect.top + boundingRect.height &&
        boundingRect.left <= event.clientX &&
        event.clientX <= boundingRect.left + boundingRect.width;

    if (!isInDialog) close();
});

檢查點擊是否發生在輸入框外，是的話則關閉輸入框

由不同div容器設定登入表單區塊，包括標題"Xplore"、副標題"Hi Designer"、文字信息"Welcome to Xplore"、電子郵件及密碼輸入框

設定Remember me的勾選框以及Forget password的連結
最後一條設定了一條水平分隔線，並顯示文字 "or"

提示詢問"Don’t have an account?"並提供"Register"連結

設置Google快速登入按鈕