feat: improve styling
This commit is contained in:
		
							parent
							
								
									ebfabb4605
								
							
						
					
					
						commit
						dde1bd4fc2
					
				@ -86,7 +86,13 @@ export const ActionBar = observer((props: any) => {
 | 
			
		||||
        }
 | 
			
		||||
      }}
 | 
			
		||||
    >
 | 
			
		||||
      <DragOverlay style={{ pointerEvents: 'none', whiteSpace: 'nowrap' }}>
 | 
			
		||||
      <DragOverlay
 | 
			
		||||
        dropAnimation={{
 | 
			
		||||
          duration: 10,
 | 
			
		||||
          easing: 'cubic-bezier(0.18, 0.67, 0.6, 1.22)',
 | 
			
		||||
        }}
 | 
			
		||||
        style={{ pointerEvents: 'none', whiteSpace: 'nowrap' }}
 | 
			
		||||
      >
 | 
			
		||||
        {dragOverlayContent}
 | 
			
		||||
        {/* <div style={{ transform: 'translateX(-100%)' }} dangerouslySetInnerHTML={{__html: dragOverlayContent}}></div> */}
 | 
			
		||||
      </DragOverlay>
 | 
			
		||||
@ -160,7 +166,7 @@ function generateActionSchema(type) {
 | 
			
		||||
      'x-component-props': {
 | 
			
		||||
        confirm: {
 | 
			
		||||
          title: '删除数据',
 | 
			
		||||
          content: '删除后无法恢复,确定要删除吗?'
 | 
			
		||||
          content: '删除后无法恢复,确定要删除吗?',
 | 
			
		||||
        },
 | 
			
		||||
        useAction: '{{ Table.useTableDestroyAction }}',
 | 
			
		||||
      },
 | 
			
		||||
@ -218,7 +224,12 @@ function AddActionButton() {
 | 
			
		||||
        </Menu>
 | 
			
		||||
      }
 | 
			
		||||
    >
 | 
			
		||||
      <Button className={'designable-btn designable-btn-dash'} style={{ marginLeft: 8 }} type={'dashed'} icon={<PlusOutlined />}>
 | 
			
		||||
      <Button
 | 
			
		||||
        className={'designable-btn designable-btn-dash'}
 | 
			
		||||
        style={{ marginLeft: 8 }}
 | 
			
		||||
        type={'dashed'}
 | 
			
		||||
        icon={<PlusOutlined />}
 | 
			
		||||
      >
 | 
			
		||||
        配置操作
 | 
			
		||||
      </Button>
 | 
			
		||||
    </Dropdown>
 | 
			
		||||
 | 
			
		||||
@ -593,7 +593,10 @@ function AddColumn() {
 | 
			
		||||
                      const values = await FormDialog(`添加字段`, () => {
 | 
			
		||||
                        return (
 | 
			
		||||
                          <FormLayout layout={'vertical'}>
 | 
			
		||||
                            <SchemaField scope={{ loadCollections }} schema={item} />
 | 
			
		||||
                            <SchemaField
 | 
			
		||||
                              scope={{ loadCollections }}
 | 
			
		||||
                              schema={item}
 | 
			
		||||
                            />
 | 
			
		||||
                          </FormLayout>
 | 
			
		||||
                        );
 | 
			
		||||
                      }).open({
 | 
			
		||||
@ -1368,7 +1371,13 @@ Table.ActionBar = observer((props: any) => {
 | 
			
		||||
        }
 | 
			
		||||
      }}
 | 
			
		||||
    >
 | 
			
		||||
      <DragOverlay style={{ pointerEvents: 'none', whiteSpace: 'nowrap' }}>
 | 
			
		||||
      <DragOverlay
 | 
			
		||||
        dropAnimation={{
 | 
			
		||||
          duration: 10,
 | 
			
		||||
          easing: 'cubic-bezier(0.18, 0.67, 0.6, 1.22)',
 | 
			
		||||
        }}
 | 
			
		||||
        style={{ pointerEvents: 'none', whiteSpace: 'nowrap' }}
 | 
			
		||||
      >
 | 
			
		||||
        {dragOverlayContent}
 | 
			
		||||
        {/* <div style={{ transform: 'translateX(-100%)' }} dangerouslySetInnerHTML={{__html: dragOverlayContent}}></div> */}
 | 
			
		||||
      </DragOverlay>
 | 
			
		||||
 | 
			
		||||
@ -264,4 +264,29 @@ td.nb-table-operation {
 | 
			
		||||
    width: 2px;
 | 
			
		||||
    background-color: #f18b62;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.ant-space-item {
 | 
			
		||||
  .droppable {
 | 
			
		||||
    position: relative;
 | 
			
		||||
  }
 | 
			
		||||
  .droppable.isDragging::after {
 | 
			
		||||
    content: '';
 | 
			
		||||
    position: absolute;
 | 
			
		||||
    top: 0;
 | 
			
		||||
    right: 0;
 | 
			
		||||
    height: 100%;
 | 
			
		||||
    width: 100%;
 | 
			
		||||
    background-color: #f18b62;
 | 
			
		||||
    opacity: .3;
 | 
			
		||||
  }
 | 
			
		||||
  .droppable:not(.isDragging).isOver::after {
 | 
			
		||||
    content: '';
 | 
			
		||||
    position: absolute;
 | 
			
		||||
    top: 0;
 | 
			
		||||
    right: -5px;
 | 
			
		||||
    height: 100%;
 | 
			
		||||
    width: 2px;
 | 
			
		||||
    background-color: #f18b62;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
@ -105,7 +105,13 @@ export const Tabs: any = observer((props: any) => {
 | 
			
		||||
          await updateSchema(data);
 | 
			
		||||
        }}
 | 
			
		||||
      >
 | 
			
		||||
        <DragOverlay style={{ pointerEvents: 'none', whiteSpace: 'nowrap' }}>
 | 
			
		||||
        <DragOverlay
 | 
			
		||||
          dropAnimation={{
 | 
			
		||||
            duration: 10,
 | 
			
		||||
            easing: 'cubic-bezier(0.18, 0.67, 0.6, 1.22)',
 | 
			
		||||
          }}
 | 
			
		||||
          style={{ pointerEvents: 'none', whiteSpace: 'nowrap' }}
 | 
			
		||||
        >
 | 
			
		||||
          {dragOverlayContent}
 | 
			
		||||
        </DragOverlay>
 | 
			
		||||
        <AntdTabs
 | 
			
		||||
 | 
			
		||||
@ -80,4 +80,26 @@
 | 
			
		||||
    margin: -24px;
 | 
			
		||||
    padding: 24px;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.ant-tabs-tab-btn {
 | 
			
		||||
  .droppable.isDragging::after {
 | 
			
		||||
    content: '';
 | 
			
		||||
    position: absolute;
 | 
			
		||||
    top: 0;
 | 
			
		||||
    right: -16px;
 | 
			
		||||
    height: 100%;
 | 
			
		||||
    left: -16px;
 | 
			
		||||
    background-color: #f18b62;
 | 
			
		||||
    opacity: .3;
 | 
			
		||||
  }
 | 
			
		||||
  .droppable:not(.isDragging).isOver::after {
 | 
			
		||||
    content: '';
 | 
			
		||||
    position: absolute;
 | 
			
		||||
    top: 0;
 | 
			
		||||
    right: -16px;
 | 
			
		||||
    height: 100%;
 | 
			
		||||
    width: 2px;
 | 
			
		||||
    background-color: #f18b62;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
		Loading…
	
		Reference in New Issue
	
	Block a user