💄(react) make Modal close button sticky

We want to make sure this button is always visible inside scrollable
modals.

Fixes #278
This commit is contained in:
Nathan Vasse
2024-02-28 12:22:22 +01:00
committed by NathanVss
parent c5e5d9fa85
commit 680365a117
3 changed files with 19 additions and 4 deletions

View File

@@ -69,9 +69,19 @@
}
&__close {
position: absolute;
top: 0.75rem;
right: 0.75rem;
position: sticky;
top: 0;
display: flex;
justify-content: end;
z-index: 1;
height: 0;
.c__button {
right: -0.75rem;
top: -0.75rem;
position: relative;
background: var(--c--components--modal--background-color);
}
}
&__footer {

View File

@@ -132,7 +132,7 @@ export const ModalInner = (props: ModalProps) => {
<Button
icon={<span className="material-icons">close</span>}
color="tertiary-text"
size="nano"
size="small"
onClick={() => props.onClose()}
/>
</div>