barbercollie/tinyauth
1
0
Fork 1
mirror of https://github.com/steveiliop56/tinyauth.git synced 2026-03-10 16:52:00 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: card title and layout tweaks (#675)

Browse Source 
* refactor: card title and layout tweaks

* chore: review comments

* refactor: update domain warning screen
This commit is contained in:
Stavros
2026-03-01 13:36:43 +02:00
committed by GitHub
parent 89da4028bb
commit d0e39c6149
20 changed files with 356 additions and 142 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
frontend/src/components/domain-warning/domain-warning.tsx
View File

@@ -1,12 +1,12 @@
import {
Card,
CardDescription,
CardContent,
CardFooter,
CardHeader,
CardTitle,
} from "../ui/card";
import { Button } from "../ui/button";
import { Trans, useTranslation } from "react-i18next";
import { useTranslation } from "react-i18next";
import { useLocation } from "react-router";
interface Props {
@@ -24,23 +24,26 @@ export const DomainWarning = (props: Props) => {
const redirectUri = searchParams.get("redirect_uri");
return (
<Card role="alert" aria-live="assertive" className="min-w-xs sm:min-w-sm">
<Card role="alert" aria-live="assertive">
<CardHeader>
<CardTitle className="text-3xl">{t("domainWarningTitle")}</CardTitle>
<CardDescription>
<Trans
t={t}
i18nKey="domainWarningSubtitle"
values={{ appUrl, currentUrl }}
components={{ code: <code /> }}
shouldUnescape={true}
/>
</CardDescription>
<CardTitle className="text-xl">{t("domainWarningTitle")}</CardTitle>
</CardHeader>
<CardFooter className="flex flex-col items-stretch gap-2">
<Button onClick={onClick} variant="warning">
{t("ignoreTitle")}
</Button>
<CardContent className="flex flex-col gap-3 text-sm mb-1.25">
<p className="text-muted-foreground">{t("domainWarningSubtitle")}</p>
<pre>
<span className="text-muted-foreground">
{t("domainWarningExpected")}&nbsp;
<span className="text-primary">{appUrl}</span>
</span>
</pre>
<pre>
<span className="text-muted-foreground">
{t("domainWarningCurrent")}&nbsp;
<span className="text-primary">{currentUrl}</span>
</span>
</pre>
</CardContent>
<CardFooter className="flex flex-col items-stretch gap-3">
<Button
onClick={() =>
window.location.assign(
@@ -51,6 +54,9 @@ export const DomainWarning = (props: Props) => {
>
{t("goToCorrectDomainTitle")}
</Button>
<Button onClick={onClick} variant="warning">
{t("ignoreTitle")}
</Button>
</CardFooter>
</Card>
);