#398 add borders, center see more or less, and fix radius + z-index a…

…ggrOptions select same as class selects
sparna-git · Apr 24, 2024 · c5b655d · c5b655d
1 parent 99eeab8
commit c5b655d
Showing 1 changed file with 13 additions and 3 deletions.
diff --git a/src/assets/stylesheets/layout/variablesSelection.scss b/src/assets/stylesheets/layout/variablesSelection.scss
@@ -190,16 +190,19 @@
             right: 0;
             top: 110%;
             width: 100%;
-            z-index: 100;
+            z-index: 1000;
             border-radius: 5px;
-            border: 1px solid transparent;
+            border: 1px solid gray;
             ul {
                 list-style-type: none;
                 margin: 0;
                 padding: 0;
                 li {
                     padding: 3px 8px;
                     border-bottom: 1px solid var(--silver-color-light);
+                    &:first-child {
+                        border-radius: 5px 5px 0 0;
+                    }
                     &:has(+ li:hover),
                     &:has(+ li.selected) {
                         border-bottom: 1px solid transparent;
@@ -214,7 +217,9 @@
                         border-bottom: 1px solid var(--primary-color-main);
                         -webkit-background-clip: padding-box; /* for Safari */
                         background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
-
+                        &:first-child {
+                            border-top: 1px solid gray;
+                        }
                     }
                     &.revealIf {
                         background-color: var(--silver-color-light);
@@ -293,15 +298,20 @@
             }
 
             .aggrOptionsExtend {
+                border-radius: 0 0 5px 5px;
                 span {
                     padding: 3px 8px;
+                    text-align: center;
                 }
                 &:hover {
                     cursor: pointer;
                     color: #fff;
+                    padding-bottom: 1px;
                     background-color: var(--primary-color-main);
                     margin-top: -1px;
+                    margin-bottom: -1px;
                     border-top: 1px solid var(--primary-color-main);
+                    border-bottom: 1px solid gray;
                 }
             }
             &.extended {