vassili/seitime-frappe
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

fix: cleanup code

Browse source
This commit is contained in:
prssanna 2021-02-24 17:07:19 +05:30
parent 14c4638f29
commit 73e6b9bfc2
2 changed files with 58 additions and 67 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

68
frappe/public/js/frappe/ui/link_preview.js
View file

@ -170,24 +170,49 @@ frappe.ui.LinkPreview = class {
this.href = this.href.replace(new RegExp(' ', 'g'), '%20');
}
let image_html = '';
let popover_content =`
<div class="preview-popover-header">
<div class="preview-header">
${this.get_image_html(preview_data)}
<div class="preview-name">
<a href=${this.href}>${__(preview_data.preview_title)}</a>
</div>
<div class="text-muted preview-title">${this.get_id_html(preview_data)}</div>
</div>
</div>
<hr>
<div class="popover-body">
${this.get_content_html(preview_data)}
</div>
`;
return popover_content;
}
get_id_html(preview_data) {
let id_html = '';
let content_html = '';
let image_url = preview_data.preview_image;
let avatar_html = frappe.get_avatar(
"avatar-large",
preview_data.preview_title,
image_url
);
image_html = `<div class="preview-image">
${avatar_html}
</div>`;
if (preview_data.preview_title !== preview_data.name) {
id_html = `<a class="text-muted" href=${this.href}>${preview_data.name}</a>`;
}
return id_html;
}
get_image_html(preview_data) {
let avatar_html = frappe.get_avatar(
"avatar-medium",
preview_data.preview_title,
preview_data.preview_image
);
return `<div class="preview-image">
${avatar_html}
</div>`;
}
get_content_html(preview_data) {
let content_html = '';
Object.keys(preview_data).forEach(key => {
if (!['preview_image', 'preview_title', 'name'].includes(key)) {
let value = frappe.ellipsis(preview_data[key], 280);
@ -200,23 +225,8 @@ frappe.ui.LinkPreview = class {
`;
}
});
content_html = `<div class="preview-table">${content_html}</div>`;
let popover_content =`
<div class="preview-popover-header">
<div class="preview-header">
${image_html}
<div class="preview-name"><a href=${this.href}>${__(preview_data.preview_title)}</a></div>
<div class="text-muted preview-title">${id_html}</div>
</div>
</div>
<hr>
<div class="popover-body">
${content_html}
</div>
`;
return popover_content;
return `<div class="preview-table">${content_html}</div>`;
}
};

57
frappe/public/scss/desk/link_preview.scss
View file

@ -2,56 +2,37 @@
max-width: 100%;
.popover-content {
padding: 15px 25px;
padding: var(--padding-md) 25px;
.preview-popover-header {
.preview-header {
@include flex(flex, null, center, column);
}
.preview-header {
@include flex(flex, null, center, column);
}
.preview-image {
margin-bottom: var(--margin-sm);
.preview-image {
margin-bottom: var(--margin-sm);
// object-fit: cover;
// border-radius: var(--border-radius-sm);
.avatar {
width: 52px;
height: 52px;
.avatar {
width: 52px;
height: 52px;
.standard-image {
font-size: var(--text-lg);
}
}
}
img:after {
content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='lightgrey' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-image'><rect x='3' y='3' width='18' height='18' rx='2' ry='2'/><circle cx='8.5' cy='8.5' r='1.5'/><polyline points='21 15 16 10 5 21'/></svg>");
}
.preview-name {
font-size: var(--text-base);
font-weight: 500;
}
img[alt]:after {
height: 52px;
@include flex();
position: absolute;
z-index: 1;
top: -15px;
left: 0px;
width: 100%;
background-color: var(--bg-color);
border-radius: var(--border-radius);
}
.preview-name {
// display: block;
font-size: var(--text-base);
font-weight: 500;
}
.preview-title:not(:empty) {
margin-top: var(--margin-xs);
font-size: var(--text-md);
}
.preview-title:not(:empty) {
margin-top: var(--margin-xs);
font-size: var(--text-md);
}
.popover-body {
padding: 0;
.preview-table {
padding-bottom: var(--padding-xs);
max-width: 330px;