[GitHub] [incubator-superset] etr2460 commented on a change in pull request #8579: increase z-index on filter box to fix bleeding of filter indicator

[GitBox <gi...@apache.org>]

etr2460 commented on a change in pull request #8579: increase z-index on filter box to fix bleeding of filter indicator
URL: https://github.com/apache/incubator-superset/pull/8579#discussion_r346650623
 
 

 ##########
 File path: superset/assets/src/visualizations/FilterBox/FilterBox.css
 ##########
 @@ -17,55 +17,63 @@
  * under the License.
  */
 .select2-highlighted > .filter_box {
-    background-color: transparent;
-    border: 1px superset black;
+  background-color: transparent;
+  border: 1px superset black;
 }
 
 .dashboard .filter_box .slice_container > div:not(.alert) {
-    padding-top: 0;
+  padding-top: 0;
 }
 
 .input-inline {
-    float: left;
-    display: inline-block;
-    padding-right: 3px;
+  float: left;
+  display: inline-block;
+  padding-right: 3px;
 }
 
-ul.select2-results li.select2-highlighted div.filter_box{
-    color: black;
-    border-width: 1px;
-    border-style: solid;
-    border-color: #666;
+ul.select2-results li.select2-highlighted div.filter_box {
+  color: black;
+  border-width: 1px;
+  border-style: solid;
+  border-color: #666;
 }
 
-ul.select2-results div.filter_box{
-    color: black;
-    border-style: solid;
-    border-width: 1px;
-    border-color: transparent;
+ul.select2-results div.filter_box {
+  color: black;
+  border-style: solid;
+  border-width: 1px;
+  border-color: transparent;
 }
+
 .filter_box {
-    padding: 10px 0;
-    overflow: visible !important;
+  padding: 10px 0;
+  overflow: visible !important;
 }
+
 .filter_box:hover {
-    z-index: 1000;
+  z-index: 1000;
 }
+
 .m-b-5 {
-    margin-bottom: 5px;
+  margin-bottom: 5px;
 }
+
 .filter-container {
-    display: flex;
+  display: flex;
 }
+
 .filter-container label {
-    display: flex;
-    font-weight: bold;
-    margin-bottom: 8px;
+  display: flex;
+  font-weight: bold;
+  margin-bottom: 8px;
 }
+
 .filter-container .filter-badge-container {
-    width: 30px;
-    padding-right: 10px;
+  width: 30px;
+  padding-right: 10px;
 }
+
 .filter-container .filter-badge-container + div {
-    width: 100%;
+  width: 100%;
+  z-index: 11;
 
 Review comment:
   I noticed your colleague was adding some .less files to standardize some variables. i've found it quite useful to keep all z indexes used in an app in a single constant file that we can then import wherever it's needed (naming this one `filter-box-dropdown-layer` or something like that)
   
   If you think that's out of scope for this PR, then maybe at least add a comment saying that we should clean that up in the future?

----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
 
For queries about this service, please contact Infrastructure at:
users@infra.apache.org


With regards,
Apache Git Services

---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org