This commit is contained in:
Half-Shot 2024-11-14 16:06:34 +00:00
parent b49bfbb481
commit 4871176216
3 changed files with 14 additions and 15 deletions

View File

@ -6,6 +6,7 @@ Please see LICENSE in the repository root for full details.
*/ */
.modal { .modal {
--inset-inline: 520px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
@ -35,7 +36,7 @@ Please see LICENSE in the repository root for full details.
.drawer { .drawer {
background: var(--cpd-color-bg-canvas-default); background: var(--cpd-color-bg-canvas-default);
inset-block-end: 0; inset-block-end: 0;
inset-inline: max(0px, calc((100% - 520px) / 2)); inset-inline: max(0px, calc((100% - var(--inset-inline)) / 2));
max-block-size: 90%; max-block-size: 90%;
border-start-start-radius: var(--border-radius); border-start-start-radius: var(--border-radius);
border-start-end-radius: var(--border-radius); border-start-end-radius: var(--border-radius);

View File

@ -42,8 +42,9 @@ Please see LICENSE in the repository root for full details.
} }
.overlay.animate { .overlay.animate {
--overlay-top: 50%;
left: 50%; left: 50%;
top: 50%; top: var(--overlay-top);
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
} }

View File

@ -7,21 +7,24 @@
width: fit-content; width: fit-content;
} }
.reactionPopupMenuModal { div.reactionPopupMenuRoot.reactionPopupMenuModal {
top: 82vh !important; --overlay-top: 82vh;
} }
.reactionPopupMenuRoot { div.reactionPopupMenuRoot {
width: fit-content !important; /* Center the drawer */
--inset-inline: 30em;
width: fit-content;
} }
.reactionPopupMenuRoot > div { .reactionPopupMenuRoot > div {
width: fit-content; width: fit-content;
max-width: 100%;
} }
.reactionPopupMenuModal > div > div { div.reactionPopupMenuRoot.reactionPopupMenuModal > div > div {
padding-inline: var(--cpd-space-6x) !important; padding-inline: var(--cpd-space-6x);
padding-block: var(--cpd-space-6x) !important; padding-block: var(--cpd-space-6x);
} }
.reactionPopupMenu section { .reactionPopupMenu section {
@ -89,12 +92,6 @@
border: none; border: none;
} }
@media (max-width: 660px) {
:root {
--reaction-button-size: 1em;
--reaction-button-fontsize: 1em;
}
}
.verticalSeperator { .verticalSeperator {
background-color: var(--cpd-color-gray-800); background-color: var(--cpd-color-gray-800);
width: 1px; width: 1px;