feat: Module variable rectification (opentiny#1065)

Author: xuanlid

packages/common/component/BlockHistoryTemplate.vue

@@ -29,7 +29,7 @@ export default {
 .icon-wrap {
   width: 24px;
   height: 24px;
-  color: var(--ti-lowcode-component-svg-button-color);
+  color: var(--te-common-icon-primary);
   font-size: 16px;
   border-radius: 4px;
   cursor: pointer;
@@ -39,12 +39,12 @@ export default {
   transition: 0.3s;
 
   &:hover {
-    color: var(--ti-lowcode-component-svg-button-hover-color);
-    background-color: var(--ti-lowcode-component-svg-button-hover-bg-color);
+    color: var(--te-common-icon-primary);
+    background-color: var(--te-common-bg-prompt);
   }
   &.active {
-    color: var(--ti-lowcode-component-svg-button-active-color);
-    background-color: var(--ti-lowcode-component-svg-button-active-bg-color);
+    color: var(--te-common-icon-primary);
+    background-color: var(--te-common-bg-prompt);
   }
 }
 </style>

packages/common/component/CloseIcon.vue

@@ -551,6 +551,7 @@ export default {
       .binding-state {
         color: var(--ti-lowcode-meta-config-item-bind-color);
         background: var(--ti-lowcode-meta-config-item-bind-bg);
+        border: 1px solid var(--ti-lowcode-meta-config-item-bind-border);
         padding: 4px 12px;
         overflow: hidden;
         text-overflow: ellipsis;

packages/common/component/ConfigItem.vue

@@ -486,14 +486,6 @@ export default {
         position: static;
         margin-left: 4px;
         z-index: 9;
-        .block-detail-icon {
-          color: var(--ti-lowcode-component-block-list-setting-btn-color);
-          display: block;
-          &:hover {
-            cursor: pointer;
-            color: var(--ti-lowcode-component-block-list-setting-btn-hover-color);
-          }
-        }
       }
       &:hover {
         background-color: var(--te-common-bg-container);
@@ -599,14 +591,6 @@ export default {
       &.is-current-visible-icon {
         visibility: visible;
       }
-
-      .block-detail-icon {
-        color: var(--te-common-icon-secondary);
-        &:hover {
-          cursor: pointer;
-          color: var(--ti-lowcode-component-block-list-setting-btn-hover-color);
-        }
-      }
     }
     .block-setting {
       right: 0px;

packages/common/component/PluginBlockList.vue

@@ -73,7 +73,7 @@ export default {
 .plugin-panel {
   width: 100%;
   height: 100%;
-  background: var(--ti-lowcode-plugin-panel-bg, --ti-lowcode-toolbar-bg);
+  background: var(--te-common-bg-default);
   display: flex;
   flex-direction: column;
   position: relative;

packages/common/component/PluginPanel.vue

@@ -129,7 +129,7 @@ export default {
   width: var(--base-collection-panel-width);
   height: 100%;
   border-right: 1px solid var(--te-common-border-default);
-  background: var(--ti-lowcode-plugin-setting-panel-bg, --ti-lowcode-toolbar-bg);
+  background: var(--te-common-bg-default);
   overflow: hidden;
   border-left: 1px solid var(--ti-lowcode-plugin-panel-header-border-bottom-color);
   &:not(.second-panel) {

packages/common/component/PluginSetting.vue

@@ -60,8 +60,7 @@ export default {
     color: var(--te-common-icon-hover);
   }
   &.active {
-    color: var(--ti-lowcode-component-svg-button-active-color);
-    background-color: var(--ti-lowcode-component-svg-button-active-bg-color);
+    color: var(--te-common-icon-hover);
   }
 
   .svg-icon {
@@ -74,5 +73,9 @@ export default {
     color: var(--te-common-icon-primary);
     background-color: var(--te-common-bg-prompt);
   }
+  &.active {
+    color: var(--te-common-icon-primary);
+    background-color: var(--te-common-bg-prompt);
+  }
 }
 </style>

packages/common/component/SvgButton.vue

@@ -30,7 +30,6 @@ export { default as MetaCodeEditor } from './MetaCodeEditor.vue'
 export { default as VideoGuide } from './VideoGuide.vue'
 export { default as MonacoEditor } from './MonacoEditor.vue'
 export { default as BlockHistoryList } from './BlockHistoryList.vue'
-export { default as BlockHistoryTemplate } from './BlockHistoryTemplate.vue'
 export { default as BlockLinkField } from './BlockLinkField.vue'
 export { default as BlockLinkEvent } from './BlockLinkEvent.vue'
 export { default as BlockDescription } from './BlockDescription.vue'

packages/common/component/index.js

@@ -33,7 +33,7 @@ export default {
 </script>
 <style lang="less" scoped>
 .toolbar-button {
-  background-color: var(--ti-lowcode-toolbar-button-bg) !important;
+  background-color: var(--te-common-bg-prompt) !important;
   border: none !important;
   min-width: 70px;
   height: 26px;

packages/common/component/toolbar-built-in/ToolbarBaseButton.vue

@@ -77,6 +77,7 @@ export default {
     flex-direction: column;
     .tiny-tabs__header .tiny-tabs__nav {
       width: 60%;
+      background-color: var(--te-common-bg-default);
     }
     .tiny-tabs__nav-scroll {
       margin-left: 12px;
@@ -105,6 +106,7 @@ export default {
       }
       &.is-active {
         color: var(--ti-lowcode-setting-panel-tabs-item-title-active-color);
+        border: none;
       }
 
       .tiny-tabs__item__title {