Miko/PyUIBuilder
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

styling updates

Browse Source
This commit is contained in:
paul
2025-03-11 14:00:09 +05:30
parent 81c3056a10
commit b3ab3b1193
6 changed files with 14 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/canvas/canvas.js
View File

@@ -1332,7 +1332,7 @@ class Canvas extends React.Component {
</DroppableWrapper>
<CanvasToolBar isOpen={this.state.toolbarOpen}
widgetType={this.selectedWidget?.getWidgetType() || ""}
widgetType={this.selectedWidget?.getDisplayName() || ""}
attrs={this.state.toolbarAttrs}
/>
{/* </ActiveWidgetProvider> */}

10
src/canvas/toolbar.js
View File

@@ -338,7 +338,7 @@ const CanvasToolBar = memo(({ isOpen, widgetType, attrs = {} }) => {
if (isFirstLevel){
return (
<Collapse key={keyName} ghost defaultActiveKey={keys}>
<Collapse key={keyName} defaultActiveKey={keys}>
<Collapse.Panel header={val.label} key={keyName}>
{renderTool(keyName, val)}
</Collapse.Panel>
@@ -367,7 +367,7 @@ const CanvasToolBar = memo(({ isOpen, widgetType, attrs = {} }) => {
if (isFirstLevel){
return (
<Collapse key={keyName} ghost defaultActiveKey={keys}>
<Collapse key={keyName} defaultActiveKey={keys}>
<Collapse.Panel header={val.label} key={keyName}>
<div className={`${containerClass} tw-px-2`}>
{renderToolbar(val, keyName, toolCount+1)}
@@ -398,13 +398,15 @@ const CanvasToolBar = memo(({ isOpen, widgetType, attrs = {} }) => {
${toolbarOpen ? "tw-translate-x-0" : "tw-translate-x-full"}
tw-w-[280px] tw-px-3 tw-p-2 tw-h-[600px] tw-rounded-md tw-z-[1000] tw-shadow-lg
tw-transition-transform tw-duration-[0.3s] tw-overflow-x-hidden
tw-flex tw-flex-col tw-gap-2 tw-overflow-y-auto`}
tw-flex tw-flex-col tw-gap-2 tw-overflow-y-auto tw-border-[2px]
tw-border-solid tw-border-gray-300`}
style={{
transform: toolbarOpen ? "translateX(0)" : "translateX(calc(100% + 50px))"
}}
>
<h3 className="tw-text-lg tw-text-center">
<h3 className="tw-text-lg tw-text-center tw-bg-[#FAFAFA] tw-border-[1px] tw-border-solid tw-border-[#D9D9D9]
tw-p-1 tw-px-2 tw-rounded-md tw-font-medium">
{capitalize(`${widgetType || ""}`).replace(/_/g, " ")}
</h3>

1
src/canvas/widgets/base.js
View File

@@ -1290,6 +1290,7 @@ class Widget extends React.Component {
style={{
position: "fixed", // transforms are applied on parent so its going to be relative to parent
// TODO: this Change left and top with elementRect.left
left: left,
top: top,