mirror of
https://github.com/cryptpad/cryptpad.git
synced 2026-09-14 11:05:41 +05:00
Refactoring of profile layout #1742
This commit is contained in:
DianaXWiki
parent
fc99a53d34
commit
6df989d508
@ -21,9 +21,6 @@
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#cp-app-profile-rightside:has(.cp-app-profile-friend-container) #cp-app-profile-link {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#cp-app-profile-header {
|
||||
display: flex;
|
||||
@ -42,7 +39,7 @@
|
||||
text-align: center;
|
||||
max-width: 300px;
|
||||
max-height: 300px;
|
||||
margin-bottom: 5rem;
|
||||
margin-bottom: 1rem;
|
||||
&> span {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
@ -88,10 +85,14 @@
|
||||
.cp-app-profile-resizer {
|
||||
text-align: center;
|
||||
}
|
||||
#cp-app-profile-displayname {
|
||||
.cp-app-profile-displayname {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
#cp-app-profile-displayname, #cp-app-profile-link {
|
||||
div.cp-app-profile-link.hidden{
|
||||
display:none;
|
||||
}
|
||||
|
||||
.cp-app-profile-displayname, .cp-app-profile-link {
|
||||
margin-bottom: 1rem;
|
||||
input {
|
||||
width: 100%;
|
||||
@ -138,6 +139,14 @@
|
||||
}
|
||||
}
|
||||
|
||||
div.cp-app-profile-link {
|
||||
&.cp-app-profile-description-rendered,
|
||||
&.cp-app-profile-mute-container {
|
||||
&:has(p) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.cp-app-profile-friend {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -151,32 +160,17 @@
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.cp-app-profile-friend-container {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
// I tried using flexbox but messed with how the pencil icon was displayed
|
||||
#cp-app-profile-invite-button {
|
||||
float: right;
|
||||
}
|
||||
.cp-app-profile-viewprofile-button {
|
||||
margin-bottom: 1rem!important;
|
||||
}
|
||||
#cp-app-profile-description {
|
||||
position: relative;
|
||||
font-size: 16px;
|
||||
margin-bottom: 20px;
|
||||
margin-top: 1em;
|
||||
.cp-app-profile-description-code {
|
||||
display: none;
|
||||
}
|
||||
.cp-app-profile-description-rendered {
|
||||
border: 1px solid @cp_profile-border;
|
||||
padding: 0 15px;
|
||||
&:empty {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.cp-app-profile-description-ok, .cp-app-profile-description-spin {
|
||||
position: absolute;
|
||||
bottom: 2px;
|
||||
@ -212,11 +206,6 @@
|
||||
margin-top: 5px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
margin-bottom: 1rem;
|
||||
&:has(p) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -101,32 +101,45 @@ define([
|
||||
var sFrameChan;
|
||||
|
||||
var addViewButton = function ($container) {
|
||||
if (APP.readOnly) {
|
||||
return;
|
||||
}
|
||||
|
||||
var hash = common.getMetadataMgr().getPrivateData().hashes.viewHash;
|
||||
var url = APP.origin + '/profile/#' + hash;
|
||||
|
||||
$('<button>', {
|
||||
'class': 'btn '+VIEW_PROFILE_BUTTON,
|
||||
}).text(Messages.profile_viewMyProfile).click(function () {
|
||||
window.open(url, '_blank');
|
||||
}).appendTo($container);
|
||||
|
||||
$('<button>', {
|
||||
'class': 'btn btn-primary '+VIEW_PROFILE_BUTTON,
|
||||
}).append(h('i', { 'class': 'fa fa-share-alt', 'aria-hidden': 'true', 'aria-labelledby': Messages.shareButton }))
|
||||
.append(h('span', Messages.shareButton))
|
||||
.click(function () {
|
||||
Clipboard.copy(url, (err) => {
|
||||
if (!err) { UI.log(Messages.shareSuccess); }
|
||||
});
|
||||
}).appendTo($container);
|
||||
|
||||
// Only add view and share buttons if not read-only
|
||||
if (!APP.readOnly) {
|
||||
var $blockView = $('<div>', {class: LINK_ID}).appendTo($container);
|
||||
$('<button>', {
|
||||
'class': 'btn ' + VIEW_PROFILE_BUTTON,
|
||||
}).text(Messages.profile_viewMyProfile).click(function () {
|
||||
window.open(url, '_blank');
|
||||
}).appendTo($blockView);
|
||||
}
|
||||
|
||||
// Always create the description container
|
||||
var $blockDescription = $('<div>', {class: DESCRIPTION_ID}).appendTo($container);
|
||||
APP.$descriptionContainer = $blockDescription;
|
||||
APP.$description = $('<div>', {
|
||||
'id': 'cp-app-profile-description-info'
|
||||
}).appendTo($blockDescription);
|
||||
|
||||
// Add the share button only for editable profiles
|
||||
if (!APP.readOnly) {
|
||||
var $blockShare = $('<div>', {class: LINK_ID}).appendTo($container);
|
||||
$('<button>', {
|
||||
'class': 'btn btn-primary ' + VIEW_PROFILE_BUTTON,
|
||||
}).append(
|
||||
h('i', { 'class': 'fa fa-share-alt', 'aria-hidden': 'true', 'aria-labelledby': Messages.shareButton })
|
||||
).append(
|
||||
h('span', Messages.shareButton)
|
||||
).click(function () {
|
||||
Clipboard.copy(url, (err) => {
|
||||
if (!err) { UI.log(Messages.shareSuccess); }
|
||||
});
|
||||
}).appendTo($blockShare);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
var addDisplayName = function ($container) {
|
||||
var $block = $('<div>', {id: DISPLAYNAME_ID}).appendTo($container);
|
||||
var $block = $('<div>', {class: DISPLAYNAME_ID}).appendTo($container);
|
||||
APP.$name = $('<span>', {'class': DISPLAYNAME_ID}).appendTo($block);
|
||||
};
|
||||
var refreshName = function (data) {
|
||||
@ -134,7 +147,7 @@ define([
|
||||
};
|
||||
|
||||
var addLink = function ($container) {
|
||||
var $block = $('<div>', {id: LINK_ID}).appendTo($container);
|
||||
var $block = $('<div>', {class: LINK_ID}).appendTo($container);
|
||||
|
||||
APP.$link = $('<a>', {
|
||||
'class': LINK_ID,
|
||||
@ -199,8 +212,9 @@ define([
|
||||
|
||||
var addFriendRequest = function ($container) {
|
||||
if (!APP.readOnly || !APP.common.isLoggedIn()) { return; }
|
||||
var $block = $('<div>', {class: LINK_ID}).appendTo($container);
|
||||
APP.$friend = $(h('div.cp-app-profile-friend-container'));
|
||||
$container.append(APP.$friend);
|
||||
$block.append(APP.$friend);
|
||||
};
|
||||
var refreshFriendRequest = function (data) {
|
||||
if (!APP.$friend) { return; }
|
||||
@ -305,7 +319,7 @@ define([
|
||||
|
||||
var addMuteButton = function ($container) {
|
||||
if (!APP.readOnly || !APP.common.isLoggedIn()) { return; }
|
||||
APP.$mute = $(h('div.cp-app-profile-mute-container'));
|
||||
APP.$mute = $(h('div.cp-app-profile-mute-container.cp-app-profile-link'));
|
||||
$container.append(APP.$mute);
|
||||
};
|
||||
var refreshMute = function (data) {
|
||||
@ -432,7 +446,6 @@ define([
|
||||
var addDescription = function ($container) {
|
||||
var $block = $('<div>', {id: DESCRIPTION_ID, class:'cp-sidebarlayout-element'}).appendTo($container);
|
||||
|
||||
APP.$description = $('<div>', {'class': 'cp-app-profile-description-rendered'}).appendTo($block);
|
||||
APP.$descriptionEdit = $();
|
||||
if (APP.readOnly) { return; }
|
||||
|
||||
@ -486,7 +499,8 @@ define([
|
||||
});
|
||||
};
|
||||
var refreshDescription = function (data) {
|
||||
var val = Marked.parse(data.description || "");
|
||||
var descriptionData = data.description || "";
|
||||
var val = Marked.parse(descriptionData);
|
||||
APP.$description.html(val);
|
||||
APP.$description.off('click');
|
||||
APP.$description.click(function (e) {
|
||||
@ -503,6 +517,11 @@ define([
|
||||
if (!APP.editor) { return; }
|
||||
APP.editor.setValue(data.description || "");
|
||||
APP.editor.save();
|
||||
if ($.trim(descriptionData) === "") {
|
||||
APP.$descriptionContainer.addClass('hidden');
|
||||
} else {
|
||||
APP.$descriptionContainer.removeClass('hidden');
|
||||
}
|
||||
};
|
||||
|
||||
var addPublicKey = function ($container) {
|
||||
@ -535,15 +554,14 @@ define([
|
||||
|
||||
var addCopyData = function ($container) {
|
||||
if (!APP.isModerator) { return; }
|
||||
|
||||
var $div = $(h('div.cp-sidebarlayout-element')).appendTo($container);
|
||||
var $block = $('<div>', {class:LINK_ID}).appendTo($container);
|
||||
APP.$copyData = $(h('button.btn.btn-secondary', [
|
||||
h('i.fa.fa-clipboard'),
|
||||
h('span', Messages.support_copyUserData)
|
||||
])).click(function () {
|
||||
if (!APP.getCopyData) { return; }
|
||||
APP.getCopyData();
|
||||
}).appendTo($div).hide();
|
||||
}).appendTo($block).hide();
|
||||
};
|
||||
var setCopyDataButton = function (data) {
|
||||
if (!data.curvePublic) { return; }
|
||||
|
||||
Loading…
Reference in New Issue
Block a user