SanshuiLiu
/
tiny-vue
forked from opentiny/tiny-vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(input): [input] fix textarea x-design style (#2076) 

* fix(input): [input] fix textarea x-design style

* fix(input): fix slot e2e error

* fix(input): [input] fix textarea x-design style
This commit is contained in:
ajaxzheng 2024-09-09 10:32:55 +08:00 committed by GitHub
parent 214e3f812b
commit 3a16059192
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 45 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
examples/sites/demos/pc/app/input/resize-composition-api.vue
View File

@ -44,7 +44,7 @@ const hoverText = ref('')
<style scoped>
.demo-input .tiny-textarea {
width: 400px;
width: fit-content;
margin: 5px;
}

4
examples/sites/demos/pc/app/input/resize.spec.ts
View File

@ -30,7 +30,7 @@ test('可缩放文本域', async ({ page }) => {
.boundingBox()
.then((box) => box?.height)
await expect(fill1Height).not.toEqual(defaultHeight)
await expect(fill1Height).toEqual(defaultHeight)
await expect(fill1Height).toEqual(fill2Height)
// autosize 检查高度
@ -41,7 +41,7 @@ test('可缩放文本域', async ({ page }) => {
.then((box) => box?.height)
await textarea2.nth(1).fill(fillText + fillText)
fill1Height = await textarea2
.nth(0)
.nth(1)
.boundingBox()
.then((box) => box?.height)
await expect(fill1Height).not.toBeNull()

2
examples/sites/demos/pc/app/input/resize.vue
View File

@ -63,7 +63,7 @@ export default {
<style lang="less" scoped>
.demo-input {
.tiny-textarea {
width: 400px;
width: fit-content;
margin: 5px;
}
.expand {

10
examples/sites/demos/pc/app/input/slot.spec.ts
View File

@ -4,15 +4,17 @@ test('[Input]slot', async ({ page }) => {
page.on('pageerror', (exception) => expect(exception).toBeNull())
await page.goto('input#slot')
const prefix = page.locator('.tiny-input__prefix')
const demo = page.locator('#slot')
const prefix = demo.locator('.tiny-input__prefix')
await expect(prefix).toBeVisible()
const append = page.locator('.tiny-input-group__append')
const append = demo.locator('.tiny-input-group__append')
await expect(append).toBeVisible()
const prepend = page.locator('.tiny-input-group__prepend')
const prepend = demo.locator('.tiny-input-group__prepend')
await expect(prepend).toBeVisible()
const suffix = page.locator('.tiny-input__suffix-inner')
const suffix = demo.locator('.tiny-input__suffix-inner')
await expect(suffix).toBeVisible()
})

35
packages/theme/src/textarea/index.less
View File

@ -28,6 +28,30 @@
vertical-align: bottom;
font-size: var(--ti-textarea-font-size);
&:before {
content: '';
width: calc(100% - 16px);
height: 8px;
position: absolute;
left: 2px;
top: 1px;
z-index: 1;
background: #fff;
border-radius: var(--ti-textarea-border-radius);
}
&:after {
content: '';
width: calc(100% - 19px);
height: 16px;
position: absolute;
left: 2px;
bottom: 1px;
z-index: 1;
background: #fff;
border-radius: var(--ti-textarea-border-radius);
}
&.is-disabled &__inner {
background-color: var(--ti-textarea-disabled-bg-color);
border-color: var(--ti-textarea-border-color);
@ -64,12 +88,13 @@
font-size: var(--ti-textarea-count-font-size);
text-align: right;
position: absolute;
z-index: 2;
line-height: 1.5;
bottom: var(--ti-textarea-count-bottom);
right: var(--ti-textarea-count-right);
width: var(--ti-textarea-count-width);
border-bottom-left-radius: var(--ti-textarea-count-border-radius);
padding-right: var(--ti-textarea-count-padding-right);
line-height: var(--ti-textarea-count-line-height);
&-text-length {
color: var(--ti-textarea-count-text-length-color);
@ -167,6 +192,14 @@
line-height: 1.5;
}
&:before {
display: none;
}
&:after {
display: none;
}
.@{textarea-prefix-cls}__inner-con {
height: auto;