/*! * SPDX-License-Identifier: Apache-2.0 * * The OpenSearch Contributors require contributions made to * this file be licensed under the Apache-2.0 license or a * compatible open source license. * * Modifications Copyright OpenSearch Contributors. See * GitHub history for details. */ .ouiSelectableListItem { @include ouiFontSizeS; display: inline-flex; // Necessary to make sure it doesn't force the whole popover to be too wide width: 100%; text-align: left; color: $ouiTextColor; cursor: pointer; &:not(:last-of-type) { border-bottom: $ouiSelectableListItemBorder; } &-isFocused:not([aria-disabled='true']), &:hover:not([aria-disabled='true']) { color: $ouiColorPrimary; background-color: $ouiFocusBackgroundColor; .ouiSelectableListItem__text { text-decoration: underline; } } &[aria-disabled='true'] { color: $ouiColorMediumShade; cursor: not-allowed; } } .ouiSelectableListItem__content { padding: $ouiSelectableListItemPadding; width: 100%; display: flex; align-items: center; } .ouiSelectableListItem__icon, .ouiSelectableListItem__prepend { margin-right: $ouiSizeM; flex-shrink: 0; } .ouiSelectableListItem__append { margin-left: $ouiSizeM; flex-shrink: 0; } .ouiSelectableListItem__text { @include ouiTextTruncate; flex-grow: 1; // Pushes appended content to the far right }