Contain all the things (#1999)
This PR adds some css containment where possible. ### Change Type - [x] `patch` — minor
This commit is contained in:
parent
7a8e47cf8c
commit
c63126ba5f
2 changed files with 7 additions and 0 deletions
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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);
|
||||||
|
|
Loading…
Reference in a new issue