fix overlap and functionality of cropper

settings/css/settings.css

@@ -25,6 +25,15 @@ input#openid, input#webdav { width:20em; }
 	width: 33px;
 	height: 33px;
 }
+.jcrop-holder {
+	z-index: 500;
+}
+#avatar #cropper {
+	float: left;
+	background-color: #fff;
+	z-index: 500;
+	position: relative;
+}
 
 #displaynameform,
 #lostpassword,
@@ -40,6 +49,10 @@ input#openid, input#webdav { width:20em; }
 	margin-bottom: 0;
 	padding-bottom: 0;
 }
+#groups {
+	overflow-wrap: break-word;
+	max-width: 75%;
+}
 
 #sslCertificate tr.expired {
 	background-color: rgba(255, 0, 0, 0.5);
@@ -63,6 +76,10 @@ input#identity {
 	width: 17em;
 }
 
+#showWizard {
+	display: inline-block;
+}
+
 .msg.success {
 	color: #fff;
 	background-color: #47a447;

settings/js/personal.js

@@ -98,7 +98,7 @@ function updateAvatar (hidedefault) {
 		$('#header .avatardiv').addClass('avatardiv-shown');
 	}
 	$displaydiv.css({'background-color': ''});
-	$displaydiv.avatar(OC.currentUser, 128, true);
+	$displaydiv.avatar(OC.currentUser, 145, true);
 
 	$('#removeavatar').show();
 }

settings/templates/personal.php

@@ -55,7 +55,7 @@
 
 	<div id="cropper" class="hidden">
 		<div class="inlineblock button" id="abortcropperbutton"><?php p($l->t('Cancel')); ?></div>
-		<div class="inlineblock button primary" id="sendcropperbutton"><?php p($l->t('Choose as profile image')); ?></div>
+		<div class="inlineblock button primary" id="sendcropperbutton"><?php p($l->t('Choose as profile picture')); ?></div>
 	</div>
 </form>
 <?php endif; ?>
@@ -210,7 +210,6 @@ if($_['passwordChangeSupported']) {
 	<?php endif; ?>
 
 	<?php if(OC_APP::isEnabled('firstrunwizard')) {?>
-	<br>
 	<a class="button" href="#" id="showWizard"><?php p($l->t('Show First Run Wizard again'));?></a>
 	<?php }?>
 </div>