Updates to padding

src/app/src/App.css

@@ -1,3 +1,4 @@
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
+

src/app/src/index.css

@@ -6,4 +6,7 @@ body,
 html,
 #app {
     height: 100%;
+    * {
+        @apply box-border;
+    }
 }

src/app/src/workspace/Column/index.tsx

@@ -2,7 +2,7 @@ import { DRO } from "../../widgets/Control/DRO";
 
 export const Column = () => {
     return (
-        <div className="border p-3 flex-1">
+        <div className="border p-3 flex-1 box-border">
             <div>DRO and Jogging</div>
             <DRO />
         </div>

src/app/src/workspace/PrimaryArea/index.tsx

@@ -1,3 +1,3 @@
 export const PrimaryArea = () => {
-    return <div className="border p-3 flex-1">Vizualizer</div>;
+    return <div className="border p-3 flex-1 box-border">Vizualizer</div>;
 };

src/app/src/workspace/Sidebar/index.tsx

@@ -1,7 +1,7 @@
 import {Navbar} from "../../features/navbar";
 
 export const Sidebar = () => {
-    return <div className="border w-20 flex flex-col justify-end">
+    return <div className="border w-20 flex flex-col justify-end box-border">
         <Navbar />
     </div>;
 };

src/app/src/workspace/ToolArea/index.tsx

@@ -1,9 +1,9 @@
 export const ToolArea = () => {
     return (
-        <div className="border p-3 flex-1 flex gap-2">
-            <div className="w-full border p-3">File Area</div>
-            <div className="w-full border p-3">Job Control</div>
-            <div className="w-full border p-3">Tools (Probe, Macros, etc.)</div>
+        <div className="border p-3 flex-1 flex gap-2 box-border">
+            <div className="w-full border p-3 box-border">File Area</div>
+            <div className="w-full border p-3 box-border">Job Control</div>
+            <div className="w-full border p-3 box-border">Tools (Probe, Macros, etc.)</div>
         </div>
     );
 };

src/app/src/workspace/TopBar/index.tsx

@@ -1,3 +1,10 @@
+import gSenderIcon from './assets/icon-round.png';
+
 export const TopBar = () => {
-    return <div className="border p-3 h-20">Top bar</div>;
+    return <div className="border p-3 h-20 box-border">
+        <div className="w-[50px] h-[50px]">
+            <img alt="gSender Logo" src={gSenderIcon}/>
+        </div>
+
+    </div>;
 };

tailwind.config.js

@@ -9,4 +9,3 @@ module.exports = {
     },
     plugins: [],
 };
-