From a67a823a65bc89532cf4057c7695a21394ce8a70 Mon Sep 17 00:00:00 2001
From: Gimmy <975402925@qq.com>
Date: Thu, 12 Sep 2024 21:16:01 +0800
Subject: [PATCH] docs(form): [form] demo fix to adapter x-design

---
 .../pc/app/form/error-slot-composition-api.vue      |  1 -
 examples/sites/demos/pc/app/form/error-slot.vue     |  1 -
 .../pc/app/form/slot-label-composition-api.vue      | 13 ++++++++++++-
 3 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/examples/sites/demos/pc/app/form/error-slot-composition-api.vue b/examples/sites/demos/pc/app/form/error-slot-composition-api.vue
index 428a2be88e..e60b0f3be1 100644
--- a/examples/sites/demos/pc/app/form/error-slot-composition-api.vue
+++ b/examples/sites/demos/pc/app/form/error-slot-composition-api.vue
@@ -69,7 +69,6 @@ function validateField() {
 
 <style lang="less">
 .custom-error {
-  padding: 4px 0;
   display: flex;
   .tiny-svg {
     fill: var(--ti-tooltip-validate-icon-color);
diff --git a/examples/sites/demos/pc/app/form/error-slot.vue b/examples/sites/demos/pc/app/form/error-slot.vue
index f493253df9..6655dd47e9 100644
--- a/examples/sites/demos/pc/app/form/error-slot.vue
+++ b/examples/sites/demos/pc/app/form/error-slot.vue
@@ -81,7 +81,6 @@ export default {
 
 <style lang="less">
 .custom-error {
-  padding: 4px 0;
   display: flex;
   .tiny-svg {
     fill: var(--ti-tooltip-validate-icon-color);
diff --git a/examples/sites/demos/pc/app/form/slot-label-composition-api.vue b/examples/sites/demos/pc/app/form/slot-label-composition-api.vue
index 4fd2aeb021..ce282c0d9d 100644
--- a/examples/sites/demos/pc/app/form/slot-label-composition-api.vue
+++ b/examples/sites/demos/pc/app/form/slot-label-composition-api.vue
@@ -10,7 +10,9 @@
         <tiny-date-picker v-model="createData.datepicker"></tiny-date-picker>
       </tiny-form-item>
       <tiny-form-item prop="url">
-        <template #label> URL </template>
+        <template #label>
+          <div class="custom-label">超过两行文字，省略显示</div>
+        </template>
         <tiny-input v-model="createData.url"></tiny-input>
       </tiny-form-item>
       <tiny-form-item prop="radio">
@@ -79,4 +81,13 @@ function handleSubmit() {
 .demo-form {
   width: 380px;
 }
+.custom-label {
+  display: -webkit-box;
+  width: 100%;
+  -webkit-line-clamp: 2;
+  line-height: 1.2;
+  overflow: hidden;
+  -webkit-box-orient: vertical;
+  white-space: wrap;
+}
 </style>