fix(refactor/styles): fix property panel styles and common styles re…

…view
opentiny · Oct 29, 2024 · da98532 · da98532
1 parent 284392f
commit da98532
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 3 deletions.
diff --git a/packages/common/component/MetaCodeEditor.vue b/packages/common/component/MetaCodeEditor.vue
@@ -7,7 +7,7 @@
       </div>
       <tiny-button v-else class="edit-btn" @click="open">
         <slot name="icon"></slot>
-        <svg-icon name="page-schema" v-if="buttonText === '编辑代码'" class="edit-btn-icon"></svg-icon>
+        <svg-icon name="page-schema" v-if="buttonText === EDIT_CODE_TEXT" class="edit-btn-icon"></svg-icon>
 
         {{ buttonLabel }}
       </tiny-button>
@@ -145,6 +145,8 @@ export default {
     const editorTipsTitle = computed(() => props.tips?.title?.[locale.value] ?? props.tips?.title)
     const editorTipsDemo = computed(() => props.tips?.demo?.[locale.value] ?? props.tips?.demo)
 
+    const EDIT_CODE_TEXT = '编辑代码'
+
     watchEffect(() => {
       const { modelValue, dataType } = props
       const val = dataType ? modelValue?.value || '' : modelValue
@@ -241,6 +243,7 @@ export default {
       editor,
       editorState,
       value,
+      EDIT_CODE_TEXT,
       options: {
         language: props.language,
         minimap: {

diff --git a/packages/configurator/src/slider-configurator/SliderConfigurator.vue b/packages/configurator/src/slider-configurator/SliderConfigurator.vue
@@ -136,7 +136,8 @@ export default {
     background-color: transparent;
     position: relative;
     outline: 0;
-    -webkit-appearance: none !important;
+    -webkit-appearance: none;
+    -moz-appearance: none;
     appearance: none;
   }
   input[type='range']::-webkit-slider-thumb {
@@ -151,7 +152,9 @@ export default {
     cursor: pointer;
     background-clip: padding-box;
     box-sizing: border-box;
-    -webkit-appearance: none !important;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    appearance: none;
   }
   input[type='range']::-webkit-slider-thumb:active {
     border: 0;

diff --git a/packages/theme/base/src/common.less b/packages/theme/base/src/common.less
@@ -97,4 +97,8 @@
   --te-common-bg-default: var(--te-base-dark-27); // 深色背景-输入框背景/面板背景色 #212329
   --te-common-bg-disabled: var(--te-base-dark-29); // 禁用/标签/下拉框多选标签 背景色 #2a2c31
   --te-common-bg-switch: var(--te-base-gray-67); // 开关默认色 #4D4E52
+
+  // 通用间距
+  --te-common-vertical-item-spacing-normal: 12px; // 表单元素之间的距离，标题和列表之间的距离、一个独立元素的padding等等
+  --te-common-vertical-form-label-spacing: 8px; // 上下布局时，表单label与表单元素的间隔
 }