diff --git a/libs/shared/lib/querybuilder/panel/QueryBuilder.tsx b/libs/shared/lib/querybuilder/panel/QueryBuilder.tsx
index 5f22b9991a9f0b4ff27c7c66f8526aa913d10166..ec05da457a2eeda6fde3a5d99f85d60ca73677ec 100644
--- a/libs/shared/lib/querybuilder/panel/QueryBuilder.tsx
+++ b/libs/shared/lib/querybuilder/panel/QueryBuilder.tsx
@@ -36,9 +36,9 @@ import { ConnectionDragLine, ConnectionLine, QueryEntityPill, QueryRelationPill
 import { QueryLogicPill } from '../pills/customFlowPills/logicpill/QueryLogicPill';
 import { dragPillStarted, movePillTo } from '../pills/dragging/dragPill';
 import styles from './querybuilder.module.scss';
-import { QueryBuilderLogicPillsPanel } from './querysidepanel/queryBuilderLogicPillsPanel';
-import { QueryBuilderRelatedNodesPanel } from './querysidepanel/queryBuilderRelatedNodesPanel';
-import { QueryMLDialog } from './querysidepanel/queryMLDialog';
+import { QueryBuilderLogicPillsPanel } from './querysidepanel/QueryBuilderLogicPillsPanel';
+import { QueryBuilderRelatedNodesPanel } from './querysidepanel/QueryBuilderRelatedNodesPanel';
+import { QueryMLDialog } from './querysidepanel/QueryMLDialog';
 import { ConnectingNodeDataI } from './utils/connectorDrop';
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '../../components/tooltip';
 import { resultSetFocus } from '../../data-access/store/interactionSlice';
@@ -622,7 +622,7 @@ export const QueryBuilderInner = (props: QueryBuilderProps) => {
             if (!ret) setToggleSettings(undefined);
           }}
         >
-          <DialogContent className="w-fit">
+          <DialogContent className="w-fit rounded-none">
             <QueryBuilderLogicPillsPanel
               onClick={(v) => {
                 connectingNodeId.current = null;
diff --git a/libs/shared/lib/querybuilder/panel/querysidepanel/queryBuilderLogicPillsPanel.tsx b/libs/shared/lib/querybuilder/panel/querysidepanel/QueryBuilderLogicPillsPanel.tsx
similarity index 83%
rename from libs/shared/lib/querybuilder/panel/querysidepanel/queryBuilderLogicPillsPanel.tsx
rename to libs/shared/lib/querybuilder/panel/querysidepanel/QueryBuilderLogicPillsPanel.tsx
index 87e956566c6d9474b2f45e19f34109e74d62b69d..13cf045ec1d5bcfcf1a53fb19dad460f419df7d3 100644
--- a/libs/shared/lib/querybuilder/panel/querysidepanel/queryBuilderLogicPillsPanel.tsx
+++ b/libs/shared/lib/querybuilder/panel/querysidepanel/QueryBuilderLogicPillsPanel.tsx
@@ -170,7 +170,7 @@ export const QueryBuilderLogicPillsPanel = (props: {
   });
 
   return (
-    <div className={props.className + ' card h-30rem w-20rem overflow-auto'}>
+    <div className={props.className + ' card'}>
       {props.title && <h1 className="card-title mb-2 mx-auto">{props.title}</h1>}
       <div className="gap-1 flex justify-center">
         <TooltipProvider delayDuration={50}>
@@ -216,34 +216,30 @@ export const QueryBuilderLogicPillsPanel = (props: {
               <Tooltip key={'QB_Options_' + index}>
                 <TooltipContent>{item.description}</TooltipContent>
                 <TooltipTrigger>
-                <li key={item.key + item.description} className="px-3 py-2 h-fit bg-white border-[1px] border-secondary-500 rounded-sm">
-                  <span
-                    className="flex before:w-[5rem] before:text-center text-start "
-                    onDragStart={(e) => onDragStart(e, item)}
-                    draggable={true}
-                    onClick={() => {
-                      if (props.editNode) onEditNodeFromPopup(item);
-                      else onNewNodeFromPopup(item);
-                    }}
-                  >
-                    {item.icon && (
-                        <div className="w-[1rem] rounded-sm justify-center flex">
-                          <Icon component={item.icon} size={20} />
-                        </div>
-                      )}
-                    <span className="w-full">{item.name}</span>
-                    <span className="flex scale-75">
-                      {item.key.toLowerCase().includes('filter') && <Icon component="icon-[ic--baseline-filter-alt]" size={20} />}
-                      {item.key.toLowerCase().includes('function') && <Icon component="icon-[ic--baseline-functions]" size={20} />}
-                      {item.key.toLowerCase().includes('aggregation') && <Icon component="icon-[ic--baseline-grid-on]" size={20} />}
-                      {item.key.toLowerCase().includes('number') && <Icon component="icon-[ic--baseline-numbers]" size={20} />}
-                      {item.key.toLowerCase().includes('string') && <Icon component="icon-[ic--baseline-abc]" size={20} />}
+                  <li key={item.key + item.description} className="px-3 py-2 h-fit bg-white border-[1px] border-secondary-500 min-w-72">
+                    <span
+                      className="flex gap-1"
+                      onDragStart={(e) => onDragStart(e, item)}
+                      draggable={true}
+                      onClick={() => {
+                        if (props.editNode) onEditNodeFromPopup(item);
+                        else onNewNodeFromPopup(item);
+                      }}
+                    >
+                      {item.icon && <Icon component={item.icon} size={24} />}
+                      <span className="w-full">{item.name}</span>
+                      <span className="flex scale-75">
+                        {item.key.toLowerCase().includes('filter') && <Icon component="icon-[ic--baseline-filter-alt]" size={20} />}
+                        {item.key.toLowerCase().includes('function') && <Icon component="icon-[ic--baseline-functions]" size={20} />}
+                        {item.key.toLowerCase().includes('aggregation') && <Icon component="icon-[ic--baseline-grid-on]" size={20} />}
+                        {item.key.toLowerCase().includes('number') && <Icon component="icon-[ic--baseline-numbers]" size={20} />}
+                        {item.key.toLowerCase().includes('string') && <Icon component="icon-[ic--baseline-abc]" size={20} />}
+                      </span>
                     </span>
-                  </span>
-                </li>
+                  </li>
                 </TooltipTrigger>
               </Tooltip>
-              ))}
+            ))}
           </ul>
         </TooltipProvider>
       </div>
diff --git a/libs/shared/lib/querybuilder/panel/querysidepanel/queryBuilderRelatedNodesPanel.tsx b/libs/shared/lib/querybuilder/panel/querysidepanel/QueryBuilderRelatedNodesPanel.tsx
similarity index 100%
rename from libs/shared/lib/querybuilder/panel/querysidepanel/queryBuilderRelatedNodesPanel.tsx
rename to libs/shared/lib/querybuilder/panel/querysidepanel/QueryBuilderRelatedNodesPanel.tsx
diff --git a/libs/shared/lib/querybuilder/panel/querysidepanel/queryMLDialog.tsx b/libs/shared/lib/querybuilder/panel/querysidepanel/QueryMLDialog.tsx
similarity index 100%
rename from libs/shared/lib/querybuilder/panel/querysidepanel/queryMLDialog.tsx
rename to libs/shared/lib/querybuilder/panel/querysidepanel/QueryMLDialog.tsx