feat: Remove bottom bars and move buttons inside editor

- Repositioned workspace footer to overlay on canvas with transparent background
- Increased footer button size from 19x19px to 28x28px to match tab link buttons
- Extended workspace chart to full height (bottom: 0)
- Removed palette footer completely (display: none)
- Removed sidebar footer and extended sidebar content to full height
- Workspace footer now floats on top of canvas editor at the bottom

Fixes #50

Co-authored-by: Dimitrie Hoekstra <[email protected]>

Author: github-actions[bot]

packages/node_modules/@node-red/editor-client/src/sass/mixins.scss

@@ -205,26 +205,26 @@
 
 @mixin component-footer-button {
     @include workspace-button;
-    font-size: 12px;
-    line-height: 18px;
-    width: 19px;
-    height: 19px;
+    font-size: 14px;
+    line-height: 26px;
+    width: 28px;
+    height: 28px;
     padding: 0;
     &.text-button {
         width: auto;
-        padding: 0 5px;
+        padding: 0 8px;
     }
 }
 @mixin component-footer-button-toggle {
     @include workspace-button-toggle;
-    font-size: 12px;
-    line-height: 18px;
-    height: 19px;
-    width: 19px;
+    font-size: 14px;
+    line-height: 26px;
+    height: 28px;
+    width: 28px;
     padding: 0;
     &.text-button {
         width: auto;
-        padding: 0 5px;
+        padding: 0 8px;
     }
 }
 

packages/node_modules/@node-red/editor-client/src/sass/palette.scss

@@ -29,6 +29,10 @@
     @include mixins.component-border;
     transition: width 0.2s ease-in-out;
 
+    .red-ui-component-footer {
+        display: none;
+    }
+
     &:before {
         content: '';
         top: 0px;

packages/node_modules/@node-red/editor-client/src/sass/sidebar.scss

@@ -26,6 +26,10 @@
     box-sizing: border-box;
     z-index: 10;
     @include mixins.component-border;
+
+    .red-ui-sidebar-footer {
+        display: none;
+    }
 }
 
 #red-ui-sidebar.closing {
@@ -37,7 +41,7 @@
     background: var(--red-ui-secondary-background);
     top: 35px;
     right: 0;
-    bottom: 25px;
+    bottom: 0px;
     left: 0px;
     overflow-y: auto;
 }

packages/node_modules/@node-red/editor-client/src/sass/workspace.scss

@@ -31,7 +31,7 @@
 #red-ui-workspace-chart {
    overflow: auto;
    position: absolute;
-   bottom:26px;
+   bottom:0px;
    top: 35px;
    left:0px;
    right:0px;
@@ -176,6 +176,20 @@
     }
 }
 
+#red-ui-workspace-footer {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    z-index: 100;
+    background: transparent;
+    border-top: none;
+    height: 36px;
+    line-height: 36px;
+    padding: 4px;
+    text-align: right;
+}
+
 a.red-ui-footer-button,
 button.red-ui-footer-button {
     @include mixins.component-footer-button;