feat: add css containment to minimap elements

Author: aminya

styles/minimap.less

@@ -14,8 +14,15 @@ atom-text-editor[with-minimap] {
   }
 }
 
+// css containment to improve performance
+// this means the css properties of the minimap does not affect other parts of Atom
+// https://drafts.csswg.org/css-contain/#propdef-contain
+@contain_all: size layout paint style;
+@contain_except_size: layout paint style;
+
 atom-text-editor, html {
   atom-text-editor-minimap {
+    contain: @contain_all;
     display: block;
     overflow: hidden;
     position: relative;
@@ -42,6 +49,7 @@ atom-text-editor, html {
         pointer-events: none;
 
         canvas, .minimap-visible-area {
+          contain: @contain_except_size;
           pointer-events: auto;
         }
       }
@@ -58,13 +66,15 @@ atom-text-editor, html {
     }
 
     canvas {
+      contain: @contain_except_size;
       position: absolute;
       top: 0;
       left: 0;
       transform-origin: 0 0;
     }
 
     .minimap-visible-area {
+      contain: @contain_all;
       position: absolute;
       display: block;
       cursor: -webkit-grab;
@@ -87,12 +97,14 @@ atom-text-editor, html {
     }
 
     .minimap-controls {
+      contain: @contain_all;
       position: relative;
       height: 100%;
       pointer-events: none;
     }
 
     .minimap-scroll-indicator {
+      contain: @contain_all;
       position: absolute;
       display: block;
       right: 0;
@@ -103,6 +115,7 @@ atom-text-editor, html {
     }
 
     .open-minimap-quick-settings {
+      contain: @contain_all;
       opacity: 0;
       position: absolute;
       z-index: 1;
@@ -131,10 +144,12 @@ atom-text-editor, html {
 }
 
 minimap-quick-settings {
+  contain: @contain_all;
   position: absolute !important;
   z-index: 5;
 
   .hidden-input {
+    contain: @contain_all;
     position: absolute;
     width: 0;
     height: 0;
@@ -143,6 +158,7 @@ minimap-quick-settings {
   }
 
   ol {
+    contain: @contain_all;
     margin-top: 0 !important;
 
     .separator {
@@ -160,14 +176,17 @@ minimap-quick-settings {
   }
 
   .select-list.popover-list ol.list-group {
+    contain: @contain_all;
     overflow: visible;
     max-height: none;
   }
 
   .btn-group {
+    contain: @contain_all;
     width: 100%;
 
     .btn {
+      contain: @contain_all;
       width: 50%;
     }
   }