fix: style

extensions/iceworks-project-creator/web/src/pages/CustomScaffold/components/LayoutConfig/index.module.scss

@@ -1,6 +1,6 @@
 .container {
   .list {
-    margin-bottom: 12px;
+    margin-bottom: 28px;
   }
 
   .btns {

extensions/iceworks-project-creator/web/src/pages/CustomScaffold/components/ScaffoldForm/index.module.scss

@@ -7,35 +7,46 @@
     height: calc(100vh - 220px);
     display: flex;
     flex-direction: row;
-    justify-content: space-between;
 
     .scaffoldTemplateIframe {
       height: 100%;
-      max-width: 96%;
+      margin-left: 30px;
+      margin-right: 40px;
+      flex: 1;
     }
 
-    .drawerBtn {
+    .configBtn {
       display: flex;
       justify-content: center;
       align-items: center;
       position: absolute;
-      top: 0;
-      right: -30px;
       height: 40px;
       width: 40px;
       cursor: pointer;
       background: $color-brand1-6;
+      top: 0;
+      right: 0;
+      border-radius: 4px 0 0 4px;
     }
 
+    .closeConfigBtn {
+      top: calc(50% - 60px);
+      right: 300px;
+      height: 80px;
+      width: 16px;
+    }
     .config {
       width: 300px;
-      height: 100vh;
+      height: 100%;
+      background-color: #2b2b2b;
+      padding: 20px;
     }
   }
 
   .action {
     position: absolute;
     bottom: 0;
     right: 0;
+    padding: 0 30px;
   }
 }

extensions/iceworks-project-creator/web/src/pages/CustomScaffold/components/ScaffoldForm/index.tsx

@@ -1,4 +1,5 @@
 import React, { useEffect, useRef, useState } from 'react';
+import classnames from 'classnames';
 import { Icon } from '@alifd/next';
 import LayoutConfig from '../LayoutConfig';
 import { Base64 } from 'js-base64';
@@ -7,10 +8,10 @@ import styles from './index.module.scss';
 const Scaffoldform = ({ children, onChange, scaffoldValue }) => {
   const iframeRef = useRef(null);
 
-  const [drawerVisible, setDrawerVisible] = useState<boolean>(true);
+  const [configVisible, setConfigVisible] = useState<boolean>(true);
 
   const onToggle = () => {
-    setDrawerVisible(!drawerVisible);
+    setConfigVisible(!configVisible);
   };
 
   const sendMessage = (content: string) => {
@@ -34,9 +35,9 @@ const Scaffoldform = ({ children, onChange, scaffoldValue }) => {
     <div className={styles.scaffoldForm}>
       <div className={styles.content}>
         <iframe ref={iframeRef} className={styles.scaffoldTemplateIframe} frameBorder="0" name="scaffoldTemplate" />
-        <div onClick={() => onToggle()} className={styles.drawerBtn}><Icon type="set" size="large" /></div>
+        <div onClick={() => onToggle()} className={classnames(styles.configBtn, { [styles.closeConfigBtn]: configVisible })}><Icon type={configVisible ? 'arrow-right' : 'set'} size="large" /></div>
         {
-          drawerVisible && (
+          configVisible && (
           <div className={styles.config}>
             <LayoutConfig value={scaffoldValue} onChange={onChange} />
           </div>

extensions/iceworks-project-creator/web/src/pages/CustomScaffold/index.module.scss

@@ -6,13 +6,14 @@
 
   :global {
     .next-card-content-container {
-      padding: 0 30px;
+      padding: 0 0 16px 0;
     }
   }
   .header {
     display: flex;
     justify-content: space-between;
     margin: 30px 0 50px;
+    padding: 0 30px;
 
     .title {
       font-size: 24px;
@@ -31,3 +32,8 @@
 .btn {
   margin-right: 10px;
 }
+
+.createProjectForm {
+  margin: 0 30px;
+  width: 100%;
+}

extensions/iceworks-project-creator/web/src/pages/CustomScaffold/index.tsx

@@ -119,25 +119,27 @@ const CustomScaffold = () => {
         <FormattedMessage id="web.iceworksProjectCreator.CreateProject.nextStep" />
       </Button>
     </ScaffoldForm>,
-    <CreateProjectForm
-      value={value}
-      onOpenFolderDialog={onOpenFolderDialog}
-      onChange={onFormChange}
-      errorMsg={errorMsg}
-      loading={loading}
-    >
-      <Button onClick={goPrev} className={styles.btn} disabled={prevBtnDisabled}>
-        <FormattedMessage id="web.iceworksProjectCreator.CreateProject.previous" />
-      </Button>
-      <Form.Submit
-        type="primary"
-        onClick={(values, error) => onProjectDetailSubmit(values, error)}
-        validate
+    <div className={styles.createProjectForm}>
+      <CreateProjectForm
+        value={value}
+        onOpenFolderDialog={onOpenFolderDialog}
+        onChange={onFormChange}
+        errorMsg={errorMsg}
         loading={loading}
       >
-        <FormattedMessage id="web.iceworksProjectCreator.CreateProject.complete" />
-      </Form.Submit>
-    </CreateProjectForm>,
+        <Button onClick={goPrev} className={styles.btn} disabled={prevBtnDisabled}>
+          <FormattedMessage id="web.iceworksProjectCreator.CreateProject.previous" />
+        </Button>
+        <Form.Submit
+          type="primary"
+          onClick={(values, error) => onProjectDetailSubmit(values, error)}
+          validate
+          loading={loading}
+        >
+          <FormattedMessage id="web.iceworksProjectCreator.CreateProject.complete" />
+        </Form.Submit>
+      </CreateProjectForm>
+    </div>,
   ];
 
   useEffect(() => {

extensions/iceworks-project-creator/webpack.config.js

@@ -46,7 +46,6 @@ const config = {
       patterns: [
         { from: path.join(scaffoldGeneratorLibPath, 'scaffold'), to: path.join(outputPath, 'scaffold') },
         { from: path.join(scaffoldGeneratorLibPath, 'template'), to: path.join(outputPath, 'template') },
-        { from: path.join(scaffoldGeneratorLibPath, 'configs'), to: path.join(outputPath, 'configs') },
       ],
     }),
   ],