quivr/frontend/app/App.module.scss

@use "styles/ScreenSizes.module.scss";
@use "styles/ZIndexes.module.scss";

.app_container {
  display: flex;
  overflow: auto;
  position: relative;
  align-items: stretch;
  width: 100%;
  height: 100%;

  @media (max-width: ScreenSizes.$small) {
    .menu_container {
      position: absolute;
      left: 0;
      top: 0;
      z-index: ZIndexes.$overlay;
    }
  }

  &.blur {
    filter: opacity(0.1);
    transition: filter 0.2s ease-in-out;
  }

  .content_container {
    overflow: auto;
    flex: 1 1 0%;

    @media (max-width: ScreenSizes.$small) {
      &.blured {
        opacity: 0.2;
      }
    }
  }
}