some other fixes

riccardoperra · Oct 31, 2024 · eb485a1 · eb485a1
1 parent 99859c8
commit eb485a1
Show file tree

Hide file tree

Showing 7 changed files with 44 additions and 35 deletions.
diff --git a/packages/app/src/components/Editor/Canvas/Canvas.css.ts b/packages/app/src/components/Editor/Canvas/Canvas.css.ts
@@ -14,8 +14,8 @@ export const canvasContainer = style({
   alignItems: 'flex-start',
   minWidth: 0,
   padding: '2rem',
+  overflow: 'hidden',
   position: 'relative',
-  overflow: 'auto',
   background: `repeating-linear-gradient(90deg, ${canvasPatternColor} 0, ${canvasPatternColor} 5%, transparent 0, transparent 50%), repeating-linear-gradient(180deg, ${canvasPatternColor} 0, ${canvasPatternColor} 5%, transparent 0, transparent 50%)`,
   backgroundColor: '#000',
   backgroundSize: '36px 36px',

diff --git a/packages/app/src/components/Editor/Canvas/Canvas.tsx b/packages/app/src/components/Editor/Canvas/Canvas.tsx
@@ -117,6 +117,8 @@ function createNodes(jobs: WorkflowStructureJob[]) {
           return [...acc, ...jobEdge];
         }, [] as FlowConnection[]);
 
+        console.log(mappedNodes);
+
         return {
           size: {
             width: layout.width!,

diff --git a/packages/app/src/components/Editor/Layout/Resizable/Resizable.css.ts b/packages/app/src/components/Editor/Layout/Resizable/Resizable.css.ts
@@ -9,8 +9,8 @@ export const resizablePanel = style({
 
 export const resizableHandlerContainer = recipe({
   base: {
-    backgroundColor: 'transparent',
-    width: '4px',
+    backgroundColor: themeVars.accent4,
+    width: '6px',
     padding: 0,
     flexBasis: '4px',
     border: 0,

diff --git a/packages/app/src/components/Editor/LeftSidebar/LeftSidebar.css.ts b/packages/app/src/components/Editor/LeftSidebar/LeftSidebar.css.ts
@@ -29,10 +29,10 @@ export const sidebar = recipe({
       overflowX: 'hidden',
       paddingRight: appTheme.spacing['2'],
       '@supports': {
-        '(scrollbar-gutter: stable)': {
-          paddingRight: 0,
-          scrollbarGutter: 'stable',
-        },
+        // '(scrollbar-gutter: stable)': {
+        // paddingRight: 0,
+        // scrollbarGutter: 'stable',
+        // },
       },
       flexShrink: 0,
     },
@@ -42,9 +42,11 @@ export const sidebar = recipe({
       none: {},
       right: {
         borderLeft: `1px solid ${themeVars.separator}`,
+        paddingRight: 0,
       },
       left: {
         borderRight: `1px solid ${themeVars.separator}`,
+        paddingRight: 0,
       },
     },
   },

diff --git a/packages/app/src/components/Editor/YamlEditor/fleetTheme.ts b/packages/app/src/components/Editor/YamlEditor/fleetTheme.ts
@@ -223,15 +223,20 @@ export const colors = EditorView.theme(
       width: '12px',
       backgroundColor: 'transparent',
     },
-    '::-webkit-scrollbar-track': {
-      backgroundColor: 'transparent',
-    },
     '::-webkit-scrollbar-thumb': {
       backgroundColor: '#505050',
       borderRadius: '1000px',
       border: '4px solid transparent',
       backgroundClip: 'content-box',
-      transition: 'background-color .2s',
+    },
+    '::webkit-scrollbar-corner': {
+      backgroundColor: '#505050',
+      borderRadius: '16px',
+      backgroundClip: 'content-box',
+      border: '4px solid transparent',
+    },
+    '&::-webkit-scrollbar-track-piece': {
+      background: 'transparent',
     },
   },
   {

diff --git a/packages/app/src/components/Home/CurrentUser/CurrentUser.css.ts b/packages/app/src/components/Home/CurrentUser/CurrentUser.css.ts
@@ -7,7 +7,7 @@ export const badge = style({
   alignItems: 'center',
   justifyContent: 'center',
   textAlign: 'center',
-  fontSize: '14px',
+  fontSize: '14px !important',
   background: '#076a6e',
   color: 'white',
   borderRadius: '9999px',

diff --git a/packages/app/src/global-codeui.css.ts b/packages/app/src/global-codeui.css.ts
@@ -11,30 +11,30 @@ globalStyle('[data-cui-theme=dark] html, body', {
   fontFamily: 'Gabarito',
 });
 
-// globalStyle('::-webkit-scrollbar', {
-//   width: '18px',
-//   height: '18px',
-// });
+globalStyle('::-webkit-scrollbar', {
+  width: '18px',
+  height: '18px',
+});
 
-// globalStyle('::-webkit-scrollbar-track', {
-//   backgroundColor: 'transparent',
-// });
+globalStyle('::-webkit-scrollbar-track', {
+  backgroundColor: 'transparent',
+});
 
-// globalStyle('::-webkit-scrollbar-corner', {
-//   backgroundColor: '#505050',
-//   borderRadius: '16px',
-//   backgroundClip: 'content-box',
-//   border: '4px solid transparent',
-// });
+globalStyle('::-webkit-scrollbar-corner', {
+  backgroundColor: '#505050',
+  borderRadius: '16px',
+  backgroundClip: 'content-box',
+  border: '4px solid transparent',
+});
 
-// globalStyle('::-webkit-scrollbar-thumb', {
-//   backgroundColor: '#505050',
-//   borderRadius: '9999px',
-//   border: '6px solid transparent',
-//   backgroundClip: 'content-box',
-//   transition: 'background-color .2s',
-// });
+globalStyle('::-webkit-scrollbar-thumb', {
+  backgroundColor: '#505050',
+  borderRadius: '9999px',
+  border: '6px solid transparent',
+  backgroundClip: 'content-box',
+  transition: 'background-color .2s',
+});
 
-// globalStyle('::-webkit-scrollbar-thumb:hover', {
-//   backgroundColor: '#333333',
-// });
+globalStyle('::-webkit-scrollbar-thumb:hover', {
+  backgroundColor: '#333333',
+});