mirror of
https://github.com/nextcloud/server.git
synced 2024-08-30 17:57:26 +02:00
Merge pull request #20994 from owncloud/personal-page
improve layout of personal settings page
This commit is contained in:
commit
d3922510d0
@ -707,9 +707,9 @@ code { font-family:"Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono
|
||||
|
||||
#quota {
|
||||
cursor: default;
|
||||
margin: 30px;
|
||||
margin: 30px !important;
|
||||
position: relative;
|
||||
padding: 0;
|
||||
padding: 0 !important;
|
||||
}
|
||||
#quota div {
|
||||
padding: 0;
|
||||
|
@ -6,6 +6,54 @@ select#languageinput, select#timezone { width:15em; }
|
||||
input#openid, input#webdav { width:20em; }
|
||||
|
||||
/* PERSONAL */
|
||||
|
||||
#avatar {
|
||||
display: inline-block;
|
||||
float: left;
|
||||
width: 160px;
|
||||
padding-right: 0;
|
||||
}
|
||||
#avatar .avatardiv {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
#avatar .warning {
|
||||
width: 350px;
|
||||
}
|
||||
#uploadavatarbutton,
|
||||
#selectavatar,
|
||||
#removeavatar {
|
||||
width: 33px;
|
||||
height: 33px;
|
||||
}
|
||||
.jcrop-holder {
|
||||
z-index: 500;
|
||||
}
|
||||
#avatar #cropper {
|
||||
float: left;
|
||||
background-color: #fff;
|
||||
z-index: 500;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#displaynameform,
|
||||
#lostpassword,
|
||||
#groups {
|
||||
display: inline-block;
|
||||
margin-bottom: 0;
|
||||
padding-bottom: 0;
|
||||
padding-right: 0;
|
||||
min-width: 60%;
|
||||
}
|
||||
#avatar,
|
||||
#passwordform {
|
||||
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);
|
||||
}
|
||||
@ -13,22 +61,6 @@ input#openid, input#webdav { width:20em; }
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
/* Sync clients */
|
||||
.clientsbox {
|
||||
padding-top: 30px;
|
||||
margin-top: -30px;
|
||||
}
|
||||
.clientsbox h2 {
|
||||
font-weight: 300;
|
||||
font-size: 20px;
|
||||
margin: 35px 0 10px;
|
||||
}
|
||||
.clientsbox .center {
|
||||
margin-top: 10px;
|
||||
}
|
||||
.clientsbox a {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
#displaynameerror {
|
||||
display: none;
|
||||
@ -44,8 +76,8 @@ input#identity {
|
||||
width: 17em;
|
||||
}
|
||||
|
||||
#avatar .warning {
|
||||
width: 350px;
|
||||
#showWizard {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.msg.success {
|
||||
|
@ -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();
|
||||
}
|
||||
@ -408,7 +408,7 @@ $(document).ready(function () {
|
||||
|
||||
// Load the big avatar
|
||||
if (oc_config.enable_avatars) {
|
||||
$('#avatar .avatardiv').avatar(OC.currentUser, 128);
|
||||
$('#avatar .avatardiv').avatar(OC.currentUser, 145);
|
||||
}
|
||||
});
|
||||
|
||||
|
@ -163,9 +163,8 @@ $tmpl->assign('groups', $groups2);
|
||||
// add hardcoded forms from the template
|
||||
$l = \OC::$server->getL10N('settings');
|
||||
$formsAndMore = [];
|
||||
$formsAndMore[]= ['anchor' => 'avatar', 'section-name' => $l->t('Personal info')];
|
||||
$formsAndMore[]= ['anchor' => 'clientsbox', 'section-name' => $l->t('Sync clients')];
|
||||
$formsAndMore[]= ['anchor' => 'passwordform', 'section-name' => $l->t('Personal info')];
|
||||
$formsAndMore[]= ['anchor' => 'groups', 'section-name' => $l->t('Groups')];
|
||||
|
||||
$forms=OC_App::getForms('personal');
|
||||
|
||||
|
@ -22,36 +22,6 @@
|
||||
|
||||
<div id="app-content">
|
||||
|
||||
<div id="clientsbox" class="clientsbox center">
|
||||
<h2><?php p($l->t('Get the apps to sync your files'));?></h2>
|
||||
<a href="<?php p($_['clients']['desktop']); ?>" target="_blank">
|
||||
<img src="<?php print_unescaped(OCP\Util::imagePath('core', 'desktopapp.png')); ?>"
|
||||
alt="<?php p($l->t('Desktop client'));?>" />
|
||||
</a>
|
||||
<a href="<?php p($_['clients']['android']); ?>" target="_blank">
|
||||
<img src="<?php print_unescaped(OCP\Util::imagePath('core', 'googleplay.png')); ?>"
|
||||
alt="<?php p($l->t('Android app'));?>" />
|
||||
</a>
|
||||
<a href="<?php p($_['clients']['ios']); ?>" target="_blank">
|
||||
<img src="<?php print_unescaped(OCP\Util::imagePath('core', 'appstore.png')); ?>"
|
||||
alt="<?php p($l->t('iOS app'));?>" />
|
||||
</a>
|
||||
|
||||
<?php if (OC_Util::getEditionString() === ''): ?>
|
||||
<p class="center">
|
||||
<?php print_unescaped($l->t('If you want to support the project
|
||||
<a href="https://owncloud.org/contribute"
|
||||
target="_blank" rel="noreferrer">join development</a>
|
||||
or
|
||||
<a href="https://owncloud.org/promote"
|
||||
target="_blank" rel="noreferrer">spread the word</a>!'));?>
|
||||
</p>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if(OC_APP::isEnabled('firstrunwizard')) {?>
|
||||
<p class="center"><a class="button" href="#" id="showWizard"><?php p($l->t('Show First Run Wizard again'));?></a></p>
|
||||
<?php }?>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="quota" class="section">
|
||||
@ -65,6 +35,95 @@
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<?php if ($_['enableAvatars']): ?>
|
||||
<form id="avatar" class="section" method="post" action="<?php p(\OC::$server->getURLGenerator()->linkToRoute('core.avatar.postAvatar')); ?>">
|
||||
<h2><?php p($l->t('Profile picture')); ?></h2>
|
||||
<div id="displayavatar">
|
||||
<div class="avatardiv"></div>
|
||||
<div class="warning hidden"></div>
|
||||
<?php if ($_['avatarChangeSupported']): ?>
|
||||
<label for="uploadavatar" class="inlineblock button icon-upload svg" id="uploadavatarbutton" title="<?php p($l->t('Upload new')); ?>"></label>
|
||||
<div class="inlineblock button icon-folder svg" id="selectavatar" title="<?php p($l->t('Select from Files')); ?>"></div>
|
||||
<div class="inlineblock button icon-delete svg" id="removeavatar" title="<?php p($l->t('Remove image')); ?>"></div>
|
||||
<input type="file" name="files[]" id="uploadavatar" class="hiddenuploadfield">
|
||||
<p><em><?php p($l->t('png or jpg, max. 20 MB')); ?></em></p>
|
||||
<?php else: ?>
|
||||
<?php p($l->t('Picture provided by original account')); ?>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
|
||||
<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 picture')); ?></div>
|
||||
</div>
|
||||
</form>
|
||||
<?php endif; ?>
|
||||
|
||||
|
||||
|
||||
<?php
|
||||
if($_['displayNameChangeSupported']) {
|
||||
?>
|
||||
<form id="displaynameform" class="section">
|
||||
<h2>
|
||||
<label for="displayName"><?php echo $l->t('Full name');?></label>
|
||||
</h2>
|
||||
<input type="text" id="displayName" name="displayName"
|
||||
value="<?php p($_['displayName'])?>"
|
||||
autocomplete="on" autocapitalize="off" autocorrect="off" />
|
||||
<span class="msg"></span>
|
||||
<input type="hidden" id="oldDisplayName" name="oldDisplayName" value="<?php p($_['displayName'])?>" />
|
||||
</form>
|
||||
<?php
|
||||
} else {
|
||||
?>
|
||||
<div class="section">
|
||||
<h2><?php echo $l->t('Full name');?></h2>
|
||||
<span><?php if(isset($_['displayName'][0])) { p($_['displayName']); } else { p($l->t('No display name set')); } ?></span>
|
||||
</div>
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
|
||||
|
||||
|
||||
<?php
|
||||
if($_['passwordChangeSupported']) {
|
||||
?>
|
||||
<form id="lostpassword" class="section">
|
||||
<h2>
|
||||
<label for="email"><?php p($l->t('Email'));?></label>
|
||||
</h2>
|
||||
<input type="email" name="email" id="email" value="<?php p($_['email']); ?>"
|
||||
placeholder="<?php p($l->t('Your email address'));?>"
|
||||
autocomplete="on" autocapitalize="off" autocorrect="off" />
|
||||
<span class="msg"></span><br />
|
||||
<em><?php p($l->t('For password recovery and notifications'));?></em>
|
||||
</form>
|
||||
<?php
|
||||
} else {
|
||||
?>
|
||||
<div class="section">
|
||||
<h2><?php echo $l->t('Email'); ?></h2>
|
||||
<span><?php if(isset($_['email'][0])) { p($_['email']); } else { p($l->t('No email address set')); }?></span>
|
||||
</div>
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
|
||||
|
||||
|
||||
<div id="groups" class="section">
|
||||
<h2><?php p($l->t('Groups')); ?></h2>
|
||||
<p><?php p($l->t('You are member of the following groups:')); ?></p>
|
||||
<p>
|
||||
<?php p(implode(', ', $_['groups'])); ?>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<?php
|
||||
if($_['passwordChangeSupported']) {
|
||||
script('jquery-showpassword');
|
||||
@ -92,85 +151,7 @@ if($_['passwordChangeSupported']) {
|
||||
}
|
||||
?>
|
||||
|
||||
<?php
|
||||
if($_['displayNameChangeSupported']) {
|
||||
?>
|
||||
<form id="displaynameform" class="section">
|
||||
<h2>
|
||||
<label for="displayName"><?php echo $l->t('Full name');?></label>
|
||||
</h2>
|
||||
<input type="text" id="displayName" name="displayName"
|
||||
value="<?php p($_['displayName'])?>"
|
||||
autocomplete="on" autocapitalize="off" autocorrect="off" />
|
||||
<span class="msg"></span>
|
||||
<input type="hidden" id="oldDisplayName" name="oldDisplayName" value="<?php p($_['displayName'])?>" />
|
||||
</form>
|
||||
<?php
|
||||
} else {
|
||||
?>
|
||||
<div class="section">
|
||||
<h2><?php echo $l->t('Full name');?></h2>
|
||||
<span><?php if(isset($_['displayName'][0])) { p($_['displayName']); } else { p($l->t('No display name set')); } ?></span>
|
||||
</div>
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
|
||||
<?php
|
||||
if($_['passwordChangeSupported']) {
|
||||
?>
|
||||
<form id="lostpassword" class="section">
|
||||
<h2>
|
||||
<label for="email"><?php p($l->t('Email'));?></label>
|
||||
</h2>
|
||||
<input type="email" name="email" id="email" value="<?php p($_['email']); ?>"
|
||||
placeholder="<?php p($l->t('Your email address'));?>"
|
||||
autocomplete="on" autocapitalize="off" autocorrect="off" />
|
||||
<span class="msg"></span><br />
|
||||
<em><?php p($l->t('Fill in an email address to enable password recovery and receive notifications'));?></em>
|
||||
</form>
|
||||
<?php
|
||||
} else {
|
||||
?>
|
||||
<div class="section">
|
||||
<h2><?php echo $l->t('Email'); ?></h2>
|
||||
<span><?php if(isset($_['email'][0])) { p($_['email']); } else { p($l->t('No email address set')); }?></span>
|
||||
</div>
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
|
||||
<div id="groups" class="section">
|
||||
<h2><?php p($l->t('Groups')); ?></h2>
|
||||
<p><?php p($l->t('You are member of the following groups:')); ?></p>
|
||||
<p>
|
||||
<?php p(implode(', ', $_['groups'])); ?>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<?php if ($_['enableAvatars']): ?>
|
||||
<form id="avatar" class="section" method="post" action="<?php p(\OC::$server->getURLGenerator()->linkToRoute('core.avatar.postAvatar')); ?>">
|
||||
<h2><?php p($l->t('Profile picture')); ?></h2>
|
||||
<div id="displayavatar">
|
||||
<div class="avatardiv"></div><br>
|
||||
<div class="warning hidden"></div>
|
||||
<?php if ($_['avatarChangeSupported']): ?>
|
||||
<label for="uploadavatar" class="inlineblock button" id="uploadavatarbutton"><?php p($l->t('Upload new')); ?></label>
|
||||
<div class="inlineblock button" id="selectavatar"><?php p($l->t('Select new from Files')); ?></div>
|
||||
<div class="inlineblock button" id="removeavatar"><?php p($l->t('Remove image')); ?></div>
|
||||
<input type="file" name="files[]" id="uploadavatar" class="hiddenuploadfield">
|
||||
<br>
|
||||
<?php p($l->t('Either png or jpg. Ideally square but you will be able to crop it. The file is not allowed to exceed the maximum size of 20 MB.')); ?>
|
||||
<?php else: ?>
|
||||
<?php p($l->t('Your avatar is provided by your original account.')); ?>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<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>
|
||||
</form>
|
||||
<?php endif; ?>
|
||||
|
||||
<form class="section">
|
||||
<h2>
|
||||
@ -200,6 +181,41 @@ if($_['passwordChangeSupported']) {
|
||||
<?php endif; ?>
|
||||
</form>
|
||||
|
||||
|
||||
|
||||
<div id="clientsbox" class="section clientsbox">
|
||||
<h2><?php p($l->t('Get the apps to sync your files'));?></h2>
|
||||
<a href="<?php p($_['clients']['desktop']); ?>" target="_blank">
|
||||
<img src="<?php print_unescaped(OCP\Util::imagePath('core', 'desktopapp.png')); ?>"
|
||||
alt="<?php p($l->t('Desktop client'));?>" />
|
||||
</a>
|
||||
<a href="<?php p($_['clients']['android']); ?>" target="_blank">
|
||||
<img src="<?php print_unescaped(OCP\Util::imagePath('core', 'googleplay.png')); ?>"
|
||||
alt="<?php p($l->t('Android app'));?>" />
|
||||
</a>
|
||||
<a href="<?php p($_['clients']['ios']); ?>" target="_blank">
|
||||
<img src="<?php print_unescaped(OCP\Util::imagePath('core', 'appstore.png')); ?>"
|
||||
alt="<?php p($l->t('iOS app'));?>" />
|
||||
</a>
|
||||
|
||||
<?php if (OC_Util::getEditionString() === ''): ?>
|
||||
<p>
|
||||
<?php print_unescaped($l->t('If you want to support the project
|
||||
<a href="https://owncloud.org/contribute"
|
||||
target="_blank" rel="noreferrer">join development</a>
|
||||
or
|
||||
<a href="https://owncloud.org/promote"
|
||||
target="_blank" rel="noreferrer">spread the word</a>!'));?>
|
||||
</p>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if(OC_APP::isEnabled('firstrunwizard')) {?>
|
||||
<a class="button" href="#" id="showWizard"><?php p($l->t('Show First Run Wizard again'));?></a>
|
||||
<?php }?>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<?php foreach($_['forms'] as $form) {
|
||||
if (isset($form['form'])) {?>
|
||||
<div id="<?php isset($form['anchor']) ? p($form['anchor']) : p('');?>"><?php print_unescaped($form['form']);?></div>
|
||||
|
Loading…
Reference in New Issue
Block a user