merged with master

1 files changed, 24 insertions, 16 deletions

diff --git a/src/client/views/collections/CollectionViewChromes.scss b/src/client/views/collections/CollectionViewChromes.scss
index d2dcf96d7..e4581eb46 100644
--- a/src/client/views/collections/CollectionViewChromes.scss
+++ b/src/client/views/collections/CollectionViewChromes.scss
@@ -2,7 +2,8 @@
 @import '~js-datepicker/dist/datepicker.min.css';
 
 .collectionViewChrome-cont {
-    position: relative;
+    position: absolute;
+    width:100%;
     opacity: 0.9;
     z-index: 9001;
     transition: top .5s;
@@ -26,7 +27,6 @@
                 outline-color: black;
                 border: none;
                 padding: 12px 10px 11px 10px;
-                margin-left: 50px;
             }
 
             .collectionViewBaseChrome-viewPicker:active {
@@ -69,19 +69,24 @@
                 position: absolute;
                 width: 40px;
                 transform-origin: top left;
+                pointer-events: all;
                 // margin-top: 10px;
             }
-            .collectionViewBaseChrome-template {
-                margin-left: 10px;
+            .collectionViewBaseChrome-template,
+            .collectionViewBaseChrome-viewModes {
                 display: grid;
                 background: rgb(238, 238, 238);
                 color:grey;
                 margin-top:auto;
                 margin-bottom:auto;
+                margin-left: 5px;
+            }
+            .collectionViewBaseChrome-viewModes {
+                margin-left: 25px;
             }
 
             .collectionViewBaseChrome-viewSpecs {
-                margin-left: 10px;
+                margin-left: 5px;
                 display: grid;
                 
                 .collectionViewBaseChrome-filterIcon {
@@ -179,23 +184,26 @@
         }
 
 
-        .collectionStackingViewChrome-sectionFilter-cont,
-        .collectionTreeViewChrome-sectionFilter-cont {
+        .collectionStackingViewChrome-pivotField-cont,
+        .collectionTreeViewChrome-pivotField-cont {
             justify-self: right;
             display: flex;
             font-size: 75%;
             letter-spacing: 2px;
 
-            .collectionStackingViewChrome-sectionFilter-label,
-            .collectionTreeViewChrome-sectionFilter-label {
+            .collectionStackingViewChrome-pivotField-label,
+            .collectionTreeViewChrome-pivotField-label {
                 vertical-align: center;
-                padding: 10px;
+                padding-left: 10px;
+                padding-top: 10px;
+                padding-bottom: 10px;
             }
 
-            .collectionStackingViewChrome-sectionFilter,
-            .collectionTreeViewChrome-sectionFilter {
+            .collectionStackingViewChrome-pivotField,
+            .collectionTreeViewChrome-pivotField {
                 color: white;
-                width: 100px;
+                width:100%;
+                min-width: 100px;
                 text-align: center;
                 background: rgb(238, 238, 238);
 
@@ -220,8 +228,8 @@
             }
         }
 
-        .collectionStackingViewChrome-sectionFilter:hover,
-        .collectionTreeViewChrome-sectionFilter:hover {
+        .collectionStackingViewChrome-pivotField:hover,
+        .collectionTreeViewChrome-pivotField:hover {
             cursor: text;
         }
     }
@@ -288,7 +296,7 @@
     display:flex;
     flex-direction: row;
     width: 150px;
-    margin: auto 0 auto auto;
+    margin: auto auto auto auto;
 }
 
 .react-autosuggest__container {