1
0
mirror of synced 2024-11-22 21:16:10 +03:00

Reduced 10 level deep nesting of CSS rules. Instead, using the simpler depth-0,-1,-2,etc for adding padding to the result when nested.

Greatly simplifies complexity of expressions and reduces (hopefully) rendering time.

From https://developers.google.com/speed/docs/best-practices/rendering#UseEfficientCSSSelectors
Descendant selectors are inefficient because, for each element that matches the key, the browser must also traverse up the DOM tree, evaluating every ancestor element until it finds a match or reaches the root element.
This commit is contained in:
Jesper Rønn-Jensen 2014-03-23 21:50:35 +01:00
parent 774a0d7765
commit 7390721038

View File

@ -326,14 +326,6 @@ Version: @@ver@@ Timestamp: @@timestamp@@
padding-left: 0;
}
.select2-results ul.select2-result-sub > li .select2-result-label { padding-left: 20px }
.select2-results ul.select2-result-sub ul.select2-result-sub > li .select2-result-label { padding-left: 40px }
.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub > li .select2-result-label { padding-left: 60px }
.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub > li .select2-result-label { padding-left: 80px }
.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub > li .select2-result-label { padding-left: 100px }
.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub > li .select2-result-label { padding-left: 110px }
.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub > li .select2-result-label { padding-left: 120px }
.select2-results li {
list-style: none;
display: list-item;
@ -358,6 +350,16 @@ Version: @@ver@@ Timestamp: @@timestamp@@
user-select: none;
}
.select2-results-dept-0 .select2-result-label { padding-left: 20px }
.select2-results-dept-1 .select2-result-label { padding-left: 40px }
.select2-results-dept-2 .select2-result-label { padding-left: 60px }
.select2-results-dept-3 .select2-result-label { padding-left: 80px }
.select2-results-dept-4 .select2-result-label { padding-left: 100px }
.select2-results-dept-5 .select2-result-label { padding-left: 110px }
.select2-results-dept-6 .select2-result-label { padding-left: 120px }
.select2-results .select2-highlighted {
background: #3875d7;
color: #fff;