.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; //}