slightly improve cropper style
This commit is contained in:
parent
9e2424ee76
commit
571a9642a5
@ -9,4 +9,12 @@
|
||||
|
||||
#profile-photo-submit-wrapper {
|
||||
clear: both;
|
||||
}
|
||||
}
|
||||
|
||||
#profile-photo-wrapper {
|
||||
height: 300px;
|
||||
width: 300px;
|
||||
max-width: 300px;
|
||||
max-height: 300px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
@ -381,14 +381,9 @@ footer {
|
||||
margin: 15px 0px;
|
||||
}
|
||||
|
||||
#cropimage-wrapper, #cropimage-preview-wrapper {
|
||||
float: left;
|
||||
padding: 30px;
|
||||
}
|
||||
|
||||
#crop-image-form {
|
||||
margin-top: 30px;
|
||||
clear: both;
|
||||
#cropimage-wrapper,
|
||||
#cropimage-preview-wrapper {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.fn {
|
||||
|
@ -6,7 +6,7 @@
|
||||
<img src="{{$image_url}}" id="croppa" class="imgCrop" alt="{{$title}}" />
|
||||
</div>
|
||||
<div id="cropimage-preview-wrapper" >
|
||||
<div id="previewWrap" class="crop-preview" style="height: 300px; width: 300px; max-width: 300px; max-height: 300px; overflow: hidden;"></div>
|
||||
<div id="previewWrap" class="crop-preview d-lg-none" style="height: 300px; width: 300px; max-width: 300px; max-height: 300px; overflow: hidden;"></div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" language="javascript">
|
||||
@ -16,7 +16,7 @@ var image = document.getElementById('croppa');
|
||||
var cropper = new Cropper(image, {
|
||||
aspectRatio: 1 / 1,
|
||||
viewMode: 1,
|
||||
preview: '.crop-preview',
|
||||
preview: '#profile-photo-wrapper, .crop-preview',
|
||||
crop: function(e) {
|
||||
$( '#x1' ).val(e.detail.x);
|
||||
$( '#y1' ).val(e.detail.y);
|
||||
|
Reference in New Issue
Block a user