What does modal offset do?

[Toshinaki]

I'm very confused about the offset of Modal:
https://mantine.dev/core/modal/#change-offsets

<Modal opened={opened} onClose={close} title="Authentication" yOffset="1vh" xOffset={0}>
  {/* Modal content */}
</Modal>

Setting offset does not seem to affect the position of the modal. I can see some padding and size is calculated based on the offset, but feel difficult to understand the purpose.

Is there any way we could change the position of the modal? like to the left top of the screen?

[Toshinaki]

after more inspecting I noticed --modal-inner-* css variables but all grayed out which means there're not exist.

.m_1f958f16 {
    display: flex;
    justify-content: center;
    align-items: var(--modal-inner-align, flex-start);
    padding-top: var(--modal-inner-y-offset, var(--modal-y-offset));
    padding-bottom: var(--modal-inner-y-offset, var(--modal-y-offset));
    padding-inline: var(--modal-inner-x-offset, var(--modal-x-offset));
}

only when I set

{
    align-items: flex-start;
    justify-content: flex-start;
}

manually the offset starts to work.

So where can we set the --modal-inner-align?

[Toshinaki]

@rtivital
Thanks for answering. What about this?

[rtivital]

Offset changes the distance between modal body and edges of the viewport.