synapse-react-client 2.1.16 → 2.1.19

package/dist/style/components/_query-wrapper-plot-nav.scss

@@ -4,14 +4,31 @@
   @media (min-width: map-get(SRC.$breakpoints, 'medium')) {
     .SRC-wrapper {
       display: grid;
-      grid-template-columns: 60px 10px 25% 10px 75%;
-      padding-right: 120px;
-
+      grid-template-columns: 25% 10px 75%;
+      padding-right: 15px;
+      
       // by default, children take up the full row
       > * {
-        grid-column: 3 / span 3;
+        grid-column: 1 / span 3;
       }
-
+      &.has-facets{
+        padding-right: 120px;
+        grid-template-columns: 60px 10px 25% 10px 75%;
+        > * {
+          grid-column: 3 / span 3;
+        }
+        .download-confirmation,
+        .TotalQueryResults,
+        .FacetNav,
+        .FilterAndView,
+        .TopLevelControls,
+        .QueryWrapperTextInput,
+        .ErrorBannerWrapper {
+            margin-left: 30px;
+        }
+      }
+    }
+    .SRC-wrapper {
       .QueryFilterToggleButton {
         position: relative;
         left: -23px;
@@ -44,20 +61,22 @@
       .download-confirmation {
         grid-row: 2 / span 1;
       }
-      .SearchV2 {
+      .QueryWrapperTextInput {
         grid-row: 3 / span 1;
         margin-bottom: 10px;
       }
       .TotalQueryResults {
         grid-row: 4 / span 1;
       }
-
-      .FacetNav {
+      .ErrorBannerWrapper {
         grid-row: 5 / span 1;
       }
-      .FilterAndView {
+      .FacetNav {
         grid-row: 6 / span 1;
       }
+      .FilterAndView {
+        grid-row: 7 / span 1;
+      }
 
       // column (depends on if we are showing facet filters)
       .isShowingFacetFilters {
@@ -75,7 +94,8 @@
         &.TotalQueryResults,
         &.FilterAndView,
         &.TopLevelControls,
-        &.SearchV2 {
+        &.QueryWrapperTextInput,
+        &.ErrorBannerWrapper {
           grid-column: 5 / span 1;
         }
       }
@@ -91,14 +111,6 @@
         }
       }
     }
-    .download-confirmation,
-    .TotalQueryResults,
-    .FacetNav,
-    .FilterAndView,
-    .TopLevelControls,
-    .SearchV2 {
-      margin-left: 30px;
-    }
   }
 
   @media (max-width: map-get(SRC.$breakpoints, 'medium')) {
@@ -109,7 +121,7 @@
     }
   }
 
-  .SearchV2 {
+  .QueryWrapperTextInput {
     // PORTALS-1856: z-index greater than the Show All Graphs button (500)
     z-index: 600;
   }

package/dist/style/components/{_searchv2.scss → _query-wrapper-text-input.scss}

@@ -1,6 +1,6 @@
 @use '../abstracts/variables' as SRC;
 
-.SearchV2 {
+.QueryWrapperTextInput {
   &__searchbar {
     height: 50px;
     background: #f9f9f9;
@@ -78,7 +78,7 @@
     width: 100%;
   }
 
-  &__column-select.SearchV2__animate_height {
+  &__column-select.QueryWrapperTextInput__animate_height {
     overflow: scroll;
   }
 

package/dist/style/components/_synapse-nav-drawer.scss

@@ -38,7 +38,7 @@
 }
 .SynapseNavContentDrawer {
   .synapseLogoNameContainer {
-    padding: 25px 0px 16px 0px;
+    padding: 25px 0px 16px 5px;
   }
   .searchInputWithIcon {
     padding-top: 30px;