Contain all the things (#1999)

This PR adds some css containment where possible.

### Change Type

- [x] `patch` — minor
This commit is contained in:
Steve Ruiz 2023-10-03 15:26:36 +01:00 committed by GitHub
parent 7a8e47cf8c
commit c63126ba5f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 7 additions and 0 deletions

View file

@ -289,6 +289,7 @@ input,
touch-action: none; touch-action: none;
pointer-events: none; pointer-events: none;
z-index: 2; z-index: 2;
contain: strict;
} }
.tl-grid-dot { .tl-grid-dot {
@ -310,6 +311,7 @@ input,
.tl-brush { .tl-brush {
stroke-width: calc(var(--tl-scale) * 1px); stroke-width: calc(var(--tl-scale) * 1px);
contain: size layout;
} }
.tl-brush__default { .tl-brush__default {
@ -323,6 +325,7 @@ input,
stroke-linejoin: round; stroke-linejoin: round;
stroke-linecap: round; stroke-linecap: round;
pointer-events: none; pointer-events: none;
contain: size layout;
} }
/* ---------------------- Shape --------------------- */ /* ---------------------- Shape --------------------- */
@ -332,6 +335,7 @@ input,
pointer-events: none; pointer-events: none;
overflow: visible; overflow: visible;
transform-origin: top left; transform-origin: top left;
contain: size layout;
} }
.tl-shape__culled { .tl-shape__culled {
@ -436,6 +440,7 @@ input,
transform-origin: top left; transform-origin: top left;
fill: none; fill: none;
stroke-width: calc(1.5px * var(--tl-scale)); stroke-width: calc(1.5px * var(--tl-scale));
contain: size;
} }
/* ------------------ SelectionBox ------------------ */ /* ------------------ SelectionBox ------------------ */
@ -821,6 +826,7 @@ input,
resize: none; resize: none;
border: none; border: none;
user-select: none; user-select: none;
contain: style paint;
-webkit-user-select: none; -webkit-user-select: none;
} }

View file

@ -22,6 +22,7 @@
padding: var(--space-2); padding: var(--space-2);
pointer-events: none; pointer-events: none;
user-select: none; user-select: none;
contain: strict;
z-index: var(--layer-panels); z-index: var(--layer-panels);
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0);
--sab: env(safe-area-inset-bottom); --sab: env(safe-area-inset-bottom);