diff --git a/docs/resources/changelog.md b/docs/resources/changelog.md index 0fde7b58b..e27a8fd2f 100644 --- a/docs/resources/changelog.md +++ b/docs/resources/changelog.md @@ -17,6 +17,7 @@ _During the beta period, these restrictions may be relaxed in the event of a mis - Added the ability to cancel `sl-show` and `sl-hide` events in `` [#993](https://github.com/shoelace-style/shoelace/issues/993) - Fixed a bug in `` that prevented the border radius to apply correctly to the header [#934](https://github.com/shoelace-style/shoelace/pull/934) - Fixed a bug in `` where the inner border disappeared on focus [#980](https://github.com/shoelace-style/shoelace/pull/980) +- Fixed a bug that caused prefix/suffix animations in `` to wobble [#996](https://github.com/shoelace-style/shoelace/issues/996) - Improved `` to improve padding and render relative to the current font size - Updated Lit to 2.4.1 - Updated TypeScript to 4.8.4 diff --git a/src/components/input/input.styles.ts b/src/components/input/input.styles.ts index c30637566..cec9a9cd0 100644 --- a/src/components/input/input.styles.ts +++ b/src/components/input/input.styles.ts @@ -173,11 +173,11 @@ export default css` } .input--small .input__prefix ::slotted(*) { - padding-inline-start: var(--sl-input-spacing-small); + margin-inline-start: var(--sl-input-spacing-small); } .input--small .input__suffix ::slotted(*) { - padding-inline-end: var(--sl-input-spacing-small); + margin-inline-end: var(--sl-input-spacing-small); } .input--medium { @@ -197,11 +197,11 @@ export default css` } .input--medium .input__prefix ::slotted(*) { - padding-inline-start: var(--sl-input-spacing-medium); + margin-inline-start: var(--sl-input-spacing-medium); } .input--medium .input__suffix ::slotted(*) { - padding-inline-end: var(--sl-input-spacing-medium); + margin-inline-end: var(--sl-input-spacing-medium); } .input--large { @@ -221,11 +221,11 @@ export default css` } .input--large .input__prefix ::slotted(*) { - padding-inline-start: var(--sl-input-spacing-large); + margin-inline-start: var(--sl-input-spacing-large); } .input--large .input__suffix ::slotted(*) { - padding-inline-end: var(--sl-input-spacing-large); + margin-inline-end: var(--sl-input-spacing-large); } /*