change style

packages/dooringx-example/src/global.less

@@ -1,3 +0,0 @@
-.ant-menu-title-content {
-	margin: 0 !important;
-}

packages/dooringx-example/src/layouts/index.tsx

@@ -2,7 +2,7 @@
  * @Author: yehuozhili
  * @Date: 2021-07-07 14:51:17
  * @LastEditors: yehuozhili
- * @LastEditTime: 2021-07-27 16:24:29
+ * @LastEditTime: 2021-08-12 14:37:38
  * @FilePath: \dooringx\packages\dooringx-example\src\layouts\index.tsx
  */
 import { Button } from 'antd';

packages/dooringx-example/src/pages/index.tsx

@@ -2,7 +2,7 @@
  * @Author: yehuozhili
  * @Date: 2021-05-15 12:49:28
  * @LastEditors: yehuozhili
- * @LastEditTime: 2021-08-11 16:26:46
+ * @LastEditTime: 2021-08-12 15:57:35
  * @FilePath: \dooringx\packages\dooringx-example\src\pages\index.tsx
  */
 import {
@@ -14,7 +14,7 @@ import {
 	ContainerWrapper,
 	Control,
 } from 'dooringx-lib';
-import { InsertRowBelowOutlined, CalendarOutlined } from '@ant-design/icons';
+import { InsertRowBelowOutlined } from '@ant-design/icons';
 import { useContext } from 'react';
 import { configContext } from '@/layouts';
 import { useCallback } from 'react';
@@ -24,9 +24,6 @@ export const HeaderHeight = '40px';
 const footerConfig = function () {
 	return (
 		<>
-			<Popover content={'日历'} title={null} trigger="hover">
-				<Button type="text" icon={<CalendarOutlined />}></Button>
-			</Popover>
 			<Popover content={'快捷键'} title={null} trigger="hover">
 				<Button type="text" icon={<InsertRowBelowOutlined />}></Button>
 			</Popover>
@@ -72,12 +69,7 @@ export default function IndexPage() {
 				}}
 			>
 				<div style={{ height: '100%' }}>
-					<LeftConfig
+					<LeftConfig footerConfig={footerConfig()} config={config}></LeftConfig>
-						mode="vertical"
-						showName={true}
-						footerConfig={footerConfig()}
-						config={config}
-					></LeftConfig>
 				</div>
 
 				<ContainerWrapper config={config}>

packages/dooringx-example/src/plugin/index.tsx

@@ -2,7 +2,7 @@
  * @Author: yehuozhili
  * @Date: 2021-02-27 21:33:36
  * @LastEditors: yehuozhili
- * @LastEditTime: 2021-08-05 10:54:22
+ * @LastEditTime: 2021-08-12 14:43:05
  * @FilePath: \dooringx\packages\dooringx-example\src\plugin\index.tsx
  */
 
@@ -47,6 +47,7 @@ export const defaultConfig: Partial<InitConfig> = {
 			type: 'xxc',
 			icon: <ContainerOutlined />,
 			custom: true,
+			displayName: '自定义',
 			customRender: <div>我是自定义渲染</div>,
 		},
 	],

packages/dooringx-lib/src/components/leftConfig.tsx

@@ -2,7 +2,7 @@
  * @Author: yehuozhili
  * @Date: 2021-02-04 10:32:45
  * @LastEditors: yehuozhili
- * @LastEditTime: 2021-07-12 17:12:35
+ * @LastEditTime: 2021-08-12 15:50:48
  * @FilePath: \dooringx\packages\dooringx-lib\src\components\leftConfig.tsx
  */
 import React, { ReactNode, useEffect, useMemo, useState } from 'react';
@@ -18,7 +18,7 @@ interface LeftConfigProps {
 	config: UserConfig;
 	showName?: Boolean;
 	footerConfig?: ReactNode;
-	mode?: modeType | undefined;
+	mode?: modeType;
 }
 
 /**
@@ -154,14 +154,20 @@ function LeftConfig(props: LeftConfigProps) {
 	return (
 		<div style={{ display: 'flex', height: '100%' }}>
 			<div style={{ display: 'flex', flexDirection: 'column' }}>
-				<Menu style={{ flex: 1 }} defaultSelectedKeys={[menuSelect]} mode="vertical">
+				<Menu
+					style={{ flex: 1 }}
+					defaultSelectedKeys={[menuSelect]}
+					mode="vertical"
+					inlineCollapsed={props.showName ? false : true}
+					className={`${styles.menuWidth} ${styles.menus}`}
+				>
 					{leftMapRenderListCategory.map((v, i) => {
 						return (
 							<Menu.Item
 								key={i}
 								onClick={() => setMenuSelect(i + '')}
 								icon={v.icon}
-								className={props.mode === 'vertical' ? `${styles.menuStyle}` : ''}
+								className={props.mode === 'vertical' ? `${styles.menuStyle} ${styles.menus}` : ''}
 							>
 								{props.showName && v.displayName}
 							</Menu.Item>

packages/dooringx-lib/src/index.less

@@ -162,14 +162,22 @@
 		}
 	}
 }
+.menuWidth.menus {
+	width: initial;
+}
 
-.menuStyle {
+.menuStyle.menus {
 	display: flex;
 	flex-direction: column;
 	justify-content: center;
 	text-align: center;
-	height: auto !important ;
+	height: auto;
-	padding: 8px 16px !important ;
+	span:nth-child(1) {
+		margin-top: 10px;
+	}
+	span:nth-child(2) {
+		margin-left: 0;
+	}
 }
 .menu_footer {
 	display: flex;