resovel conflix

Reviewed-on: #50

assets/scss/common.scss

@@ -9,6 +9,8 @@
 @import "./common/card.scss";
 @import "./common/tabs.scss";
 @import "./common/numericInput.scss";
+@import "./common/editor.scss";
+
 
 html,
 body {
@@ -1170,14 +1172,14 @@ a {
       }
     }
 
-    .toastui-editor-contents {
-      * {
-        color: map-deep-get($config,
-          #{$theme},
-          "tui-editor-contents-color"
-        ) !important;
-      }
-    }
+    // .toastui-editor-contents {
+    //   * {
+    //     color: map-deep-get($config,
+    //       #{$theme},
+    //       "tui-editor-contents-color"
+    //     ) !important;
+    //   }
+    // }
 
     .lnb-logo {
       color: map-deep-get($config, #{$theme}, "v-dialog-card-text-color");

assets/scss/common/button.scss

@@ -137,6 +137,11 @@
         color:map-deep-get($config, #{$theme}, "ant-btn-default-color");
       }
 
+      &.ant-btn-popup-default {
+        background:map-deep-get($config, #{$theme}, "ant-btn-popup-bg");
+        color:map-deep-get($config, #{$theme}, "ant-btn-popup-color");
+      }
+
       &.ant-btn-danger {
         &.ant-btn-background-ghost {
           color:map-deep-get($config, #{$theme}, "ant-btn-danger-color");

assets/scss/common/editor.scss

@@ -0,0 +1,474 @@
+@charset "utf-8";
+.toastui-editor-dark .toastui-editor-defaultUI {
+  border-color: #424242;
+  color: #eee;
+}
+
+.toastui-editor-dark .toastui-editor-md-container,
+.toastui-editor-dark .toastui-editor-ww-container {
+  background-color: #212224;
+}
+
+.toastui-editor-dark .toastui-editor-defaultUI-toolbar {
+  background-color: #212224;
+  border-bottom-color: #303238;
+}
+
+.toastui-editor-dark .toastui-editor-toolbar-icons {
+  background-position-y: -49px;
+  border-color: #232428;
+}
+
+.toastui-editor-dark .toastui-editor-toolbar-icons:not(:disabled):hover {
+  background-color: #36383f;
+  border-color: #36383f;
+}
+
+.toastui-editor-dark .toastui-editor-toolbar-divider {
+  background-color: #303238;
+}
+
+.toastui-editor-dark .toastui-editor-tooltip {
+  background-color: #535662;
+}
+
+.toastui-editor-dark .toastui-editor-tooltip .arrow {
+  background-color: #535662;
+}
+
+.toastui-editor-dark .toastui-editor-defaultUI-toolbar .scroll-sync::before {
+  color: #8f939f;
+}
+
+.toastui-editor-dark .toastui-editor-defaultUI-toolbar .scroll-sync.active::before {
+  color: #67ccff;
+}
+
+.toastui-editor-dark .toastui-editor-defaultUI-toolbar .switch {
+  background-color: #2b4455;
+}
+
+.toastui-editor-dark .toastui-editor-defaultUI-toolbar input:checked + .switch {
+  background-color: #2b4455;
+}
+
+.toastui-editor-dark .toastui-editor-defaultUI-toolbar .switch::before {
+  background-color: #8f939f;
+}
+
+.toastui-editor-dark .toastui-editor-defaultUI-toolbar input:checked + .switch::before {
+  background-color: #67ccff;
+}
+
+.toastui-editor-dark .toastui-editor-main .toastui-editor-md-splitter {
+  background-color: #303238;
+}
+
+.toastui-editor-dark .toastui-editor-mode-switch {
+  border-top-color: #424242;
+  background-color: #212224;
+}
+
+.toastui-editor-dark .toastui-editor-mode-switch .tab-item {
+  border-color: #424242;
+  background-color: #212224;
+  color: #eee;
+}
+
+.toastui-editor-dark .toastui-editor-mode-switch .tab-item.active {
+  border-top-color: #424242;
+  background-color: #212224;
+  color: #1677FF;
+}
+
+.toastui-editor-dark .toastui-editor-popup,
+.toastui-editor-dark .toastui-editor-context-menu {
+  background-color: #121212;
+  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.08);
+  border-color: #494c56;
+}
+
+.toastui-editor-dark .toastui-editor-popup-add-heading ul li:hover {
+  background-color: #36383f;
+}
+
+.toastui-editor-dark .toastui-editor-popup-body label {
+  color: #9a9da3;
+}
+
+.toastui-editor-dark .toastui-editor-popup-body input[type='text'] {
+  background-color: transparent;
+  color: #eee;
+  border-color: #303238;
+}
+
+.toastui-editor-dark .toastui-editor-popup-body input[type='text']:focus {
+  outline-color: #67ccff;
+}
+
+.toastui-editor-dark .toastui-editor-popup-body input[type='text'].disabled {
+  color: #969aa5;
+  border-color: #303238;
+  background-color: rgba(48, 50, 56, 0.4);
+}
+
+.toastui-editor-dark .toastui-editor-popup-add-image .toastui-editor-tabs .tab-item {
+  border-bottom-color: #292e37;
+  color: #eee;
+}
+
+.toastui-editor-dark .toastui-editor-popup-add-image .toastui-editor-tabs .tab-item:hover {
+  border-bottom-color: #3c424d;
+}
+
+.toastui-editor-dark .toastui-editor-popup-add-image .toastui-editor-tabs .tab-item.active {
+  color: #67ccff;
+  border-bottom-color: #67ccff;
+}
+
+.toastui-editor-dark .toastui-editor-popup-body .toastui-editor-file-name {
+  border-color: #303238;
+  color: #eee;
+}
+
+.toastui-editor-dark .toastui-editor-popup-body .toastui-editor-file-select-button {
+  border-color: #303238;
+  background-color: #232428;
+  color: #eee;
+}
+
+.toastui-editor-dark .toastui-editor-popup-body .toastui-editor-file-select-button:hover {
+  border-color: #494c56;
+}
+
+.toastui-editor-dark.toastui-editor-defaultUI .toastui-editor-close-button {
+  color: #eee;
+  border-color: #303238;
+  background-color: #232428;
+}
+
+.toastui-editor-dark.toastui-editor-defaultUI .toastui-editor-close-button:hover {
+  border-color: #494c56;
+}
+
+.toastui-editor-dark.toastui-editor-defaultUI .toastui-editor-ok-button {
+  color: #121212;
+  background-color: #67ccff;
+}
+
+.toastui-editor-dark.toastui-editor-defaultUI .toastui-editor-ok-button:hover {
+  color: #121212;
+  background-color: #32baff;
+}
+
+.toastui-editor-dark .toastui-editor-popup-add-table .toastui-editor-table-cell {
+  border-color: #303238;
+  background-color: #121212;
+}
+
+.toastui-editor-dark .toastui-editor-popup-add-table .toastui-editor-table-cell.header {
+  border-color: #303238;
+  background-color: #232428;
+}
+
+.toastui-editor-dark .toastui-editor-popup-add-table .toastui-editor-table-selection-layer {
+  border-color: rgba(103, 204, 255, 0.4);
+  background-color: rgba(103, 204, 255, 0.1);
+}
+
+.toastui-editor-dark .toastui-editor-popup-add-table .toastui-editor-table-description {
+  color: #eee
+}
+
+.toastui-editor-dark .toastui-editor-md-tab-container {
+  background-color: #232428;
+  border-bottom-color: #303238;
+}
+
+.toastui-editor-dark .toastui-editor-md-tab-container .tab-item {
+  border-color: #393b42;
+  background-color: #2d2f34;
+  color: #757a86;
+}
+
+.toastui-editor-dark .toastui-editor-md-tab-container .tab-item.active {
+  border-bottom-color: #121212;
+  background-color: #121212;
+  color: #eee;
+}
+
+
+.toastui-editor-dark .toastui-editor-context-menu .menu-group {
+  border-bottom-color: #303238;
+  color: #eee;
+}
+
+.toastui-editor-dark .toastui-editor-context-menu .menu-item span::before {
+  background-position-y: -126px;
+}
+
+.toastui-editor-dark .toastui-editor-context-menu li:not(.disabled):hover {
+  background-color: #36383f;
+}
+
+.toastui-editor-dark .toastui-editor-context-menu li.disabled {
+  color: #969aa5;
+}
+
+.toastui-editor-dark .toastui-editor-dropdown-toolbar {
+  border-color: #494c56;
+  background-color: #232428;
+}
+
+.toastui-editor-dark .ProseMirror,
+.toastui-editor-dark .toastui-editor-contents p,
+.toastui-editor-dark .toastui-editor-contents h1,
+.toastui-editor-dark .toastui-editor-contents h2,
+.toastui-editor-dark .toastui-editor-contents h3,
+.toastui-editor-dark .toastui-editor-contents h4,
+.toastui-editor-dark .toastui-editor-contents h5,
+.toastui-editor-dark .toastui-editor-contents h6 {
+  color: #fff;
+}
+
+.toastui-editor-dark .toastui-editor-contents h1,
+.toastui-editor-dark .toastui-editor-contents h2 {
+  border-color: #fff;
+}
+
+.toastui-editor-dark .toastui-editor-contents del {
+  color: #777980;
+}
+
+.toastui-editor-dark .toastui-editor-contents blockquote {
+  border-color: #303135;
+}
+
+.toastui-editor-dark .toastui-editor-contents blockquote p,
+.toastui-editor-dark .toastui-editor-contents blockquote ul,
+.toastui-editor-dark .toastui-editor-contents blockquote ol {
+  color: #777980;
+}
+
+.toastui-editor-dark .toastui-editor-contents pre {
+  background-color: #232428;
+}
+
+.toastui-editor-dark .toastui-editor-contents pre code {
+  background-color: transparent;
+  color: #fff;
+}
+
+.toastui-editor-dark .toastui-editor-contents code {
+  color: #c1798b;
+  background-color: #35262a;
+}
+
+.toastui-editor-dark .toastui-editor-contents div {
+  color: #fff;
+}
+
+.toastui-editor-dark .toastui-editor-ww-code-block-language {
+  border-color: #303238;
+  background-color: #121212;
+}
+
+.toastui-editor-dark .toastui-editor-ww-code-block-language input {
+  color: #fff;
+}
+
+.toastui-editor-dark .toastui-editor-contents .toastui-editor-ww-code-block:after {
+  background-color: #232428;
+  border: 1px solid #393b42;
+  color: #eee;
+  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDI1LjIuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IuugiOydtOyWtF8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiCgkgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMzAgMzAiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDMwIDMwOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbGwtcnVsZTpldmVub2RkO2NsaXAtcnVsZTpldmVub2RkO2ZpbGw6I2ZmZjt9Cjwvc3R5bGU+CjxnPgoJPGc+CgkJPGc+CgkJCTxnPgoJCQkJPGc+CgkJCQkJPHBhdGggY2xhc3M9InN0MCIgZD0iTTE1LjUsMTIuNWwyLDJMMTIsMjBoLTJ2LTJMMTUuNSwxMi41eiBNMTgsMTBsMiwybC0xLjUsMS41bC0yLTJMMTgsMTB6Ii8+CgkJCQk8L2c+CgkJCTwvZz4KCQk8L2c+Cgk8L2c+CjwvZz4KPC9zdmc+Cg==');
+}
+
+.toastui-editor-dark .toastui-editor-contents .toastui-editor-custom-block-editor {
+  background: #392d31;
+  color: #fff;
+  border-color: #327491;
+}
+
+.toastui-editor-dark .toastui-editor-custom-block.ProseMirror-selectednode .toastui-editor-custom-block-view {
+  color: #fff;
+  border-color: #327491;
+}
+
+.toastui-editor-dark .toastui-editor-custom-block-view button {
+  background-color: #232428;
+  border-color: #393b42;
+  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDI1LjIuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IuugiOydtOyWtF8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiCgkgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMzAgMzAiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDMwIDMwOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbGwtcnVsZTpldmVub2RkO2NsaXAtcnVsZTpldmVub2RkO2ZpbGw6I2ZmZjt9Cjwvc3R5bGU+CjxnPgoJPGc+CgkJPGc+CgkJCTxnPgoJCQkJPGc+CgkJCQkJPHBhdGggY2xhc3M9InN0MCIgZD0iTTE1LjUsMTIuNWwyLDJMMTIsMjBoLTJ2LTJMMTUuNSwxMi41eiBNMTgsMTBsMiwybC0xLjUsMS41bC0yLTJMMTgsMTB6Ii8+CgkJCQk8L2c+CgkJCTwvZz4KCQk8L2c+Cgk8L2c+CjwvZz4KPC9zdmc+Cg==');
+}
+
+.toastui-editor-dark .toastui-editor-custom-block-view button:hover {
+  background-color: #232428;
+  border-color: #595c68;
+}
+
+.toastui-editor-dark .toastui-editor-custom-block-view .info {
+  color: #65acca;
+}
+
+.toastui-editor-dark .toastui-editor-contents table {
+  border-color: #303238;
+}
+
+.toastui-editor-dark .toastui-editor-contents table th,
+.toastui-editor-dark .toastui-editor-contents table td {
+  border-color: #303238;
+}
+
+.toastui-editor-dark .toastui-editor-contents table th {
+  background-color: #3a3c42;
+}
+
+.toastui-editor-dark .toastui-editor-contents table td,
+.toastui-editor-dark .toastui-editor-contents table td p {
+  color: #fff;
+}
+
+.toastui-editor-dark .toastui-editor-contents td.toastui-editor-cell-selected {
+  background-color: rgba(103, 204, 255, 0.5);
+}
+
+.toastui-editor-dark .toastui-editor-contents th.toastui-editor-cell-selected {
+  background-color: rgba(103, 204, 255, 0.3);
+}
+
+.toastui-editor-dark table.ProseMirror-selectednode {
+  outline-color: #67ccff;
+}
+
+.toastui-editor-dark .html-block.ProseMirror-selectednode {
+  outline-color: #67ccff;
+}
+
+.toastui-editor-dark .toastui-editor-contents ul,
+.toastui-editor-dark .toastui-editor-contents menu,
+.toastui-editor-dark .toastui-editor-contents ol,
+.toastui-editor-dark .toastui-editor-contents dir {
+  color: #55575f;
+}
+
+.toastui-editor-dark .toastui-editor-contents ul > li::before {
+  background-color: #55575f;
+}
+
+.toastui-editor-dark .toastui-editor-contents hr {
+  border-color: #55575f;
+}
+
+.toastui-editor-dark .toastui-editor-contents a {
+  color: #4b96e6;
+}
+
+.toastui-editor-dark .toastui-editor-contents a:hover {
+  color: #1f70de;
+}
+
+.toastui-editor-dark .toastui-editor-contents .image-link:hover::before {
+  border-color: #393b42;
+  background-color: #232428;
+  background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDIwIDIwIj4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIj4KICAgICAgICA8ZyBzdHJva2U9IiNFRUUiIHN0cm9rZS13aWR0aD0iMS41Ij4KICAgICAgICAgICAgPGc+CiAgICAgICAgICAgICAgICA8Zz4KICAgICAgICAgICAgICAgICAgICA8cGF0aCBkPSJNNy42NjUgMTUuMDdsLTEuODE5LS4wMDJjLTEuNDg2IDAtMi42OTItMS4yMjgtMi42OTItMi43NDR2LS4xOTJjMC0xLjUxNSAxLjIwNi0yLjc0NCAyLjY5Mi0yLjc0NGgzLjg0NmMxLjQ4NyAwIDIuNjkyIDEuMjI5IDIuNjkyIDIuNzQ0di4xOTIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMDQ1IC0xNzQzKSB0cmFuc2xhdGUoMTA0MCAxNzM4KSB0cmFuc2xhdGUoNSA1KSBzY2FsZSgxIC0xKSByb3RhdGUoNDUgMzcuMjkzIDApIi8+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTEyLjMyNiA0LjkzNGwxLjgyMi4wMDJjMS40ODcgMCAyLjY5MyAxLjIyOCAyLjY5MyAyLjc0NHYuMTkyYzAgMS41MTUtMS4yMDYgMi43NDQtMi42OTMgMi43NDRoLTMuODQ1Yy0xLjQ4NyAwLTIuNjkyLTEuMjI5LTIuNjkyLTIuNzQ0VjcuNjgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMDQ1IC0xNzQzKSB0cmFuc2xhdGUoMTA0MCAxNzM4KSB0cmFuc2xhdGUoNSA1KSBzY2FsZSgxIC0xKSByb3RhdGUoNDUgMzAuOTk2IDApIi8+CiAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgIDwvZz4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPgo=');
+  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.08);
+}
+
+.toastui-editor-dark .toastui-editor-contents .task-list-item::before {
+  background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxOCIgdmlld0JveD0iMCAwIDE4IDE4Ij4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgc3Ryb2tlPSIjNTU1NzVGIj4KICAgICAgICAgICAgPGc+CiAgICAgICAgICAgICAgICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTAzMCAtMzE2KSB0cmFuc2xhdGUoNzg4IDE5MikgdHJhbnNsYXRlKDI0MiAxMjQpIj4KICAgICAgICAgICAgICAgICAgICA8cmVjdCB3aWR0aD0iMTciIGhlaWdodD0iMTciIHg9Ii41IiB5PSIuNSIgcng9IjIiLz4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+Cg==');
+  background-color: transparent;
+}
+
+.toastui-editor-dark .toastui-editor-contents .task-list-item.checked::before {
+  background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxOCIgdmlld0JveD0iMCAwIDE4IDE4Ij4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgZmlsbD0iIzRCOTZFNiI+CiAgICAgICAgICAgIDxnPgogICAgICAgICAgICAgICAgPGc+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTE2IDBjMS4xMDUgMCAyIC44OTUgMiAydjE0YzAgMS4xMDUtLjg5NSAyLTIgMkgyYy0xLjEwNSAwLTItLjg5NS0yLTJWMkMwIC44OTUuODk1IDAgMiAwaDE0em0tMS43OTMgNS4yOTNjLS4zOS0uMzktMS4wMjQtLjM5LTEuNDE0IDBMNy41IDEwLjU4NSA1LjIwNyA4LjI5M2wtLjA5NC0uMDgzYy0uMzkyLS4zMDUtLjk2LS4yNzgtMS4zMi4wODMtLjM5LjM5LS4zOSAxLjAyNCAwIDEuNDE0bDMgMyAuMDk0LjA4M2MuMzkyLjMwNS45Ni4yNzggMS4zMi0uMDgzbDYtNiAuMDgzLS4wOTRjLjMwNS0uMzkyLjI3OC0uOTYtLjA4My0xLjMyeiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTEwNTAgLTI5NikgdHJhbnNsYXRlKDc4OCAxOTIpIHRyYW5zbGF0ZSgyNjIgMTA0KSIvPgogICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICA8L2c+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4K');
+}
+
+.toastui-editor-dark .toastui-editor-md-delimiter,
+.toastui-editor-dark .toastui-editor-md-code.toastui-editor-md-delimiter,
+.toastui-editor-dark .toastui-editor-md-thematic-break,
+.toastui-editor-dark .toastui-editor-md-link,
+.toastui-editor-dark .toastui-editor-md-table,
+.toastui-editor-dark .toastui-editor-md-block-quote {
+  color: #55575f;
+}
+
+.toastui-editor-dark .toastui-editor-md-meta,
+.toastui-editor-dark .toastui-editor-md-html {
+  color: #55575f;
+}
+
+.toastui-editor-dark .toastui-editor-md-link.toastui-editor-md-link-url.toastui-editor-md-marked-text {
+  color: #777980;
+}
+
+.toastui-editor-dark .toastui-editor-md-block-quote .toastui-editor-md-marked-text,
+.toastui-editor-dark .toastui-editor-md-list-item .toastui-editor-md-meta {
+  color: #b3b5bc;
+}
+
+.toastui-editor-dark .toastui-editor-md-link.toastui-editor-md-link-desc.toastui-editor-md-marked-text,
+.toastui-editor-dark .toastui-editor-md-list-item-style.toastui-editor-md-list-item-odd {
+  color: #4b96e6;
+}
+
+.toastui-editor-dark .toastui-editor-md-list-item-style.toastui-editor-md-list-item-even {
+  color: #ef6767;
+}
+
+.toastui-editor-dark .toastui-editor-md-table .toastui-editor-md-table-cell {
+  color: #fff;
+}
+
+.toastui-editor-dark .toastui-editor-md-code.toastui-editor-md-marked-text {
+  color: #c1798b;
+}
+
+.toastui-editor-dark .toastui-editor-md-code {
+  background-color: #35262a;
+}
+
+.toastui-editor-dark .toastui-editor-md-code-block-line-background {
+  background-color: #232428;
+}
+
+.toastui-editor-dark .toastui-editor-md-code-block .toastui-editor-md-meta {
+  color: #aaa;
+}
+
+.toastui-editor-dark .toastui-editor-md-custom-block {
+  color: #fff;
+}
+
+.toastui-editor-dark .toastui-editor-md-custom-block-line-background {
+  background-color: #392d31;
+}
+
+.toastui-editor-dark .toastui-editor-md-custom-block .toastui-editor-md-delimiter {
+  color: #327491;
+}
+
+.toastui-editor-dark .toastui-editor-md-custom-block .toastui-editor-md-meta {
+  color: #65acca;
+}
+
+.toastui-editor-dark .toastui-editor-contents .toastui-editor-md-preview-highlight::after {
+  background-color: rgba(255, 250, 193, 0.5);
+}
+
+.toastui-editor-dark .toastui-editor-contents th.toastui-editor-md-preview-highlight,
+.toastui-editor-dark .toastui-editor-contents td.toastui-editor-md-preview-highlight {
+  background-color: rgba(255, 250, 193, 0.5);
+}
+
+.toastui-editor-dark .toastui-editor-contents th.toastui-editor-md-preview-highlight {
+  color: #fff;
+}
+
+.toastui-editor-dark .toastui-editor-contents th.toastui-editor-md-preview-highlight,
+.toastui-editor-dark .toastui-editor-contents td.toastui-editor-md-preview-highlight {
+  background-color: rgba(255, 250, 193, 0.25);
+}
+
+.toastui-editor-dark .toastui-editor-contents .toastui-editor-md-preview-highlight::after {
+  background-color: rgba(255, 250, 193, 0.25);
+}

assets/scss/common/input.scss

@@ -50,6 +50,7 @@
   }
 }
 
+
 .v-input__custom {
   .v-input__slot {
 
@@ -149,6 +150,11 @@
 .v-input {
   margin-top: 0 !important;
   padding-top: 0 !important;
+  &.v-text-field--outlined {
+    fieldset {
+      top: -4px
+    }
+  }
 }
 
 .v-input__append-inner {
@@ -449,7 +455,7 @@ input[type="checkbox"] {
       transform: none;
 
       &.mdi:before {
-        font-size: 16px;
+        font-size: 20px;
       }
 
       @if $theme ==dark {

assets/scss/var.scss

@@ -179,6 +179,8 @@ $config: (
     v-sidebar-border: #303030,
     ant-checkbox-bg: #212224,
     ant-checkbox-border: #424242,
+    ant-btn-popup-bg: #212224,
+    ant-btn-popup-color: #FFFFFFD9,
   ),
   light: (w-g5: $--color-gray_555,
     g5-w: $--color-white,
@@ -321,5 +323,7 @@ $config: (
     v-sidebar-border: #F0F0F0,
     ant-checkbox-bg: #FFFFFF,
     ant-checkbox-border: #D9D9D9,
+    ant-btn-popup-bg: #FFFFFF,
+    ant-btn-popup-color: #000000E0,
   ),
 );

components/common/modal/ChangeUserPswdPopPage.vue

@@ -76,7 +76,7 @@
 					<v-spacer></v-spacer>
 					<!-- <v-btn color="primary" dark @click="setUpdate()">확인</v-btn> -->
 					<div class="pr-3">
-						 <a-button @click="close()" class="btn-default">삭제</a-button>
+						 <a-button @click="close()" class="ant-btn-popup-default">닫기</a-button>
 						 <a-button type="primary" @click="setUpdate()" class="v-btn-add-text">
 							 확인
 						 </a-button>

components/common/modal/EnrgUsePlanModiPop.vue

@@ -37,6 +37,7 @@
 								:itemList="selectValueList01"
 								:label="'대상월'"
 								@update:propsValue="selectValue01 = $event"
+								customClass="select-large"
 							/>
 						</v-col>
 						<v-col :cols="5.5" class="mr-2">
@@ -49,9 +50,10 @@
 								:itemList="selectValueList02"
 								:label="'전년대비절감율'"
 								@update:propsValue="selectValue02 = $event"
+								customClass="select-large"
 							/>
 						</v-col>
-						<a-button color="primary" dark @click="search()" icon="clock-circle" >
+						<a-button class="ant-btn-popup-default" color="primary" dark @click="search()" icon="check-circle" size="large">
 							<!-- <template #icon>
 								<ClockCircleOutlined />
 							</template> -->
@@ -128,7 +130,7 @@
 					</div> -->
 				
 				<v-card-actions class="pa-5 d-flex align-center justify-end">
-					<a-button color="primary" type="default" class="mr-2" dark @click="closePop()">취소</a-button>					
+					<a-button color="primary" class="mr-2 ant-btn-popup-default" dark @click="closePop()">취소</a-button>					
 					<a-button color="primary" type="primary" dark @click="setUpdate()">확정</a-button>
 				</v-card-actions>
 			</v-card>

components/common/select/SelectAddGrp.vue

@@ -81,6 +81,10 @@ export default {
 			type: String,
 			require: false,
 		},
+		required: {
+			type: Boolean,
+			default: false
+		},
 	},
 	data() {
 		return {};

components/common/select/SelectReadObj.vue

@@ -21,6 +21,7 @@
 				outlined
 				append-icon=""
 				:class="['v-select__custom', customClass]"
+				:menu-props="{ top: false, offsetY: true }"
 			><template v-slot:append>
 				<v-icon>$icoChevronDown</v-icon>
 				</template></v-select>

pages/comm/auth/RoleMngPage.vue

@@ -1,5 +1,6 @@
 <template>
 	<div class="l-layout">
+		<CommonPageTitle />
 		<v-row ref="searchFilter">
 			<v-col :cols="12">
 				<v-card class="searchFilter">
@@ -205,12 +206,12 @@ export default {
 
 			const _this = this;
 			const myColumns = [
-				{ header: '역할ID', name: 'roleId', align: 'center' },
+				{ header: '역할ID', name: 'roleId', align: 'left' },
 				{ header: '역할명', name: 'roleNm' },
 				{
 					header: '사용여부',
 					name: 'useFg',
-					align: 'center',
+					align: 'left',
 					formatter({ value }) {
 						value = value === true ? '1' : '0';
 						const newValue = _this.pageData.useFgList.filter(

pages/comm/auth/UserRoleMngPage.vue

@@ -1,6 +1,7 @@
 <template>
 	<div class="l-layout">
 		<!-- 조회조견 -->
+		<CommonPageTitle />
 		<v-row ref="searchFilter">
 			<v-col :cols="12">
 				<v-card class="searchFilter">
@@ -922,7 +923,7 @@ const unAsgnRoleByUserColumns = [
 					</label>`;
 		}
 	},	
-	{ header: '역할ID', name: 'roleId', align: 'center' },
+	{ header: '역할ID', name: 'roleId', align: 'left' },
 	{ header: '역할명', name: 'roleNm' },
 	{ header: '적용시작일', name: 'aplyStartDt', hidden: true },
 	{ header: '적용종료일', name: 'aplyEndDt', hidden: true },

pages/comm/base/BatchLogMngPage.vue

@@ -1,6 +1,7 @@
 <template>
 	<div class="l-layout">
 		<!-- 조회조견 -->
+		<CommonPageTitle />
 		<v-row ref="searchFilter">
 			<v-col :cols="12">
 				<v-card class="searchFilter">
@@ -218,14 +219,14 @@ export default {
 
 			const _this = this;
 			const myColumns = [
-				{ header: 'No.', name: 'batchLogSeq', align: 'center', width: 100 },
-				{ header: '배치ID', name: 'batchId', align: 'center', width: 100 },
+				{ header: 'No.', name: 'batchLogSeq', align: 'right', width: 100 },
+				{ header: '배치ID', name: 'batchId', align: 'right', width: 100 },
 				{ header: '배치명', name: 'batchNm', align: 'left', width: 150 },
-				{ header: '실행 일자', name: 'execDt', align: 'center', width: 80 },
+				{ header: '실행 일자', name: 'execDt', align: 'right', width: 80 },
 				{
 					header: '실행 결과',
 					name: 'execRsltCd',
-					align: 'center',
+					align: 'left',
 					width: 80,
 					formatter({ value }) {
 						let retVal = '';
@@ -242,7 +243,7 @@ export default {
 				{
 					header: '배치 시작 일시',
 					name: 'batchStrtDttm',
-					align: 'center',
+					align: 'left',
 					width: 160,
 				},
 				{

pages/comm/base/CalendarMngPage.vue

@@ -250,7 +250,6 @@ export default {
 				{
 					header: '요일',
 					name: 'dtNm',
-					align: 'center',
 					formatter({ value }) {
 						return value + '요일';
 					},
@@ -258,7 +257,6 @@ export default {
 				{
 					header: '구분',
 					name: 'hldyFg',
-					align: 'center',
 					essential: true,
 					formatter({ value }) {
 						return value == 1 ? '휴일' : '평일';

pages/comm/base/NoticeMngPage.vue

@@ -88,7 +88,8 @@
 							</v-text-field>
 						</v-col>
 						<v-col :cols="12" style="min-height: calc(100vh - 450px);">
-							<editor ref="tuiEditor" height="100%" initialEditType="wysiwyg" />
+							<editor ref="tuiEditor" height="100%" initialEditType="wysiwyg"
+							:class="[isDarkMode ? 'toastui-editor-dark' : 'toastui-editor-light']"/>
 						</v-col>
 
 						<v-col :cols="6" class="mt-5">
@@ -134,7 +135,8 @@
 						</v-text-field>
 					</v-col>
 					<v-col :cols="12" style="height: calc(100vh - 270px);" class="mt-2">
-						<editor ref="tuiReplyEditor" height="100%" initialEditType="wysiwyg" />
+						<editor ref="tuiReplyEditor" height="100%" initialEditType="wysiwyg" 
+						:class="[isDarkMode ? 'toastui-editor-dark' : 'toastui-editor-light']"/>
 					</v-col>
 					<v-col :cols="6" class="mt-5">
 						<v-card-title class="custom-title-7 pa-0">파일첨부</v-card-title>
@@ -181,7 +183,8 @@
 						</v-col>
 						<v-col :cols="12" style="height: calc(90vh - 270px);" class="mt-4">
 							<editor ref="tuiUpdateEditor" height="100%" initialEditType="wysiwyg"
-								:initialValue="updateActionData.content" />
+								:initialValue="updateActionData.content"
+								:class="[isDarkMode ? 'toastui-editor-dark' : 'toastui-editor-light']"/>
 						</v-col>
 						<v-col :cols="6" class="mt-5">
 							<v-card-title class="custom-title-7 pa-0">파일첨부</v-card-title>
@@ -1077,7 +1080,7 @@ const defaultData = {
 		color: #1677FF
 	}
 
-	.toastui-editor-mode-switch .tab-item {
+	.toastui-editor-light .toastui-editor-mode-switch .tab-item {
 		color: #000000E0
 	}
 

pages/comm/base/ReadObjectMngPage.vue

@@ -1,5 +1,6 @@
 <template>
 	<div class="l-layout">
+		<CommonPageTitle />
 		<v-row ref="searchFilter">
 			<v-col :cols="12">
 				<v-card class="searchFilter">

pages/ems/base/AddInfoMngPage.vue

@@ -12,7 +12,6 @@
 								dataKey="searchAddGrp"
 								:sendParam="{ useFg: '1' }"
 								:addAll="true"
-								:iconShow="true"
 								customClass="select-large"
 							/>
 						</v-col>
@@ -22,7 +21,6 @@
 								label="추가 정보명"
 								valueNm="addInfoNm"
 								:searchOption="true"
-								:iconShow="true"
 								customClass="input-large"
 							/>
 						</v-col>
@@ -336,8 +334,7 @@ export default {
 			this.search();
 		},
 		async search() {
-			//process
-			this.loadGrid = true;
+			this.loadGrid = false;
 			await this.getRowGridData();
 			await this.setPageData({
 				isFind: false,
@@ -547,7 +544,7 @@ const myDetail = [
 		labelCols: 12,
 		textCols: 12,
 		iconShow: true,
-		class: 'py-2 pr-4',
+		class: 'py-2 pr-4 mt-2',
 		required: true,
 	},
 	{
@@ -559,7 +556,7 @@ const myDetail = [
 		labelCols: 12,
 		textCols: 12,
 		iconShow: true,
-		class: 'py-2 pl-4',
+		class: 'py-2 pl-4 mt-2',
 		list: 'addInfoDataKindList',
 		itemText: 'commCdNm',
 		itemValue: 'commCd',
@@ -574,7 +571,7 @@ const myDetail = [
 		labelCols: 12,
 		textCols: 12,
 		iconShow: true,
-		class: 'py-2 pr-4',
+		class: 'py-2 pr-4 mt-2 d-flex align-items-center',
 		value: { '1': true, '0': false },
 		required: true,
 	},
@@ -587,7 +584,7 @@ const myDetail = [
 		labelCols: 12,
 		textCols: 12,
 		iconShow: true,
-		class: 'py-2 pl-4',
+		class: 'py-2 pl-4 mt-2',
 		placeholder: '시스템 자동입력',
 	},
 	{
@@ -599,7 +596,7 @@ const myDetail = [
 		labelCols: 12,
 		textCols: 12,
 		iconShow: true,
-		class: 'py-2 pr-4',
+		class: 'py-2 pr-4 mt-2',
 		placeholder: '시스템 자동입력',
 	},
 	{
@@ -611,7 +608,7 @@ const myDetail = [
 		labelCols: 12,
 		textCols: 12,
 		iconShow: true,
-		class: 'py-2 pl-4',
+		class: 'py-2 pl-4 mt-2',
 		placeholder: '시스템 자동입력',
 	},
 	{
@@ -623,8 +620,11 @@ const myDetail = [
 		labelCols: 12,
 		textCols: 12,
 		iconShow: true,
-		class: 'py-2 pr-4',
+		class: 'py-2 pr-4 mt-2',
 		placeholder: '시스템 자동입력',
 	},
 ];
 </script>
+<style lang="scss">
+@import '@/assets/scss/common.scss';
+</style>

pages/ems/base/ReadObjectMngPage.vue

@@ -1,5 +1,6 @@
 <template>
 	<div ref="mainDiv" class="l-layout">
+		<CommonPageTitle />
 		<v-row ref="searchFilter">
 			<v-col :cols="12">
 				<v-card class="searchFilter">