body {
  #app.isDevelopment {
    &::before {
      position: fixed;
      right: 12px;
      bottom: 12px;
      z-index: 999999;
      padding: 0.5rem 1rem;
      font-weight: 600;
      color: $color-primary;
      content: "xs";
      background: #FFF;
      border-radius: 30px;
      box-shadow: 0 5px 10px #1C2C5414;
    }

    @include max-2xl {
      &::before {
        content: 'xxl';
      }
    }

    @include max-xl {
      &::before {
        content: 'xl';
      }
    }

    @include max-lg {
      &::before {
        content: 'lg';
      }
    }

    @include max-md {
      &::before {
        content: 'md';
      }
    }

    @include max-sm {
      &::before {
        content: 'sm';
      }
    }

    @include max-2sm {
      &::before {
        content: 'ssm';
      }
    }
  }
}