Change tool btn size

apps/app/src/client/components/Sidebar/SidebarNav/PrimaryItem.tsx

@@ -73,12 +73,12 @@ export const PrimaryItem = (props: PrimaryItemProps): JSX.Element => {
       <button
         type="button"
         data-testid={`grw-sidebar-nav-primary-${labelForTestId}`}
-        className={`btn btn-primary ${indicatorClass}`}
+        className={`btn btn-primary border-0 ${indicatorClass}`}
         onClick={itemClickedHandler}
         onMouseEnter={mouseEnteredHandler}
         id={labelForTestId}
       >
-        <div className="position-relative">
+        <div className="d-flex justify-content-center align-items-center position-relative">
           {badgeContents != null && (
             <span className="position-absolute badge rounded-pill bg-primary">{badgeContents}</span>
           )}

apps/app/src/client/components/Sidebar/SidebarNav/PrimaryItems.module.scss

@@ -15,6 +15,8 @@
 .grw-primary-items :global {
   .btn.btn-primary {
     @extend %btn-primary-color-vars;
+    width: 40px;
+    height: 40px;
   }
 }
 

apps/app/src/client/components/Sidebar/SidebarNav/SidebarNav.tsx

@@ -42,7 +42,7 @@ export const SidebarNav = memo((props: SidebarNavProps) => {
 
       {renderedPageCreateButton}
 
-      <div className="grw-sidebar-nav-primary-container" data-vrt-blackout-sidebar-nav>
+      <div className="grw-sidebar-nav-primary-container text-center mt-2" data-vrt-blackout-sidebar-nav>
         <PrimaryItems onItemHover={onPrimaryItemHover} />
       </div>