_sidebar.scss

/*
 * 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.
 *
 * Any modifications Copyright OpenSearch Contributors. See
 * GitHub history for details.
 */

// LAYOUT

.visEditorSidebar {
  min-width: $vis-editor-sidebar-min-width;

  // a hack for IE, issue: https://github.com/elastic/kibana/issues/66586
  > .visEditorSidebar__formWrapper {
    flex-basis: auto;
  }
}

.visEditorSidebar__form {
  @include flex-parent(1, 1, auto);

  max-width: 100%;
}

.visEditorSidebar__config {
  padding: $euiSizeS;

  > * {
    flex-grow: 0;
  }

  @include euiBreakpoint("l", "xl") {
    @include flex-parent(1, 1, 1px);
    @include euiScrollBar;

    overflow: auto;
  }
}

.visEditorSidebar__config-isHidden {
  display: none;
}

// NAVIGATION

.visEditorSidebar__titleContainer {
  padding: $euiSizeS $euiSizeXL $euiSizeS $euiSizeS; // Extra padding on the right for the collapse button
}

.visEditorSidebar__indexPatternPlaceholder {
  min-height: $euiSizeXXL;
  border-bottom: $euiBorderThin;
}

.visEditorSidebar__nav,
.visEditorSidebar__linkedSearch {
  flex-grow: 0;
}

// SECTIONS

.visEditorSidebar__section {
  background-color: $euiColorEmptyShade;
  padding: $euiSizeS;
  border-radius: $euiBorderRadius;

  + .visEditorSidebar__section {
    margin-top: $euiSizeS;
  }
}

// Collapsible section

.visEditorSidebar__collapsible {
  background-color: lightOrDarkTheme($euiPageBackgroundColor, $euiColorLightestShade);
}

.visEditorSidebar__collapsible--marginBottom {
  margin-bottom: $euiSizeM;
}

// FORMS

.visEditorSidebar__formRow {
  display: flex;
  align-items: center;
  margin-top: $euiSizeM;
}

.visEditorSidebar__formLabel {
  display: flex;
  align-items: center;
  flex: 1 1 40%;
  padding-right: $euiSizeXS;
}

.visEditorSidebar__formControl {
  display: flex;
  align-items: center;
  flex: 1 1 60%;
}

.visEditorSidebar__aggGroupAccordionButtonContent {
  font-size: $euiFontSizeS;

  span {
    color: $euiColorDarkShade;
  }
}

.visEditorSidebar__controls {
  border-top: $euiBorderThin;
  padding: $euiSizeS;
  display: flex;
  justify-content: flex-end;
  align-items: center;

  .visEditorSidebar__autoApplyButton {
    margin-left: $euiSizeM;
    min-width: 0;

    .euiButton__content {
      padding: 0 $euiSizeS;
    }

    .euiButton__text {
      display: none;
    }
  }
}