<commit_before>////
/// @group layout
////

@import '~@react-md/app-bar/dist/mixins';
@import '~@react-md/button/dist/mixins';
@import '~@react-md/divider/dist/mixins';
@import '~@react-md/icon/dist/mixins';
@import '~@react-md/list/dist/mixins';
@import '~@react-md/sheet/dist/mixins';
@import '~@react-md/states/dist/variables';
@import '~@react-md/tooltip/dist/mixins';
@import '~@react-md/transition/dist/mixins';
@import '~@react-md/utils/dist/mixins';
@import './variables';
@import './functions';

/// Creates the styles for one of the layout's theme values. This is mostly going
/// to be an internal helper mixin util.
///
/// @param {String} property - The property to set a `rmd-layout-theme-values`
/// value to.
/// @param {String} theme-style [property] - One of the keys of
/// `rmd-layout-theme-values` to extract a value from.
/// @param {Color|String|Number} fallback [null] - A fallback value to use if
/// the css variable isn't set somehow. This will default to automatically
/// retrieving the default value from the `rmd-layout-theme-values` map when
/// `null`.
@mixin rmd-layout-theme($property, $theme-style: $property, $fallback: null) {
  @include rmd-theme-apply-rmd-var(
    $property,
    $theme-style,
    $rmd-layout-theme-values,
    layout
  );
}

/// Updates one of the layout's theme variables with the new value for the section
/// of your app.
///
/// @param {String} theme-style - The layout theme style type to update. This
/// should be one of the `$rmd-layout-theme-values` keys.
/// @param {Color|String|Number} value - The new value to use.
@mixin rmd-layout-theme-update-var($theme-style, $value) {
  @include rmd-theme-update-rmd-var(
    $value,
    $theme-style,
    $rmd-layout-theme-values,
    layout
  );
}

/// Creates all the styles for the layout package.
@mixin react-md-layout {
  // this is used for the title and main elements for animating their margin
  // while the toggleable layout appears. it will use the same transition
  // functions and time as the sheet so it all transitions together
  .rmd-layout-transition {
    &--enter {
      @include rmd-transition(deceleration);

      transition: margin $rmd-layout-enter-duration;
    }

    &--exit {
      @include rmd-transition(acceleration);

      transition: margin $rmd-layout-leave-duration;
    }
  }

  .rmd-layout-navigation {
    z-index: $rmd-layout-navigation-z-index;

    &--floating {
      background-color: transparent;
      box-shadow: none;
    }

    &--header-offset {
      @include rmd-app-bar-offset(top);
    }
  }

  .rmd-layout-nav {
    @include rmd-utils-scroll;

    flex: 1 1 auto;
    height: 100%;
  }

  .rmd-layout-tree {
    height: auto;
    overflow: visible;
  }

  .rmd-layout-title {
    &--offset {
      $margin: calc(
        #{rmd-sheet-theme-var(static-width)} + #{$rmd-app-bar-keyline}
      );

      @include rmd-utils-rtl-auto(margin-left, $margin);
    }<commit_msg>fix(layout): floating layout has correct color in dark theme<commit_after>////
/// @group layout
////

@import '~@react-md/app-bar/dist/mixins';
@import '~@react-md/button/dist/mixins';
@import '~@react-md/divider/dist/mixins';
@import '~@react-md/icon/dist/mixins';
@import '~@react-md/list/dist/mixins';
@import '~@react-md/sheet/dist/mixins';
@import '~@react-md/states/dist/variables';
@import '~@react-md/tooltip/dist/mixins';
@import '~@react-md/transition/dist/mixins';
@import '~@react-md/utils/dist/mixins';
@import './variables';
@import './functions';

/// Creates the styles for one of the layout's theme values. This is mostly going
/// to be an internal helper mixin util.
///
/// @param {String} property - The property to set a `rmd-layout-theme-values`
/// value to.
/// @param {String} theme-style [property] - One of the keys of
/// `rmd-layout-theme-values` to extract a value from.
/// @param {Color|String|Number} fallback [null] - A fallback value to use if
/// the css variable isn't set somehow. This will default to automatically
/// retrieving the default value from the `rmd-layout-theme-values` map when
/// `null`.
@mixin rmd-layout-theme($property, $theme-style: $property, $fallback: null) {
  @include rmd-theme-apply-rmd-var(
    $property,
    $theme-style,
    $rmd-layout-theme-values,
    layout
  );
}

/// Updates one of the layout's theme variables with the new value for the section
/// of your app.
///
/// @param {String} theme-style - The layout theme style type to update. This
/// should be one of the `$rmd-layout-theme-values` keys.
/// @param {Color|String|Number} value - The new value to use.
@mixin rmd-layout-theme-update-var($theme-style, $value) {
  @include rmd-theme-update-rmd-var(
    $value,
    $theme-style,
    $rmd-layout-theme-values,
    layout
  );
}

/// Creates all the styles for the layout package.
@mixin react-md-layout {
  // this is used for the title and main elements for animating their margin
  // while the toggleable layout appears. it will use the same transition
  // functions and time as the sheet so it all transitions together
  .rmd-layout-transition {
    &--enter {
      @include rmd-transition(deceleration);

      transition: margin $rmd-layout-enter-duration;
    }

    &--exit {
      @include rmd-transition(acceleration);

      transition: margin $rmd-layout-leave-duration;
    }
  }

  .rmd-layout-navigation {
    z-index: $rmd-layout-navigation-z-index;

    &--floating {
      background-color: transparent;
      box-shadow: none;

      // need to set it back to transparent so that it renders correctly in
      // dialogs/sheets
      @if $rmd-theme-dark-class !=
        'prefers-color-scheme' and
        $rmd-theme-dark-class
      {
        #{$rmd-theme-dark-class} & {
          background-color: transparent;
        }
      }
    }

    &--header-offset {
      @include rmd-app-bar-offset(top);
    }
  }

  .rmd-layout-nav {
    @include rmd-utils-scroll;

    flex: 1 1 auto;
    height: 100%;
  }

  .rmd-layout-tree {
    height: auto;
    overflow: visible;
  }

  .rmd-layout-title {
    &--offset {
      $margin: calc(
        #{rmd-sheet-theme-var(static-width)} + #{$rmd-app-bar-keyline}
      );

      @include rmd-utils-rtl-auto(margin-left, $margin);
    }
{'fraction_non_alphanumeric': 0.15483456472855767, 'fraction_numerical': 0.0016061676839061998, 'mean_word_length': 2.7900182592818017, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5264595', 'n_tokens_mistral': 2106, 'n_tokens_neox': 2053, 'n_words': 552}