fix style

package.json

@@ -1,6 +1,6 @@
 {
   "name": "nva-client",
-  "version": "1.2.10",
+  "version": "1.2.11",
   "description": "gui client form nva",
   "main": "dist/main/index.js",
   "scripts": {

renderer/component/confirm.tsx

@@ -28,9 +28,9 @@ export default class Confirm extends React.Component<any, any> {
       }}>
         <div className="modal-mask"></div>
         <div className="modal-inner px-20 py-12">
-          <p className="m-0 text-center py-8">{this.content}</p>
+          <p className="m-0 text-center py-8 text-gray text-md">{this.content}</p>
           <div className="text-right mt-12">
-            <button className="btn btn-primary px-16 mr-12" onClick={() => {
+            <button className="btn btn-success px-16 mr-12" onClick={() => {
               this.ok()
               this.handleClose()
             }}>

renderer/component/icon.tsx

@@ -3,11 +3,14 @@ import * as React from 'react'
 interface Props {
   type: string,
   size?: number,
-  color?: string
+  color?: string,
+  hide?: boolean
+  className?: string,
+  onClick?: (event: any) => void
 }
 
-export default ({ type, size = 14, color = 'inhreit' }: Props) => {
+export default ({ type, size = 14, color = 'inhreit', hide = false, className = '', onClick = () => {} }: Props) => {
   return (
-    <i className={`icon ion-md-${type}`} style={{ fontSize: `${size}px`, color }}></i>
+    <i className={`icon ion-md-${type} ${className}`} style={{ fontSize: `${size}px`, color, visibility: hide ? 'hidden' : 'visible' }} onClick={onClick}></i>
   )
 }

renderer/config/template.ts

@@ -2,18 +2,19 @@ import t from '../locale'
 
 export default (locale: string): Record<string, string> => {
   const message = t(locale)
+  let prefix = 'ali322'
   return {
-    [`${message.spa}(vue + vuex + vue-router)`]: 'ali322/frontend-boilerplate#vue-spa',
-    [`${message.micro}(vue + vuex + vue-router)`]: 'ali322/frontend-boilerplate#micro',
-    [`${message.spa}(react + redux + react-router)`]: 'ali322/frontend-boilerplate#spa',
-    [`${message.spa}(react + mobx + react-router)`]: 'ali322/frontend-boilerplate#mobx-spa',
-    [`${message.mpa}(vue + vuex)`]: 'ali322/frontend-boilerplate#vue',
-    [`${message.mpa}(react + redux)`]: 'ali322/frontend-boilerplate#master',
-    [`${message.spa}(react + mobx)`]: 'ali322/frontend-boilerplate#mobx',
+    [`${message.spa}(vue + vuex + vue-router)`]: `${prefix}/frontend-boilerplate#vue-spa`,
+    [`${message.micro}(vue + vuex + vue-router)`]: `${prefix}/frontend-boilerplate#micro`,
+    [`${message.spa}(react + redux + react-router)`]: `${prefix}/frontend-boilerplate#spa`,
+    [`${message.spa}(react + mobx + react-router)`]: `${prefix}/frontend-boilerplate#mobx-spa`,
+    [`${message.mpa}(vue + vuex)`]: `${prefix}/frontend-boilerplate#vue`,
+    [`${message.mpa}(react + redux)`]: `${prefix}/frontend-boilerplate#master`,
+    [`${message.spa}(react + mobx)`]: `${prefix}/frontend-boilerplate#mobx`,
 
-    [`SSR ${message.spa}(koa + react + redux + react-router)`]: 'ali322/ssr-boilerplate#spa',
-    [`SSR ${message.spa}(koa + vue + vuex + vue-router)`]: 'ali322/ssr-boilerplate#vue-spa',
-    [`SSR ${message.mpa}(react+redux)`]: 'ali322/ssr-boilerplate#master',
-    [`SSR ${message.mpa}(vue+vuex)`]: 'ali322/ssr-boilerplate#vue'
+    [`SSR ${message.spa}(koa + react + redux + react-router)`]: `${prefix}/ssr-boilerplate#spa`,
+    [`SSR ${message.spa}(koa + vue + vuex + vue-router)`]: `${prefix}/ssr-boilerplate#vue-spa`,
+    [`SSR ${message.mpa}(react+redux)`]: `${prefix}/ssr-boilerplate#master`,
+    [`SSR ${message.mpa}(vue+vuex)`]: `${prefix}/ssr-boilerplate#vue`
   }
 }

renderer/locale/en_us.ts

@@ -57,7 +57,9 @@ export default {
   submit: 'Submit',
   confirm: 'Confirm',
   cancel: 'Cancel',
-  initProjectFailed: 'Init project failed',
+  yes: 'Yes',
+  nope: 'No',
+  createProjectFailed: 'create project failed',
   update: 'Update',
   installDepsNow: 'Install Dependencies Now?',
   latestVersion: 'Latest Version',

renderer/locale/zh_cn.ts

@@ -25,7 +25,7 @@ export default {
   project: '项目',
   settings: '设置',
   // project
-  createProject: '创建项目',
+  createProject: '创建新项目',
   creating: '创建中',
   openProject: '打开项目',
   runDev: '运行开发',
@@ -57,7 +57,9 @@ export default {
   confirm: '确定',
   submit: '提交',
   cancel: '取消',
-  initProjectFailed: '初始化项目失败',
+  yes: '是',
+  nope: '否',
+  createProjectFailed: '创建项目失败',
   update: '更新',
   installDepsNow: '是否立刻安装依赖包?',
   latestVersion: '最新版本',

renderer/scene/index/setup/index.tsx

@@ -53,7 +53,7 @@ export default class Setup extends React.Component<any, any> {
         </div>
         <Modal active={this.modalVisible} width={300} onClose={() => this.modalVisible = false}>
           <div className="py-24">
-            <p className="text-center">{message.resetAppNow}</p>
+            <p className="text-center text-md">{message.resetAppNow}</p>
             <div className="d-flex flex-row justify-content-center">
               <button className="btn btn-success px-12 mr-12"
                 onClick={() => {

renderer/scene/index/workbench/index.tsx

@@ -47,7 +47,6 @@ export default class WorkBench extends React.Component<any, any> {
     if (index < 0) {
       addHistory(project)
     }
-    this.project.wrappedInstance.stop()
     saveOpened(project)
     this.modalActived = false
     this.drawerActived = false
@@ -140,7 +139,7 @@ export default class WorkBench extends React.Component<any, any> {
         {this.renderOperations()}
         {this.renderProject()}
         <Modal width={600} active={this.modalActived} onClose={() => this.modalActived = false}>
-          <ProjectForm onCreate={this.createProject} onFail={() => this.toast.error(message.initProjectFailed)} onCancel={() => this.modalActived = false}></ProjectForm>
+          <ProjectForm onCreate={this.createProject} onFail={() => this.toast.error(message.createProjectFailed)} onCancel={() => this.modalActived = false}></ProjectForm>
         </Modal>
         <Toast ref={(ref: any) => this.toast = ref}></Toast>
       </div>

renderer/scene/index/workbench/project-drawer.tsx

@@ -39,7 +39,7 @@ export default ({ active = false, opened, histories, children, toggleActive, del
                     toggleActive()
                   }}>
                   <div className="history-head w-100 position-relative">
-                    <span className={`flex-1 d-block text-base pr-20 line-height-25 text-truncate ${opened.path === history.path ? 'text-gray font-weight-bold' : 'text-muted'}`}>{history.name}</span>
+                    <span className={`flex-1 d-block text-l pr-20 line-height-25 text-truncate ${opened.path === history.path ? 'text-gray font-weight-bold' : 'text-muted'}`}>{history.name}</span>
                     <button className="delete-history p-0 border-0 outline-0 bg-transparent"
                       onClick={(e: any) => {
                         e.stopPropagation()
@@ -48,7 +48,7 @@ export default ({ active = false, opened, histories, children, toggleActive, del
                       <Icon type="trash" size={14}></Icon>
                     </button>
                   </div>
-                  <p className={`m-0 text-sm text-truncate ${opened.path === history.path ? 'text-gray' : 'text-muted'}`}>{history.path}</p>
+                  <p className={`m-0 py-4 text-sm text-truncate ${opened.path === history.path ? 'text-gray' : 'text-muted'}`}>{history.path}</p>
                 </span>
               ))}
             </div>

renderer/scene/index/workbench/project-extra.tsx

@@ -69,12 +69,12 @@ export default class ProjectExtra extends React.Component<any, any> {
     if (this.modalType === ModalType.addDep) {
       return (
         <div className="py-24 w-100">
-          <div className="input-wrapper mb-12 px-20" style={{ width: '220px' }}>
+          <div className="input-wrapper mb-12 px-20" style={{ width: '280px' }}>
             <input type="text" placeholder={message.typePackage} className="input input--sm" onChange={(e: any) => {
               this.name = e.target.value
             }}/>
           </div>
-          <div className="input-wrapper px-20 mb-20" style={{ width: '220px' }}>
+          <div className="input-wrapper px-20 mb-20" style={{ width: '280px' }}>
             <input type="text" placeholder={message.typeVersion} className="input input--sm" onChange={(e: any) => {
               this.version = e.target.value
             }}/>
@@ -136,11 +136,11 @@ export default class ProjectExtra extends React.Component<any, any> {
                 installPKG()
                 this.modalVisible = false
               }}>
-              <span>{message.submit}</span>
+              <span>{message.yes}</span>
             </button>
             <button className="btn btn-secondary px-12"
               onClick={() => this.modalVisible = false}>
-              <span>{message.cancel}</span>
+              <span>{message.nope}</span>
             </button>
           </div>
         </div>

renderer/scene/index/workbench/project-form.tsx

@@ -86,7 +86,8 @@ export default class ProjectForm extends React.Component<any, any> {
           path: this.saved
         }
         onCreate(project)
-      } catch (_) {
+      } catch (e) {
+        console.log(e)
         onFail()
       } finally {
         this.downloading = false
@@ -108,7 +109,7 @@ export default class ProjectForm extends React.Component<any, any> {
       <div className="h-100 d-flex flex-column pt-28 pb-12">
         <div className="header-border bg-white pb-12 d-flex">
           <div className="flex-1 text-center">
-            <h1 className="text-xl">{message.initProject}</h1>
+            <h1 className="text-xl">{message.createProject}</h1>
           </div>
         </div>
         <div className="flex-1 d-flex justify-content-start align-items-start p-20 pb-0">

renderer/scene/index/workbench/project.tsx

@@ -157,8 +157,8 @@ export default class Project extends React.Component<any, any> {
         <div className="d-flex justify-content-center align-items-center pl-32">
           <div className="text-xl pr-2">{name}</div>
         </div>
-        <button disabled={running} onClick={toggleDrawer} className="outline-0 pl-8 pt-4 border-0 bg-transparent line-height-25 cursor-pointer">
-          <Icon type="arrow-dropdown"></Icon>
+        <button disabled={running || working} onClick={toggleDrawer} className="outline-0 pl-8 pt-4 border-0 bg-transparent line-height-25 cursor-pointer">
+          <Icon type="arrow-dropdown" hide={running || working}></Icon>
         </button>
         <div className="flex-1 text-left pl-12">
           <button

renderer/style/component.less

@@ -218,7 +218,7 @@
     }
     .form-group__content{
       flex: 0 1 80%;
-      padding-left: 15px;
+      // padding-left: 15px;
     }
   }
 }

renderer/style/reboot.less

@@ -15,6 +15,7 @@ html {
   font-size: 16px;
   line-height: 1.15;
   box-sizing: border-box;
+  color: rgba(0,0,0,.65);
 }
 
 *,
@@ -28,6 +29,12 @@ a {
   text-decoration: none;
   outline: none;
 }
+h1,h2,h3,h4,h5,h6{
+  color: rgba(0,0,0,.65);
+  margin-top: 0;
+  margin-bottom: 4px;
+  font-weight: 400;
+}
 
 ol ol,
 ul ul,
@@ -63,7 +70,7 @@ ul ol {
   color: #878e90;
 }
 .text-gray{
-  color: #465154;
+  color: rgba(0,0,0,.65);
 }
 .text-center{
   text-align: center;
@@ -82,8 +89,12 @@ ul ol {
 .text-sm{
   font-size: 12px;
 }
+.text-l{
+  font-size: 18px;
+}
 .text-xl{
   font-size: 20px;
+  line-height: 28px;
 }
 .font-weight-bold{
   font-weight: 600;