Merge branch 'main' into 21359-rightclick-newproject-bug

[arvados.git] / services / workbench2 / src / components / multiselect-toolbar / MultiselectToolbar.tsx

diff --git a/services/workbench2/src/components/multiselect-toolbar/MultiselectToolbar.tsx b/services/workbench2/src/components/multiselect-toolbar/MultiselectToolbar.tsx
index d861dff3adec5391f622ec20962c6c71ac6ac0b9..650059316626632d5ed29b0ef68553eed3433502 100644 (file)
--- a/services/workbench2/src/components/multiselect-toolbar/MultiselectToolbar.tsx
+++ b/services/workbench2/src/components/multiselect-toolbar/MultiselectToolbar.tsx
@@ -47,7 +47,7 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
         width: 0,
         height: '2.7rem',
         padding: 0,
-        margin: "1rem auto auto 0.5rem",
+        margin: "1rem auto auto 0.3rem",
         transition: `width ${WIDTH_TRANSITION}ms`,
         overflow: 'hidden',
     },
@@ -56,7 +56,7 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
         flexDirection: "row",
         height: '2.7rem',
         padding: 0,
-        margin: "1rem auto auto 0.5rem",
+        margin: "1rem auto auto 0.3rem",
         overflow: 'hidden',
         transition: `width ${WIDTH_TRANSITION}ms`,
     },
@@ -64,6 +64,7 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
         width: "2.5rem",
         height: "2.5rem ",
         paddingLeft: 0,
+        border: "1px solid transparent",
     },
     iconContainer: {
         height: '100%',
@@ -121,7 +122,7 @@ export const MultiselectToolbar = connect(
             <React.Fragment>
                 <Toolbar
                     className={isTransitioning ? classes.transition: classes.root}
-                    style={{ width: `${(actions.length * 2.5) + 4}rem`}}
+                    style={{ width: `${(actions.length * 2.5) + 6}rem`}}
                     data-cy='multiselect-toolbar'
                     >
                     {actions.length ? (