Merge pull request #6127 from matrix-org/gsouquet/css-containment
Add CSS containment rules for shorter reflow operations
This commit is contained in:
commit
430cfa9c06
9 changed files with 16 additions and 0 deletions
|
@ -16,6 +16,7 @@ limitations under the License.
|
|||
|
||||
.mx_DecoratedRoomAvatar, .mx_ExtraTile {
|
||||
position: relative;
|
||||
contain: content;
|
||||
|
||||
&.mx_DecoratedRoomAvatar_cutout .mx_BaseAvatar {
|
||||
mask-image: url('$(res)/img/element-icons/roomlist/decorated-avatar-mask.svg');
|
||||
|
|
|
@ -198,6 +198,7 @@ limitations under the License.
|
|||
// as the box model should be top aligned. Happens in both FF and Chromium
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-self: stretch;
|
||||
|
||||
mask-image: linear-gradient(0deg, transparent, black 4px);
|
||||
}
|
||||
|
|
|
@ -19,6 +19,10 @@ limitations under the License.
|
|||
margin-bottom: 4px;
|
||||
padding: 4px;
|
||||
|
||||
contain: strict;
|
||||
height: 40px;
|
||||
box-sizing: border-box;
|
||||
|
||||
// The tile is also a flexbox row itself
|
||||
display: flex;
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue