js/shoelace
1
0
Fork 0
mirror of https://github.com/shoelace-style/shoelace.git synced 2026-01-12 11:09:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix sl-select padding issue with multiple and placeholder options combined (#2292)

Browse Source 
* fix missing padding on sl-select placeholder with multiple option and medium or large size

* fix icon prefix padding issue on sl-select - do not apply margin to the select prefix when placeholder is present
This commit is contained in:
Evan Harrison
2024-12-02 13:33:06 -05:00
committed by GitHub
parent a764672d03
commit addac51b5f
1 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/select/select.styles.ts
View File

@@ -176,7 +176,7 @@ export default css`
margin-inline-end: var(--sl-input-spacing-small);
}
.select--small.select--multiple .select__prefix::slotted(*) {
.select--small.select--multiple:not(.select--placeholder-visible) .select__prefix::slotted(*) {
margin-inline-start: var(--sl-input-spacing-small);
}
@@ -205,11 +205,11 @@ export default css`
margin-inline-end: var(--sl-input-spacing-medium);
}
.select--medium.select--multiple .select__prefix::slotted(*) {
.select--medium.select--multiple:not(.select--placeholder-visible) .select__prefix::slotted(*) {
margin-inline-start: var(--sl-input-spacing-medium);
}
.select--medium.select--multiple .select__combobox {
.select--medium.select--multiple:not(.select--placeholder-visible) .select__combobox {
padding-inline-start: 0;
padding-block: 3px;
}
@@ -234,11 +234,11 @@ export default css`
margin-inline-end: var(--sl-input-spacing-large);
}
.select--large.select--multiple .select__prefix::slotted(*) {
.select--large.select--multiple:not(.select--placeholder-visible) .select__prefix::slotted(*) {
margin-inline-start: var(--sl-input-spacing-large);
}
.select--large.select--multiple .select__combobox {
.select--large.select--multiple:not(.select--placeholder-visible) .select__combobox {
padding-inline-start: 0;
padding-block: 4px;
}