Merge pull request #915 from WeBankFinTech/docs-dropdown-play

docs: 去掉 lang 为 less 的写法，会导致组件 play 异常
WeBankFinTech · Dec 4, 2024 · 1864e1e · 1864e1e
2 parents 21985aa + 7574f9d
commit 1864e1e
Show file tree

Hide file tree

Showing 4 changed files with 53 additions and 57 deletions.
diff --git a/docs/.vitepress/components/dropdown/check.vue b/docs/.vitepress/components/dropdown/check.vue
@@ -71,10 +71,8 @@ export default {
 };
 </script>
 
-<style lang="less">
-.dropdown-content-wrapper {
-    .fes-dropdown-option-wrapper {
-        max-height: 320px;
-    }
+<style>
+.dropdown-content-wrapper .fes-dropdown-option-wrapper {
+    max-height: 320px;
 }
 </style>
diff --git a/docs/.vitepress/components/inputFile/custom.vue b/docs/.vitepress/components/inputFile/custom.vue
@@ -66,60 +66,59 @@ const handleRemoveFile = (uid) => {
 };
 </script>
 
-<style scoped lang="less">
+<style scoped>
 .file-list {
     width: 100%;
     color: var(--f-sub-head-color);
     font-size: var(--f-font-size-base);
     line-height: 24px;
-    &-item {
-        display: flex;
-        align-items: center;
-        margin-top: 4px;
-        border-radius: var(--f-border-radius-sm);
-        &:first-child {
-            margin-top: 8px;
-        }
-        &:last-child {
-            margin-bottom: 8px;
-        }
-        .file-list-name-wrapper {
-            display: flex;
-            flex: 1;
-            align-items: center;
-            .file-list-name {
-                margin-left: 6px;
-            }
-        }
-        .file-list-icon {
-            display: flex;
-            align-items: center;
-            justify-content: flex-end;
-            width: 40px;
-            color: var(--f-text-color-secondary);
-            &-close {
-                display: none;
-                padding: 2px;
-            }
-        }
-        &:hover {
-            background-color: var(--f-hover-color-light);
-            .file-list-icon {
-                &-close {
-                    display: inline-block;
-                }
-            }
-        }
-    }
+}
+.file-list .file-list-item {
+    display: flex;
+    align-items: center;
+    margin-top: 4px;
+    border-radius: var(--f-border-radius-sm);
+}
+.file-list .file-list-item:first-child {
+    margin-top: 8px;
+}
+.file-list .file-list-item:last-child {
+    margin-bottom: 8px;
+}
+.file-list .file-list-item .file-list-name-wrapper {
+    display: flex;
+    flex: 1;
+    align-items: center;
+}
+.file-list .file-list-item .file-list-name-wrapper .file-list-name {
+    margin-left: 6px;
+}
+
+.file-list .file-list-item .file-list-icon {
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    width: 40px;
+    color: var(--f-text-color-secondary);
+}
+.file-list .file-list-item .file-list-icon .file-list-icon-close {
+    display: none;
+    padding: 2px;
+}
+.file-list .file-list-item:hover {
+    background-color: var(--f-hover-color-light);
+}
+.file-list .file-list-item:hover .file-list-icon .file-list-icon-close {
+    display: inline-block;
 }
 
 :deep(.fes-input-file .fes-input-file-visible-content) {
     display: flex;
     flex-direction: column;
     align-items: flex-start;
-    .fes-input-file-file-list {
-        width: 100%;
-        max-width: 500px;
-    }
+}
+:deep(.fes-input-file .fes-input-file-visible-content .fes-input-file-file-list) {
+    width: 100%;
+    max-width: 500px;
 }
 </style>
diff --git a/docs/.vitepress/components/select/selectGroupOption.vue b/docs/.vitepress/components/select/selectGroupOption.vue
@@ -227,7 +227,7 @@ export default {
 };
 </script>
 
-<style lang="less" scoped>
+<style scoped>
 .label-text {
     color: black;
     opacity: 0.5;

diff --git a/docs/.vitepress/components/timeline/customIcon.vue b/docs/.vitepress/components/timeline/customIcon.vue
@@ -9,7 +9,7 @@
         </template>
         <template #desc="{ index }">
             <RotateLeftOutlined class="btn" @click="handleTrigger(index)" />
-            <DeleteOutlined class="btn" @click="handleDelete(index)" />
+            <DeleteOutlined class="btn" style="margin-left: 5px;" @click="handleDelete(index)" />
         </template>
     </FTimeline>
 </template>
@@ -41,13 +41,12 @@ const handleDelete = (index: number) => {
 };
 </script>
 
-<style scoped lang="less">
+<style scoped>
 .btn {
     cursor: pointer;
-    opacity: 0;
-
-    &:hover {
-        opacity: 1;
-    }
+    opacity: 1;
+}
+.btn:hover {
+    opacity: 0.6;
 }
 </style>