diff --git a/src/canvas/canvas.js b/src/canvas/canvas.js
index db664d4..f8b99d5 100644
--- a/src/canvas/canvas.js
+++ b/src/canvas/canvas.js
@@ -708,6 +708,7 @@ class Canvas extends React.Component {
             x: (clientX - canvasRect.left) / this.state.zoom,
             y: (clientY - canvasRect.top) / this.state.zoom,
         }
+        // console.log("Final position1: ", finalPosition, container)
 
 
         if (container === WidgetContainer.SIDEBAR) {
@@ -734,23 +735,12 @@ class Canvas extends React.Component {
             const canvasBoundingRect = this.getCanvasBoundingRect()
 
             // calculate the initial offset from the div to the cursor grab
-            // const initialOffset = {
-            //     x: ((dragStartCursorPos.x - canvasBoundingRect.left) / this.state.zoom - this.state.currentTranslate.x) - initialPos.x,
-            //     y: ((dragStartCursorPos.y - canvasBoundingRect.top) / this.state.zoom - this.state.currentTranslate.y) - initialPos.y
-            // }
 
             const initialOffset = {
-                x: ((dragStartCursorPos.x - canvasBoundingRect.left) / this.state.zoom) - (initialPos.x/this.state.zoom),
-                y: ((dragStartCursorPos.y - canvasBoundingRect.top) / this.state.zoom) - (initialPos.y/this.state.zoom)
+                x: ((dragStartCursorPos.x - canvasBoundingRect.left) / this.state.zoom) - (initialPos.x / this.state.zoom),
+                y: ((dragStartCursorPos.y - canvasBoundingRect.top) / this.state.zoom) - (initialPos.y / this.state.zoom)
             }
 
-            console.log("initial offset:")
-
-            // finalPosition = {
-            //     x: finalPosition.x - initialOffset.x - this.state.currentTranslate.x,
-            //     y: finalPosition.y - initialOffset.y - this.state.currentTranslate.y
-            // }
-
             finalPosition = {
                 x: finalPosition.x - initialOffset.x,
                 y: finalPosition.y - initialOffset.y
@@ -921,46 +911,20 @@ class Canvas extends React.Component {
             const { dragStartCursorPos, initialPos } = posMetaData
             const canvasBoundingRect = this.getCanvasBoundingRect()
 
-            // TODO: the final position isn't adjusted for cursorpos
 
             let finalPosition = {
                 x: (clientX - parentRect.left) / this.state.zoom,
                 y: (clientY - parentRect.top) / this.state.zoom,
             }
 
-            // finalPosition = {
-            //     x: finalPosition.x - parentRect.left  - this.state.currentTranslate.x,
-            //     y: finalPosition.y - parentRect.right  - this.state.currentTranslate.y
-            // }
-
-            // const initialOffset = {
-            //     x: ((dragStartCursorPos.x - canvasBoundingRect.left) / this.state.zoom - this.state.currentTranslate.x) - initialPos.x,
-            //     y: ((dragStartCursorPos.y - canvasBoundingRect.top) / this.state.zoom - this.state.currentTranslate.y) - initialPos.y
-            // } 
-
-            // TODO: add offset to get the cursor to the correct div 
-            // const initialOffset = {
-            //     x: ((dragStartCursorPos.x - canvasBoundingRect.left) / this.state.zoom - this.state.currentTranslate.x) - initialPos.x,
-            //     y: ((dragStartCursorPos.y - canvasBoundingRect.top) / this.state.zoom - this.state.currentTranslate.y) - initialPos.y
-            // }
+            // FIXME: if the drag is from sidebar in layout absolute the position is wrong
 
             const initialOffset = {
-                x: ((dragStartCursorPos.x - canvasBoundingRect.left) / this.state.zoom) - (initialPos.x/this.state.zoom),
-                y: ((dragStartCursorPos.y - canvasBoundingRect.top) / this.state.zoom) - (initialPos.y/this.state.zoom)
+                x: ((dragStartCursorPos.x - canvasBoundingRect.left) / this.state.zoom) - (initialPos.x / this.state.zoom),
+                y: ((dragStartCursorPos.y - canvasBoundingRect.top) / this.state.zoom) - (initialPos.y / this.state.zoom)
             }
 
 
-            // finalPosition = {
-            //     x: finalPosition.x - initialOffset.x  - this.state.currentTranslate.x,
-            //     y: finalPosition.y - initialOffset.y  - this.state.currentTranslate.y
-            // }
-
-            // finalPosition = {
-            //     x: (finalPosition.x - parentRect.left) / this.state.zoom,
-            //     y: (finalPosition.y - parentRect.top) / this.state.zoom
-            // };
-            
-
             finalPosition = {
                 x: finalPosition.x - initialOffset.x,
                 y: finalPosition.y - initialOffset.y 
@@ -1052,8 +1016,6 @@ class Canvas extends React.Component {
         // Store the ref in the instance variable
         this.widgetRefs.current[id] = widgetRef
 
-        console.log("widget ref: ", widgetRef)
-
         // this.setWidgetRefs({...this.widgetRefs.current, [id]: widgetRef})
 
         const newWidget = {
diff --git a/src/components/cards.js b/src/components/cards.js
index 4e99901..1e04891 100644
--- a/src/components/cards.js
+++ b/src/components/cards.js
@@ -184,7 +184,7 @@ export const TreeViewCard = memo(({widgetRef, title, isTopLevel}) => {
                 <Button color="danger" title="delete" onClick={onDelete} size="small" variant="text" danger 
                 icon={<DeleteOutlined />}></Button>
                 <Button variant="text" type="text" title="hide" onClick={toggleHideShowWidget} size="small" 
-                icon={widgetVisible ? <EyeInvisibleOutlined/> : <EyeOutlined />}></Button>
+                icon={widgetVisible ? <EyeOutlined /> : <EyeInvisibleOutlined/>}></Button>
             </div>
         </div>
     )
diff --git a/src/frameworks/customtk/engine/code.js b/src/frameworks/customtk/engine/code.js
index 62920f6..54d403a 100644
--- a/src/frameworks/customtk/engine/code.js
+++ b/src/frameworks/customtk/engine/code.js
@@ -111,7 +111,7 @@ async function generateCustomTkCode(projectName, widgetList=[], widgetRefs=[], a
 
     // widget - {id, widgetType: widgetComponentType, children: [], parent: "", initialData: {}}
     
-    const generatedObject = generateCustomTkCodeList(filteredWidgetList, widgetRefs, "", "")
+    const generatedObject = generateCustomTkCodeList(filteredWidgetList, widgetRefs.current, "", "")
 
     const {code: codeLines, imports, requirements, mainVariable} = generatedObject
 
diff --git a/src/frameworks/customtk/widgets/base.js b/src/frameworks/customtk/widgets/base.js
index f78c5a3..fb18691 100644
--- a/src/frameworks/customtk/widgets/base.js
+++ b/src/frameworks/customtk/widgets/base.js
@@ -30,12 +30,12 @@ export class CustomTkBase extends Widget {
         if (parentLayout === Layouts.PLACE || absolutePositioning){
 
             const config = {
-                x: this.state.pos.x,
-                y: this.state.pos.y,
+                x: Math.trunc(this.state.pos.x),
+                y: Math.trunc(this.state.pos.y),
             }
 
-            config["width"] = this.state.size.width
-            config["height"] = this.state.size.height
+            config["width"] = Math.trunc(this.state.size.width)
+            config["height"] = Math.trunc(this.state.size.height)
 
             // if (!this.state.fitContent.width){
             //     config["width"] = this.state.size.width
diff --git a/src/frameworks/tkinter/engine/code.js b/src/frameworks/tkinter/engine/code.js
index ae63c92..bea9605 100644
--- a/src/frameworks/tkinter/engine/code.js
+++ b/src/frameworks/tkinter/engine/code.js
@@ -111,7 +111,7 @@ async function generateTkinterCode(projectName, widgetList=[], widgetRefs=[], as
 
     // widget - {id, widgetType: widgetComponentType, children: [], parent: "", initialData: {}}
     
-    const generatedObject = generateTkinterCodeList(filteredWidgetList, widgetRefs, "", "")
+    const generatedObject = generateTkinterCodeList(filteredWidgetList, widgetRefs.current, "", "")
 
     const {code: codeLines, imports, requirements, mainVariable} = generatedObject
 
diff --git a/src/frameworks/tkinter/widgets/base.js b/src/frameworks/tkinter/widgets/base.js
index b3b374b..9a2ea34 100644
--- a/src/frameworks/tkinter/widgets/base.js
+++ b/src/frameworks/tkinter/widgets/base.js
@@ -28,12 +28,12 @@ export class TkinterBase extends Widget {
         if (parentLayout === Layouts.PLACE || absolutePositioning){
 
             const config = {
-                x: this.state.pos.x,
-                y: this.state.pos.y,
+                x: Math.trunc(this.state.pos.x),
+                y: Math.trunc(this.state.pos.y),
             }
 
-            config["width"] = this.state.size.width
-            config["height"] = this.state.size.height
+            config["width"] = Math.trunc(this.state.size.width)
+            config["height"] = Math.trunc(this.state.size.height)
 
             // if (!this.state.fitContent.width){
             //     config["width"] = this.state.size.width
diff --git a/src/sidebar/treeviewContainer.js b/src/sidebar/treeviewContainer.js
index 26ec959..f926346 100644
--- a/src/sidebar/treeviewContainer.js
+++ b/src/sidebar/treeviewContainer.js
@@ -50,7 +50,8 @@ function TreeviewContainer() {
                 onClear={() => setSearchValue("")} /> */}
             <div className="tw-flex tw-flex-col tw-gap-2 tw-w-full tw-h-full tw-p-1">
 
-                <Tree treeData={transformedContent}
+                <Tree  showLine
+                        treeData={transformedContent}
                         titleRender={(nodeData) => 
                             
                             <TreeViewCard widgetId={nodeData.id} title={nodeData.title}