fix
This commit is contained in:
@@ -17,7 +17,6 @@
|
||||
<div>{{ $t('Cropper.Cutpicture') }}</div>
|
||||
</div>
|
||||
<div class="header_right_block" @click.stop="">
|
||||
<div class="next_step_button" @click.stop="finishCropper()">{{ $t('Cropper.Finish') }}</div>
|
||||
<div class="header_cancel_button" @click.stop="cancleCropper()">{{ $t('Cropper.Cancel') }}</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -54,7 +53,7 @@
|
||||
<div class="review_logo icon iconfont icon-yulan"></div>
|
||||
<div>{{ $t('Cropper.CropPreview') }}</div>
|
||||
</div>
|
||||
<div class="cut_picture_review_block">
|
||||
<div class="cut_picture_review_block" :style="{'width': previews.w + 'px', 'height': previews.h + 'px'}">
|
||||
<div class="cut_picture_review_item">
|
||||
<div class="cut_picture_review_content" :class="{active:isRound}" :style="{'width': previews.w + 'px', 'height': previews.h + 'px', 'overflow': 'hidden'}">
|
||||
<div :style="previews.div">
|
||||
@@ -62,6 +61,10 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="next_step_button" @click.stop="finishCropper()">
|
||||
<!-- <i class="fi fi-rr-check"></i> -->
|
||||
<i class="fi fi-sr-check-circle"></i>
|
||||
</div>
|
||||
<!-- <div class="cut_picture_review_item">
|
||||
<div class="cut_picture_review_block_sec" :style="{'width': previews.w + 'px', 'height': previews.h + 'px', 'overflow': 'hidden'}">
|
||||
<div :style="previews.div" >
|
||||
@@ -206,11 +209,10 @@ export default defineComponent({
|
||||
padding: 0 calc(1.2rem*1.2);
|
||||
height: calc(3.2rem*1.2);
|
||||
// background: linear-gradient(160deg, #AC2A3B, #292161);
|
||||
background: linear-gradient(-137deg, #eeefdb, #e7dbed);
|
||||
|
||||
background: #000;
|
||||
color: #fff;
|
||||
border-radius: calc(1.6rem*1.2);
|
||||
font-size: calc(1.4rem*1.2);
|
||||
color: #000;
|
||||
line-height: calc(3.2rem*1.2);
|
||||
margin-right: calc(1.6rem*1.2);
|
||||
white-space: nowrap;
|
||||
@@ -237,10 +239,16 @@ export default defineComponent({
|
||||
// background: #F2F3FB;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.cut_picture_right,.cut_picture_left{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 80%;
|
||||
}
|
||||
|
||||
.cut_picture_left{
|
||||
width: calc(70.7rem*1.2);
|
||||
height: 100%;
|
||||
// height: 100%;
|
||||
background: #fff;
|
||||
border-radius: calc(2rem*1.2);
|
||||
padding: calc(1.3rem*1.2) calc(1.3rem*1.2) calc(2rem*1.2);
|
||||
@@ -301,12 +309,12 @@ export default defineComponent({
|
||||
.cut_picture_right{
|
||||
// width: 39.2rem;
|
||||
width: calc(52rem*1.2);
|
||||
height: 100%;
|
||||
background: #fff;
|
||||
border-radius: calc(2rem*1.2);
|
||||
|
||||
margin-block: -5rem;
|
||||
.cur_picture_right_header{
|
||||
padding: calc(2rem*1.2);
|
||||
// padding: calc(2rem*1.2);
|
||||
padding: 2rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: var(--aida-fsize1-8);
|
||||
@@ -324,9 +332,25 @@ export default defineComponent({
|
||||
|
||||
.cut_picture_review_block{
|
||||
width: 100%;
|
||||
padding: 0 calc(2rem*1.2);
|
||||
height: calc(100% - 6.8rem*1.2);
|
||||
|
||||
margin: 0 auto;
|
||||
.next_step_button{
|
||||
margin-top: 2rem;
|
||||
i{
|
||||
display: flex;
|
||||
// height: 4rem;
|
||||
// width: 4rem;
|
||||
// background: #000;
|
||||
// color: #fff;
|
||||
font-weight: 900;
|
||||
border-radius: 50%;
|
||||
font-size: 4rem;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 auto;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.cut_picture_review_item{
|
||||
width: 100%;
|
||||
// height: 50%;
|
||||
@@ -338,7 +362,7 @@ export default defineComponent({
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: scale(0.8) translate(-50%, -50%);
|
||||
transform: scale(1) translate(-50%, -50%);
|
||||
background: rgba(91,94,105,0.8);
|
||||
box-shadow: 0 calc(0.2rem*1.2) calc(0.5rem*1.2) 0 rgba(216,213,239,0.3);
|
||||
border-radius: calc(1rem*1.2);
|
||||
|
||||
Reference in New Issue
Block a user