custom-hot-zone.component.scss 3.35 KB

.p-image-children-editor {

  width: 100%;
  height: 100%;
  border-radius: 0.5rem;

  border: 2px solid #ddd;



  .preview-box {

    margin: auto;
    width: 95%;
    height: 35vw;

    border: 2px dashed #ddd;
    border-radius: 0.5rem;
    background-color: #fafafa;
    text-align: center;
    color: #aaa;


    .preview-img {
      height: 100%;
      width: auto;
    }

  }



  .bg-box{
    //width: 100%;
    margin-bottom: 1rem;

  }

  .img-box {
    margin-bottom: 1rem;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .img-box-upload{
    width: 80%;
  }

  .add-btn {
    margin-top: 1rem;
    width: 200px;
    height: 90px;

    display: flex;
    align-items: center;
    justify-content: center;
  }
}


.save-box {
  width: 100%;

  display: flex;
  align-items: center;
  justify-content: center;

  .save-btn {
    width: 160px;
    height: 40px;

    //margin-top: 20px;
    margin-bottom: 20px;

    display: flex;
    align-items: center;
    justify-content: center;
  }
}

h5 {
  margin-top: 1rem;
}



@font-face
{
  font-family: 'BRLNSR_1';
  src: url("/assets/font/BRLNSR_1.TTF") ;
}















//@import '../../../style/common_mixin';
//
//.p-image-uploader {
//  position: relative;
//  display: block;
//  width: 100%;
//  height: 0;
//  padding-bottom: 56.25%;
//  .p-box {
//    position: absolute;
//    left: 0;
//    top: 0;
//    right: 0;
//    bottom: 0;
//    border: 2px dashed #ddd;
//    border-radius: 0.5rem;
//    background-color: #fafafa;
//    text-align: center;
//    color: #aaa;
//    .p-upload-icon {
//      text-align: center;
//      margin: auto;
//      .anticon-upload {
//        color: #888;
//        font-size: 5rem;
//      }
//      .p-progress-bar {
//        position: relative;
//        width: 20rem;
//        height: 1.5rem;
//        border: 1px solid #ccc;
//        border-radius: 1rem;
//        .p-progress-bg {
//          background-color: #1890ff;
//          border-radius: 1rem;
//          height: 100%;
//        }
//        .p-progress-value {
//          position: absolute;
//          top: 0;
//          left: 0;
//          width: 100%;
//          height: 100%;
//          text-shadow: 0 0 4px #000;
//          color: white;
//          text-align: center;
//          font-size: 0.9rem;
//          line-height: 1.5rem;
//        }
//      }
//    }
//    .p-preview {
//      width: 100%;
//      height: 100%;
//      //background-image: url("https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png");
//      @include k-img-bg();
//    }
//  }
//}
//
//.p-btn-delete {
//  position: absolute;
//  right: -0.5rem;
//  top: -0.5rem;
//  width: 2rem;
//  height: 2rem;
//  border: 0.2rem solid white;
//  border-radius: 50%;
//  font-size: 1.2rem;
//  background-color: #fb781a;
//  color: white;
//  text-align: center;
//}
//
//.p-upload-progress-bg {
//  position: absolute;
//  width: 100%;
//  height: 100%;
//  display: flex;
//  align-items: center;
//  justify-content: center;
//  & .i-text {
//    position: absolute;
//    text-align: center;
//    color: white;
//    text-shadow: 0 0 2px rgba(0, 0, 0, .85);
//  }
//  & .i-bg {
//    position: absolute;
//    left: 0;
//    top: 0;
//    height: 100%;
//    background-color: #27b43f;
//    border-radius: 0.5rem;
//  }
//}
//
//
//:host ::ng-deep .ant-upload {
//  display: block;
//}