fix(ui): Disclaimer-Modal Scroll und Schließen-Button

Ein Scrollbereich im Hinweis-Dialog, Body-Lock beim Öffnen, X oben rechts an der Karte.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
2026-06-01 19:42:56 +02:00
co-authored by Cursor
parent d261a1e7ca
commit 837bcfe287
3 changed files with 36 additions and 18 deletions
+20 -7
View File
@@ -567,18 +567,16 @@ html.scheme-dark .themed-select-option.is-selected {
} }
.registration-disclaimer--modal { .registration-disclaimer--modal {
position: relative;
width: min(560px, calc(100vw - 32px)); width: min(560px, calc(100vw - 32px));
margin: 0; margin: 0;
} }
.registration-disclaimer .auth-header {
position: relative;
}
.registration-disclaimer__close { .registration-disclaimer__close {
position: absolute; position: absolute;
top: 0; top: 12px;
right: 0; right: 12px;
z-index: 1;
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@@ -604,6 +602,7 @@ html.scheme-dark .themed-select-option.is-selected {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 16px; padding: 16px;
overflow: hidden;
background: rgba(2, 6, 23, 0.72); background: rgba(2, 6, 23, 0.72);
} }
@@ -611,7 +610,20 @@ html.scheme-dark .themed-select-option.is-selected {
width: 100%; width: 100%;
max-width: 560px; max-width: 560px;
max-height: min(90vh, 820px); max-height: min(90vh, 820px);
overflow-y: auto; display: flex;
flex-direction: column;
min-height: 0;
overflow: hidden;
}
.disclaimer-modal-panel > .registration-disclaimer {
flex: 1 1 auto;
min-height: 0;
max-height: 100%;
width: 100%;
max-width: 100%;
overflow: hidden;
box-sizing: border-box;
} }
.feedback-modal { .feedback-modal {
@@ -910,6 +922,7 @@ html.scheme-dark .themed-select-option.is-selected {
.registration-disclaimer__sections { .registration-disclaimer__sections {
flex: 1; flex: 1;
min-height: 0;
overflow-y: auto; overflow-y: auto;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
+6 -1
View File
@@ -13,7 +13,12 @@ export default function DisclaimerModal({ open, onClose }: DisclaimerModalProps)
if (event.key === 'Escape') onClose() if (event.key === 'Escape') onClose()
} }
window.addEventListener('keydown', onKeyDown) window.addEventListener('keydown', onKeyDown)
return () => window.removeEventListener('keydown', onKeyDown) const prevOverflow = document.body.style.overflow
document.body.style.overflow = 'hidden'
return () => {
window.removeEventListener('keydown', onKeyDown)
document.body.style.overflow = prevOverflow
}
}, [open, onClose]) }, [open, onClose])
if (!open) return null if (!open) return null
@@ -28,9 +28,6 @@ export default function RegistrationDisclaimer({
className={`auth-card glass registration-disclaimer${variant === 'view' ? ' registration-disclaimer--modal' : ''}`} className={`auth-card glass registration-disclaimer${variant === 'view' ? ' registration-disclaimer--modal' : ''}`}
role="document" role="document"
> >
<div className="auth-header">
<ScrollText className="auth-icon accent" size={48} />
<h2>{t('disclaimer.title')}</h2>
{variant === 'view' && ( {variant === 'view' && (
<button <button
type="button" type="button"
@@ -41,6 +38,9 @@ export default function RegistrationDisclaimer({
<X size={18} /> <X size={18} />
</button> </button>
)} )}
<div className="auth-header">
<ScrollText className="auth-icon accent" size={48} />
<h2>{t('disclaimer.title')}</h2>
</div> </div>
<p className="registration-disclaimer__intro">{t('disclaimer.intro')}</p> <p className="registration-disclaimer__intro">{t('disclaimer.intro')}</p>