Michilis/CashuMints.space
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Wire locale catalogs, repair mint terminology, and confirm login with a toast.

Browse Source 
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
michilis
2026-08-24 22:35:43 +02:00
co-authored by Cursor
parent b95aab2bcd
commit 301679d340
33 changed files with 1570 additions and 963 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/styles/global.css
+65
View File
@@ -1595,6 +1595,71 @@ html.modal-open, html.modal-open body { overflow: hidden; }
.auth-login { padding: 6px 8px; font-size: 13.5px; }
}
/* ---------- toasts ---------- */
/*
* The site's one transient message, bottom right. Rendered by lib/toast.ts, which is
* why nothing in the markup ever mentions it.
*
* It exists for the gap a login leaves: the popup closes the moment the signer
* answers, and the header still says "Log in" until a kind 0 comes back from the
* relays. The box says the login landed and what is still in flight, then names the
* profile and leaves. Same card surface, same border, same entrance as a dialog: it
* is a small modal that nobody has to close.
*/
.toasts {
position: fixed; z-index: 70;
right: var(--page-pad); bottom: 20px;
display: flex; flex-direction: column; align-items: flex-end; gap: 8px;
/* The stack spans nothing the reader can hit; each toast takes its own clicks. */
pointer-events: none;
}
.toast {
pointer-events: auto; cursor: pointer;
width: max-content; max-width: min(330px, calc(100vw - 32px));
display: flex; flex-direction: column; gap: 3px;
background: var(--card); border: 1px solid var(--line); border-radius: 12px;
padding: 11px 14px 12px;
box-shadow: 0 18px 40px rgba(0, 0, 0, .45);
animation: toast-in var(--dur-enter) var(--ease-out) both;
}
/* Leaving is an animation rather than a transition, because the entrance above holds
its end state with `both` and would win against one. */
.toast.is-out { animation: toast-out 200ms var(--ease-in-out) both; }
.toast-title {
display: flex; align-items: center; gap: 8px;
font-size: 14px; font-weight: 600; letter-spacing: -.01em;
}
.toast-body { font-size: 12.5px; color: var(--muted); line-height: 1.45; overflow-wrap: anywhere; }
.toast-body[hidden] { display: none; }
/* The same dot the login popup's status line uses, and it means the same thing. */
.toast.is-busy .toast-title::before,
.toast.is-done .toast-title::before,
.toast.is-error .toast-title::before {
content: ''; width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0;
}
.toast.is-busy .toast-title::before {
background: var(--amber); animation: soft-pulse 1.4s var(--ease-in-out) infinite;
}
.toast.is-done .toast-title::before { background: var(--mint); }
.toast.is-error .toast-title::before { background: var(--red); }
@keyframes toast-in {
from { opacity: 0; transform: translateY(10px) scale(.98); }
to { opacity: 1; transform: none; }
}
@keyframes toast-out {
from { opacity: 1; transform: none; }
to { opacity: 0; transform: translateY(6px); }
}
@media (max-width: 640px) {
/* A thumb's width from each edge, and the box spans what is left rather than
hugging a corner a phone's hand covers. */
.toasts { left: 12px; right: 12px; bottom: 12px; align-items: stretch; }
.toast { width: auto; max-width: none; }
}
/* ---------- write a review ---------- */
/*
* The review dialog. Shares the `.modal` shell above; what follows is only what is