/*! * 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. */ .ouiCollapsibleNavGroup { &:not(:first-child) { border-top: $ouiBorderThin; } // This class does not accept a custom classname .ouiAccordion__triggerWrapper { // Add padding to the trigger wrapper in case an `extraAction` is passed // that doesn't get wrapped in the `__heading` padding: $ouiSize; } } .ouiCollapsibleNavGroup--light { background-color: $ouiCollapsibleNavGroupLightBackgroundColor; } .ouiCollapsibleNavGroup--dark { background-color: $ouiCollapsibleNavGroupDarkBackgroundColor; color: $ouiColorGhost; // Forcing better contrast of focus state on OuiAccordion toggle icon .ouiCollapsibleNavGroup__heading:focus .ouiAccordion__iconWrapper { color: $ouiCollapsibleNavGroupDarkHighContrastColor; animation-name: ouiCollapsibleNavGroupDarkFocusRingAnimate !important; // sass-lint:disable-line no-important } .ouiCollapsibleNavGroup__title { color: inherit; line-height: inherit; } } .ouiCollapsibleNavGroup__heading { font-weight: $ouiFontWeightSemiBold; // If the heading is not in an accordion, it needs the padding &:not(.ouiAccordion__button) { padding: $ouiSize; } } .ouiCollapsibleNavGroup__children { padding: $ouiSizeS; } .ouiCollapsibleNavGroup--withHeading .ouiCollapsibleNavGroup__children { padding-top: 0; } @keyframes ouiCollapsibleNavGroupDarkFocusRingAnimate { 0% { box-shadow: 0 0 0 $ouiFocusRingAnimStartSize $ouiFocusRingAnimStartColor; } 100% { box-shadow: 0 0 0 $ouiFocusRingSize $ouiCollapsibleNavGroupDarkHighContrastColor; } }