ux: disable auto-open AuthModal, make Abbrechen always visible, translate tabs, and show SSO option on guest tab
All checks were successful
Build & Push Docker Image to Gitea Registry / build-and-push (push) Successful in 2m37s
All checks were successful
Build & Push Docker Image to Gitea Registry / build-and-push (push) Successful in 2m37s
This commit is contained in:
@@ -103,10 +103,10 @@ export default function AuthModal() {
|
||||
|
||||
<label
|
||||
htmlFor="auth-modal"
|
||||
className={"modal" + (session?.user === null ? " modal-open" : "")}
|
||||
className="modal cursor-pointer"
|
||||
>
|
||||
<label className="modal-box flex max-w-sm flex-col gap-4 pt-2">
|
||||
<div className="tabs flex-nowap w-full">
|
||||
<div className="modal-box flex max-w-sm flex-col gap-4 pt-2 relative">
|
||||
<div className="tabs flex-nowrap w-full">
|
||||
<span
|
||||
onClick={() => {
|
||||
setActiveTab("guest");
|
||||
@@ -118,7 +118,7 @@ export default function AuthModal() {
|
||||
: " text-base-content border-opacity-10 hover:border-opacity-30")
|
||||
}
|
||||
>
|
||||
Guest
|
||||
Gast
|
||||
</span>
|
||||
<span
|
||||
onClick={() => setActiveTab("login")}
|
||||
@@ -129,7 +129,7 @@ export default function AuthModal() {
|
||||
: " text-base-content border-opacity-10 hover:border-opacity-30")
|
||||
}
|
||||
>
|
||||
Login
|
||||
Anmelden
|
||||
</span>
|
||||
<span
|
||||
onClick={() => setActiveTab("register")}
|
||||
@@ -140,32 +140,30 @@ export default function AuthModal() {
|
||||
: " text-base-content border-opacity-10 hover:border-opacity-30")
|
||||
}
|
||||
>
|
||||
Register
|
||||
Registrieren
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<form className="flex flex-col px-2" onSubmit={submitAuth}>
|
||||
{activeTab === "guest" && (
|
||||
<Guest currentName={session?.user?.name || "unknown user"} />
|
||||
<Guest currentName={session?.user?.name || "Gast"} />
|
||||
)}
|
||||
{activeTab === "login" && <Login />}
|
||||
{activeTab === "register" && <Register />}
|
||||
|
||||
{serverMessage && <div className="text-error mt-2">{serverMessage}</div>}
|
||||
<div className="modal-action items-center">
|
||||
{session?.user !== null && (
|
||||
<label htmlFor="auth-modal" className="btn btn-ghost">
|
||||
Close
|
||||
Abbrechen
|
||||
</label>
|
||||
)}
|
||||
<button className={"btn" + (buttonLoading ? " loading" : "")} type="submit">
|
||||
{activeTab === "guest" && "Confirm"}
|
||||
{activeTab === "login" && "Login"}
|
||||
{activeTab === "register" && "Register"}
|
||||
<button className={"btn btn-primary" + (buttonLoading ? " loading" : "")} type="submit">
|
||||
{activeTab === "guest" && "Als Gast spielen"}
|
||||
{activeTab === "login" && "Anmelden"}
|
||||
{activeTab === "register" && "Registrieren"}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{activeTab !== "guest" && ssoEnabled && (
|
||||
{ssoEnabled && (
|
||||
<>
|
||||
<div className="divider opacity-70">oder</div>
|
||||
<a
|
||||
@@ -184,12 +182,12 @@ export default function AuthModal() {
|
||||
clipRule="evenodd"
|
||||
/>
|
||||
</svg>
|
||||
Login mit Keycloak
|
||||
Anmelden mit Keycloak
|
||||
</a>
|
||||
</>
|
||||
)}
|
||||
</form>
|
||||
</label>
|
||||
</div>
|
||||
</label>
|
||||
</>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user