From 6c364672d21b41c7ae0d99269fc38dc07de6720c Mon Sep 17 00:00:00 2001 From: kekee000 Date: Thu, 25 Feb 2016 16:40:00 +0800 Subject: [PATCH] modify builder --- css/main.css | 1025 +++++++++++++++++++++++++++++++++++++++++++ edp-build-config.js | 2 +- 2 files changed, 1026 insertions(+), 1 deletion(-) create mode 100644 css/main.css diff --git a/css/main.css b/css/main.css new file mode 100644 index 0000000..380bcab --- /dev/null +++ b/css/main.css @@ -0,0 +1,1025 @@ +* { + margin: 0; + padding: 0; + list-style: none; +} +blockquote, +body, +button, +dd, +dl, +dt, +fieldset, +form, +h1, +h2, +h3, +h4, +h5, +h6, +hr, +input, +legend, +li, +ol, +p, +pre, +td, +textarea, +th, +ul { + margin: 0; + padding: 0; +} +body, +button, +input, +select, +textarea { + font: 12px/1.5 tahoma, arial, sans-serif; +} +h1, +h2, +h3, +h4, +h5, +h6 { + font-size: 100%; +} +address, +cite, +dfn, +em, +var { + font-style: normal; +} +code, +kbd, +pre, +samp { + font-family: courier new, courier, monospace; +} +small { + font-size: 12px; +} +ol, +ul { + list-style: none; +} +a { + text-decoration: none; +} +a:hover { + text-decoration: underline; +} +legend { + color: #000000; +} +fieldset, +img { + border: 0; +} +button, +input, +select, +textarea { + font-size: 100%; +} +table { + border-collapse: collapse; + border-spacing: 0; +} +.modal-dialog { + margin-top: 100px; +} +.modal-dialog hr { + margin-top: 0; +} +.modal-header { + padding-top: 6px; + padding-bottom: 6px; + background: #327EC0; + color: #FFF; +} +.modal-header .close { + margin-top: 3px; +} +.modal-header .modal-title { + font-size: 14px; + line-height: 25px; +} +.modal-footer { + padding-top: 10px; + padding-bottom: 10px; +} +.modal-body { + min-height: 100px; + padding-bottom: 5px; +} +.modal-content { + border-color: rgba(0, 0, 0, 0.5); + -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); + overflow: hidden; +} +.dropdown-menu { + margin-top: 0; + border-radius: 0; + background: #323842; + border: none; +} +.dropdown-menu > li > a { + cursor: pointer; + color: #B6CBDD; +} +.dropdown-menu > li > a:hover, +.dropdown-menu > li > a:focus { + color: #FFF; + background: #232830; +} +.input-group { + margin-bottom: 10px; +} +.input-group .input-group-addon { + text-align: left; +} +.list-group-item .from { + float: right; +} +hr { + margin-top: 10px; + margin-bottom: 10px; +} +.column-2 .form-group, +.column-3 .form-group, +.column-4 .form-group { + margin-right: 10px; +} +.column-2 .form-group { + width: 45%; +} +.column-3 .form-group { + width: 30%; +} +.column-4 .form-group { + width: 22%; +} +.navbar { + height: 50px; + background: #F9F9F9; +} +.btn-groups { + line-height: 50px; +} +.btn-groups > .split { + width: 1px; + height: 30px; + line-height: 30px; + background: #D8D8D8; + margin: 0 8px; + display: inline-block; + vertical-align: middle; +} +.btn-flat { + border-radius: 0; + color: #FFF; + background: #738089; +} +.btn-flat:hover, +.btn-flat:focus { + background: #323842; + color: #B6CBDD; + outline: none; +} +.btn-flat > .ico-left { + margin-right: 8px; +} +.btn-flat > .ico { + pointer-events: none; +} +.btn-flat > .drop { + display: inline-block; +} +.btn-new { + color: #FFF; + background: #4A90E2; +} +.btn-new:hover, +.btn-new:focus { + background: #2275d7; + color: #FFF; +} +.btn-preview { + color: #FFF; + background: #28B4A0; +} +.btn-preview:hover, +.btn-preview:focus { + background: #3bd4be; + color: #FFF; +} +.btn-preview.dropdown-toggle:focus { + background: #323842; + color: #B6CBDD; +} +.btn-confirm { + color: #FFF; + background: #4A90E2; +} +.btn-confirm:hover, +.btn-confirm:focus { + background: #2275d7; + color: #FFF; +} +.btn-ico { + padding: 5px 10px; + font-size: 12px; + line-height: 1.5; +} +.btn-ico > .ico { + font-size: 16px; + line-height: 18px; + margin-right: 0; +} +.command-groups { + height: 40px; + padding-left: 8px; + overflow: hidden; + background: rgba(112, 119, 128, 0.8); +} +.command-groups > li { + float: left; + line-height: 40px; + padding: 0 8px; + color: #FFF; + cursor: pointer; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; +} +.command-groups > li > i { + font-style: normal; + text-decoration: underline; +} +.command-groups > li > .ico { + font-size: 20px; + text-decoration: none; +} +.command-groups > li:hover { + background: #8a919a; +} +.command-groups > li[data-theme="ico"] { + padding: 0 12px; +} +.command-groups > li[data-disabled] { + color: #B9BDC1; +} +.command-groups > li[data-on] { + background: #585e66; +} +.command-groups > [data-split] { + padding: 0!important; + width: 1px; + height: 40px; + background: #989ea6; + pointer-events: none; +} +.pager { + margin: 0; +} +.pager .form-control { + display: inline-block; + width: 40px; + height: 30px; + padding: 6px; + margin: 0 5px; +} +.pager [data-pager="goto"] { + margin-right: 5px; +} +.pager [data-pager="info"] { + margin: 0 5px; + color: #FFF; +} +.form-line { + line-height: 34px; +} +.form-title { + vertical-align: 3px; +} +.btn-right { + float: right; + margin-left: 10px; +} +body, +html { + margin: 0; + padding: 0; + font-size: 13px; + height: 100%; +} +::-webkit-scrollbar { + width: 12px; + height: 12px; +} +::-webkit-scrollbar-track, +::-webkit-scrollbar-thumb { + border-radius: 999px; + border: 1px solid transparent; +} +::-webkit-scrollbar-track { + box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2) inset; +} +::-webkit-scrollbar-thumb { + min-height: 20px; + background-clip: content-box; + box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.2) inset; +} +::-webkit-scrollbar-corner { + background: transparent; +} +.navbar { + border-radius: 0; + margin: 0; + padding: 0; + position: fixed; + z-index: 10; + width: 100%; + height: 51px; + min-width: 1024px; + top: 0; +} +.navbar > .logo { + float: left; + width: 180px; + height: 50px; + background: url(img/logo.png) no-repeat; + background-color: #fff; + background-position: center; + background-image: url(img/logo@1x.png); + background-image: -webkit-image-set(url(img/logo@1x.png) 1x, url(img/logo@2x.png) 2x); + background-repeat: no-repeat; +} +.navbar > .action-groups { + margin-left: 180px; + padding-left: 8px; +} +.navbar > .action-groups [data-disabled="1"] { + color: #ccc; + cursor: not-allowed; +} +.navbar > .action-groups [data-disabled="1"] a { + color: #ccc; + cursor: not-allowed; +} +.container { + display: flex; + flex: 1; +} +.sidebar { + position: fixed; + width: 180px; + top: 50px; + bottom: 0; + background: #232830; +} +.main { + margin-left: 180px; + padding-top: 90px; + height: 100%; + background: #BCC5CD; +} +.main .glyf-list { + padding: 10px 0 0 10px; +} +.main .command-groups { + margin-top: -40px; + display: none; +} +.main .pager { + position: absolute; + z-index: 10; + padding: 5px; + right: 0; + bottom: 0; + background: #707780; + display: none; +} +.main.editing { + margin-left: 70%; + padding-top: 50px; +} +.main.editing .command-groups { + display: none; +} +.loading { + position: fixed; + left: 50%; + top: 30%; + width: 200px; + margin-left: -100px; + line-height: 24px; + text-align: center; + z-index: 10000; + display: none; +} +.loading span { + display: inline-block; + padding: 0 6px; + background: rgba(84, 114, 93, 0.9); + color: #FFF; + border: 1px solid #DDD; +} +.loading[data-status="error"] span { + color: red; + background: rgba(236, 234, 69, 0.9); +} +.loading[data-status="warn"] span { + color: #FF8722; + background: rgba(255, 255, 255, 0.9); +} +.editor { + position: fixed; + width: 70%; + top: 50px; + padding-top: 40px; + bottom: 0; + z-index: 1; + background: #FEFEFE; + border-right: 1px solid #DDD; + display: none; +} +.editor .command-groups { + background: #707780; + margin-top: -40px; +} +.editor .close-editor { + position: absolute; + right: 0; + top: 0; + padding-right: 5px; + z-index: 100; + font-size: 20px; + line-height: 38px; + color: #FFF; + display: none; +} +.editor .close-editor:hover { + cursor: pointer; +} +.editor:hover .close-editor { + display: block; +} +@media screen and (min-width: 1300px) and (max-width: 1600px) { + .editor .command-groups > li, + .editor .command-groups > li[data-theme="ico"] { + padding: 0 8px; + } +} +@media screen and (max-width: 1300px) { + .editor .command-groups > li, + .editor .command-groups > li[data-theme="ico"] { + padding: 0 4px; + } +} +.editor.editing { + display: block; +} +.selection-range { + position: absolute; + z-index: 6; + display: none; + border: 1px solid #CCC; + background: rgba(222, 222, 222, 0.5); + pointer-events: none; +} +.forkme, +.userguide, +.switch-lang { + position: absolute; + color: #FFF; + color: #333; +} +.forkme { + right: 2px; + top: 2px; +} +.userguide { + right: 2px; + top: 24px; +} +.switch-lang { + right: 140px; + top: 2px; +} +.switch-lang a { + color: #666; +} +.modal { + background: -webkit-radial-gradient(center, circle contain, rgba(255, 255, 255, 0.6) 0%, rgba(0, 0, 0, 0.6) 100%); +} +.modal-content { + border-radius: 0; +} +.modal-header { + background: #fff; + color: #202430; +} +.modal-body { + background: #F8F9F9; +} +.modal-footer { + border-top: 0; + background: #F8F9F9; +} +.modal-footer .btn-default { + border-radius: 0; + color: #FFF; + background: #738089; +} +.modal-footer .btn-primary { + border-radius: 0; + background: #4A90E2; +} +html .hm-t-feedback-trigger { + bottom: 90px!important; +} +@font-face { + font-family: 'fonteditor'; + src: url('../font/fonteditor.ttf') format('truetype'); +} +.ico { + display: inline-block; +} +.ico:before, +.ico:after { + font-family: 'fonteditor'; + font-style: normal; + -webkit-font-smoothing: antialiased; + -webkit-text-stroke-width: 0.1px; +} +.i-leave:before { + content: '\e00c'; +} +.i-edit, +.i-del, +.i-leave { + font-size: 12px; +} +.i-edit:hover, +.i-del:hover, +.i-leave:hover { + cursor: pointer; + color: #4A90E2; +} +.i-edit, +.i-del { + color: #76abe9; +} +.i-edit:before { + content: '\e021'; +} +.i-del:before { + content: '\e020'; +} +.i-github:before { + content: '\e01e'; +} +.i-help:before { + content: '\e016'; +} +.i-new:before { + content: '\e019'; +} +.i-open:before { + content: '\e01A'; +} +.i-add:before { + content: '\e003'; +} +.i-undo:before { + content: '\e001'; +} +.i-redo:before { + content: '\e002'; +} +.i-down:before { + content: '\e00e'; +} +.i-left:before { + content: '\e00a'; +} +.i-ttf:before { + content: '\e00f'; +} +.i-woff:before { + content: '\e010'; +} +.i-zip:before { + content: '\e011'; +} +.i-save:before { + content: '\e022'; +} +.i-upshape:before { + content: '\e014'; +} +.i-downshape:before { + content: '\e00b'; +} +.i-reversepoints:before { + content: '\e00d'; +} +.i-alignleft:before { + content: '\e006'; +} +.i-aligncenter:before { + content: '\e004'; +} +.i-alignright:before { + content: '\e007'; +} +.i-aligntop:before { + content: '\e008'; +} +.i-alignmiddle:before { + content: '\e005'; +} +.i-aligndescent:before { + content: '\e009'; +} +.i-alignbaseline:before { + content: '\e009'; +} +.i-rotateleft:before { + content: '\e01c'; +} +.i-rotateright:before { + content: '\e01d'; +} +.i-flip:before { + content: '\e013'; +} +.i-mirror:before { + content: '\e012'; +} +.i-splitshapes:before { + content: '\e024'; +} +.i-joinshapes:before { + content: '\e025'; +} +.i-intersectshapes:before { + content: '\e026'; +} +.i-tangencyshapes:before { + content: '\e027'; +} +.i-rangemode:before { + content: '\e029'; +} +.i-pointmode:before { + content: '\e028'; +} +.project-btns { + margin: 0 15px; + padding: 10px 0; + border-bottom: #353D45 1px solid; +} +.project-btns .btn { + padding-left: 12px; + padding-right: 12px; +} +.project-btns .btn:last-child { + float: right; + margin-right: 0; +} +.project .project-title { + font-weight: bold; + color: #6F7D88; + padding-left: 15px; + line-height: 32px; +} +.project .project-list dl { + padding: 0 10px 0 15px; + cursor: pointer; +} +.project .project-list dl dt { + line-height: 28px; + font-weight: normal; + color: #9EB0C0; +} +.project .project-list dl dd { + display: none; + line-height: 28px; + color: #6F7D88; +} +.project .project-list dl dd span { + margin-right: 10px; +} +.project .project-list dl dd span:hover { + text-decoration: underline; +} +.project .project-list dl:hover { + background: #48515f; +} +.project .project-list dl:hover dt { + color: #FFF; +} +.project .project-list dl.selected { + background: #323842; +} +.project .project-list dl.selected dd { + display: block; +} +.glyf-list { + height: 100%; + overflow: auto; +} +.glyf-list > .glyf-item { + float: left; + position: relative; + margin: 10px; + width: 80px; + box-shadow: 1px 1px 4px #999; + cursor: pointer; + background: #ECECEC; +} +.glyf-list > .glyf-item .unicode, +.glyf-list > .glyf-item .name { + font-size: 12px; + line-height: 20px; + height: 20px; + padding-left: 4px; + color: #45283F; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} +.glyf-list > .glyf-item .unicode { + color: #70A9D6; +} +.glyf-list > .glyf-item .glyf { + width: 80px; + height: 80px; + border: 3px solid #FFF; + background: #FFF; + box-sizing: border-box; + display: block; +} +.glyf-list > .glyf-item .glyf .path { + fill: #232830; +} +.glyf-list > .glyf-item .i-del, +.glyf-list > .glyf-item .i-edit { + position: absolute; + right: 4px; + padding: 0 2px; + display: none; +} +.glyf-list > .glyf-item .i-edit { + right: 20px; +} +.glyf-list > .glyf-item:hover .glyf, +.glyf-list > .selected .glyf { + border-color: #232830; +} +.glyf-list > .glyf-item:hover .name, +.glyf-list > .selected .name { + color: #FFF; +} +.glyf-list > .glyf-item:hover { + background: #3C619B; +} +.glyf-list > .glyf-item:hover .name { + color: #FFF; +} +.glyf-list > .glyf-item:hover .i-del { + display: block; +} +.glyf-list > .glyf-item:hover .i-edit { + display: block; +} +.glyf-list > .selected, +.glyf-list > .selected:hover { + background: #232830; +} +.glyf-list > .editing .glyf, +.glyf-list > .editing:hover .glyf { + border-color: #066BC5; +} +.glyf-list > .compound .path { + fill: #80ff80 !important; +} +.glyf-list > .new .path, +.glyf-list > .edit .path { + fill: blue!important; +} +.glyf-list.xlarge > .glyf-item { + width: 160px; +} +.glyf-list.xlarge > .glyf-item .glyf { + width: 160px; + height: 160px; +} +.glyf-list.large > .glyf-item { + width: 120px; +} +.glyf-list.large > .glyf-item .glyf { + width: 120px; + height: 120px; +} +.glyf-list.small > .glyf-item { + width: 60px; +} +.glyf-list.small > .glyf-item .glyf { + width: 60px; + height: 60px; +} +.glyf-list.no-hover .glyf-item { + pointer-events: none; +} +.glyf-editor { + width: 100%; + height: 100%; + font-size: 12px; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + display: none; +} +.glyf-editor .marker-x, +.glyf-editor .marker-y { + position: absolute; + width: 0; + height: 0; + z-index: 60; + pointer-events: none; +} +.glyf-editor .marker-x { + width: 20px; + border-top: 1px dashed #000; +} +.glyf-editor .marker-y { + height: 20px; + border-left: 1px dashed #000; +} +.editor-contextmenu { + color: #333; + width: 150px; + border: 1px solid #999; + background: #FEFEFE; + line-height: 24px; + padding: 0 4px; + box-shadow: 1px 1px 1px #CCC; + position: absolute; +} +.editor-contextmenu li { + padding-left: 4px; + cursor: pointer; + border-bottom: 1px solid #CCC; +} +.editor-contextmenu li > ul { + display: none; + color: #333; + width: 150px; + border: 1px solid #999; + background: #FEFEFE; + line-height: 24px; + padding: 0 4px; + box-shadow: 1px 1px 1px #CCC; + position: absolute; + margin-left: 130px; +} +.editor-contextmenu > li[data-sub] { + color: #4A90E2; +} +.editor-contextmenu > li[data-sub]:after { + content: '>'; + margin-right: 10px; + float: right; + font-family: 'Simsun'; +} +.editor-contextmenu li[data-tag="selected"] { + display: inline-block; + display: block; +} +.editor-contextmenu li[data-tag="selected"]:before, +.editor-contextmenu li[data-tag="selected"]:after { + font-family: 'fonteditor'; + font-style: normal; + -webkit-font-smoothing: antialiased; + -webkit-text-stroke-width: 0.1px; +} +.editor-contextmenu li[data-tag="selected"]:after { + content: '\e01f'; +} +.editor-contextmenu li[data-tag="selected"]:after { + float: right; + margin-right: 4px; + color: #4A90E2; +} +.editor-contextmenu li:hover { + background: #EEE; +} +.editor-contextmenu li:hover > ul { + display: block; +} +.editor-contextmenu li:last-child { + border-bottom: none; +} +.setting-metrics .modal-dialog { + width: 800px; +} +.setting-metrics .panose-inline { + margin-bottom: -15px; +} +.setting-metrics .panose-inline .input-group { + width: 100%; +} +.list-font-online { + max-height: 400px; + overflow: auto; +} +.import-pic-dialog .modal-dialog { + width: 960px; +} +.import-pic-dialog .modal-body { + padding-bottom: 0; +} +.import-pic-dialog .preview-panel { + background: #FFF; + margin-bottom: 15px; +} +.import-pic-dialog .preview-panel .canvas-left, +.import-pic-dialog .preview-panel .canvas-right { + display: inline-block; + width: 50%; + height: 420px; + overflow: auto; +} +.import-pic-dialog .preview-panel .canvas-left { + border-right: 1px solid #BAC1CB; +} +.import-pic-dialog .preview-panel.fitpanel canvas { + max-width: 100%; + max-height: 99%; +} +.import-pic-dialog .preview-panel.showleft .canvas-left { + width: 100%; + border-right: none; + display: inline-block; +} +.import-pic-dialog .preview-panel.showleft .canvas-right { + display: none; +} +.import-pic-dialog .preview-panel.showright .canvas-right { + width: 100%; + display: inline-block; +} +.import-pic-dialog .preview-panel.showright .canvas-left { + display: none; +} +.import-pic-dialog .import-pic-url { + position: absolute; + margin-top: 30px; + background: #4A90E2; + padding: 10px 10px 0; + border-bottom-left-radius: 5px; + border-bottom-right-radius: 5px; + display: none; +} +.import-pic-dialog .import-pic-url.show-url { + display: block; +} +.glyf-download-dialog .field-margin { + margin-left: 15px; +} +.glyf-download-dialog .color-picker { + width: 25px; + height: 25px; +} +.glyf-download-dialog .preview-panel { + height: 360px; + text-align: center; + overflow: auto; + position: relative; +} +.glyf-download-dialog .preview-panel > canvas { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); +} +.glyf-download-dialog .glyf-download-btn { + text-align: center; +} +.glyf-download-dialog .glyf-download-btn .btn-flat { + padding: 10px 15px; +} +.glyf-download-dialog .glyf-download-btn .field-margin { + margin-left: 30px; +} +.cp-color-picker { + z-index: 10000; +} diff --git a/edp-build-config.js b/edp-build-config.js index 22fde23..d7042d6 100644 --- a/edp-build-config.js +++ b/edp-build-config.js @@ -8,7 +8,7 @@ exports.getProcessors = function () { return [ - // new LessCompiler( { + // new LessCompiler({ // files: [ // 'css/main.less', // 'css/preview.less'