diff --git a/components/lib/autocomplete/style/AutoCompleteStyle.js b/components/lib/autocomplete/style/AutoCompleteStyle.js index 0bbf80b03..6874a74a3 100644 --- a/components/lib/autocomplete/style/AutoCompleteStyle.js +++ b/components/lib/autocomplete/style/AutoCompleteStyle.js @@ -85,6 +85,9 @@ const theme = ({ dt }) => ` margin: 0; padding: 0; list-style-type: none; + display: flex; + flex-direction: column; + gap: ${dt('autocomplete.list.gap')}; padding: ${dt('autocomplete.list.padding')}; } @@ -102,14 +105,6 @@ const theme = ({ dt }) => ` border-radius: ${dt('autocomplete.option.border.radius')}; } -.p-autocomplete-option:first-child { - margin-top: 0; -} - -.p-autocomplete-option:last-child { - margin-bottom: 0; -} - .p-autocomplete-option:not(.p-autocomplete-option-selected):not(.p-disabled).p-focus { background: ${dt('autocomplete.option.focus.background')}; color: ${dt('autocomplete.option.focus.color')}; diff --git a/components/lib/themes/aura/autocomplete/index.js b/components/lib/themes/aura/autocomplete/index.js index 66883e42d..2408ff556 100644 --- a/components/lib/themes/aura/autocomplete/index.js +++ b/components/lib/themes/aura/autocomplete/index.js @@ -30,7 +30,8 @@ export default { shadow: '{overlay.select.shadow}' }, list: { - padding: '{list.padding}' + padding: '{list.padding}', + gap: '{list.gap}' }, option: { focusBackground: '{list.option.focus.background}', diff --git a/components/lib/themes/aura/index.js b/components/lib/themes/aura/index.js index 85c2f5597..3135bbde2 100644 --- a/components/lib/themes/aura/index.js +++ b/components/lib/themes/aura/index.js @@ -153,6 +153,7 @@ export default { }, list: { padding: '0.25rem 0.25rem', + gap: '2px', option: { padding: '0.5rem 0.75rem', borderRadius: '4px' diff --git a/components/lib/themes/lara/autocomplete/index.js b/components/lib/themes/lara/autocomplete/index.js index 19d984b4f..f96ec55b1 100644 --- a/components/lib/themes/lara/autocomplete/index.js +++ b/components/lib/themes/lara/autocomplete/index.js @@ -30,7 +30,8 @@ export default { shadow: '{overlay.select.shadow}' }, list: { - padding: '{list.padding}' + padding: '{list.padding}', + gap: '{list.gap}' }, option: { focusBackground: '{list.option.focus.background}', @@ -41,7 +42,7 @@ export default { selectedColor: '{list.option.selected.color}', selectedFocusColor: '{list.option.selected.focus.color}', padding: '{list.option.padding}', - borderRadius: '{list.option.border.radius}' + borderRadius: '{list.option.border.radius}', }, optionGroup: { background: '{list.option.group.background}', diff --git a/components/lib/themes/lara/index.js b/components/lib/themes/lara/index.js index a62a3dd8d..01c3afef3 100644 --- a/components/lib/themes/lara/index.js +++ b/components/lib/themes/lara/index.js @@ -152,6 +152,7 @@ export default { }, list: { padding: '0.5rem 0', + gap: '0', option: { padding: '0.625rem 0.75rem', borderRadius: '0'