#app{
  .app-main{
    .custom-dialog{
      transition: left 0.28s;
      position: fixed;
      top: 60px;
      right: 10px;
      left: 220px;
      bottom: 10px;
      height: calc(100vh - 70px);
      .el-dialog__body{
        padding-top: 10px;
        padding-bottom: 0;
        min-height: calc(100vh - 125px);
        .el-dialog__footer{
          padding-bottom: 10px;
          text-align: center;
          position: sticky;
          bottom: 0;
          z-index: 99;
          background-color: #fff;
          margin-left: -20px;
          margin-right: -20px;
          border-top: 1px solid #f0f0f0;
          box-shadow: 0 -3px 30px 0 rgba(0,0,0,.15);
          margin-top: 30px;
        }
      }
    }
    .custom-dialog.initial-height{
      max-height: calc(100vh - 70px);
      .el-dialog__body{
        min-height: auto;
      }
    }
    .custom-dialog.adapt-height{
      max-height: calc(100vh - 70px);
      .el-dialog__body{
        min-height: auto;
      }
    }
    .custom-model{
      .v-modal{
        transition: left 0.28s;
        position: fixed;
        top: 50px;
        left: 210px;
      }
    }
  }
  .hasTagsView {
    .app-main{
      .custom-dialog{
        top: 100px;
        height: calc(100vh - 110px);
      }
      .custom-dialog.adapt-height{
        max-height: calc(100vh - 110px);
      }
      .custom-model{
        .v-modal{
          top: 90px;
        }
      }
    }
  }
  .openSidebar{
    .app-main{
      .custom-dialog{
        left: 220px;
      }
      .custom-model{
        .v-modal{
          left: 210px;
        }
      }
    }
  }
  .hideSidebar{
    .app-main{
      .custom-dialog{
        left: 64px;
      }
      .custom-model{
        .v-modal{
          left: 54px;
        }
      }
    }
  }
}
