#12 - instance first page added, variable creation added

minjk-bl · minjk-bl · commit 73a8795bb54f · 2021-05-14T17:16:18.000+09:00
diff --git a/css/common/instanceEditor.css b/css/common/instanceEditor.css
@@ -18,6 +18,12 @@
 #vp-wrapper .vp-ins-select-container input.vp-ins-search {
     width: 100%;
 }
+#vp-wrapper .vp-ins-select-container .vp-ins-search-icon {
+    position: absolute;
+    color: #C4C4C4;
+    right: 7px;
+    top: 7px;
+}
 .vp-ins-select-box {
     margin-top: 5px;
     border: 0.25px solid #C4C4C4;
@@ -47,9 +53,14 @@
     background: #b0b0b0;
 }
 .vp-ins-select-item {
-    margin-top: 3px;
-    margin-bottom: 3px;
+    padding-top: 3px;
+    padding-bottom: 3px;
     cursor: pointer;
+    border-bottom: 0.25px solid var(--light-gray-color);
+}
+.vp-ins-select-item.selected {
+    color : var(--hightlight-color);
+    background: var(--light-gray-color);
 }
 .vp-ins-select-item span {
     background: #e0e0e0;
@@ -58,10 +69,10 @@
     margin-right: 5px;
 }
 .vp-ins-select-item:hover {
-    color: #F37704;
+    background: var(--light-gray-color);
 }
 .vp-ins-select-item:hover span {
-    background: #F37704;
+    background: var(--hightlight-color);
     color: #FFFFFF;
 }
 .vp-ins-option-box.api {
@@ -73,4 +84,19 @@
 }
 .vp-ins-parameter {
     width: 100% !important;
+}
+
+.vp-create-var-box {
+    position: relative;
+    margin-top: 5px;
+}
+#vp-wrapper .vp-ins-select-container .vp-create-var {
+    width: 100%;
+}
+#vp-wrapper .vp-ins-select-container .vp-create-var-btn {
+    position: absolute;
+    color: #C4C4C4;
+    right: 5px;
+    top: 5px;
+    cursor: pointer;
 }
diff --git a/css/file_io/instance.css b/css/file_io/instance.css
@@ -49,7 +49,7 @@
 /* udf editor - CodeMirror */
 #vp-wrapper .vp-option-page .vp-instance-box .CodeMirror { 
     display: inline-block;
-    width: calc(100% - 60px);
+    width: calc(100% - 55px);
     height: 30px;
     border: 1px solid silver;
     overflow: hidden;
diff --git a/src/common/vpInstanceEditor.js b/src/common/vpInstanceEditor.js
