docs(form): [form] demo fix to adapter x-design (#2113)

opentiny · Sep 18, 2024 · a9015aa · a9015aa
1 parent d55c7fe
commit a9015aa
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 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
@@ -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
@@ -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
@@ -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>