AllElevations.module.scss

$rmd-theme-dark-elevation: true;

@import '~@react-md/elevation/dist/mixins';
@import '~@react-md/list/dist/mixins';
@import '~@react-md/theme/dist/mixins';
@import '~@react-md/typography/dist/mixins';

.container {
  @include rmd-list-unstyled;

  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.example {
  @include rmd-theme(background-color, background);

  display: inline-flex;
  height: 10rem;
  margin: 1rem;
  position: relative;
  width: 18rem;
}

@for $i from 0 through 24 {
  .elevation#{$i} {
    @include rmd-elevation($i);
    @include rmd-theme-dark-elevation($i);
  }
}

.code {
  margin: auto;
}