diff --git a/src/assets/fonts/tgico.eot b/src/assets/fonts/tgico.eot
index 0bd23a10..6e0ddc74 100644
Binary files a/src/assets/fonts/tgico.eot and b/src/assets/fonts/tgico.eot differ
diff --git a/src/assets/fonts/tgico.svg b/src/assets/fonts/tgico.svg
index 2ad13550..e314cbfb 100644
--- a/src/assets/fonts/tgico.svg
+++ b/src/assets/fonts/tgico.svg
@@ -7,102 +7,116 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/assets/fonts/tgico.ttf b/src/assets/fonts/tgico.ttf
index 9bdcff3a..65da5d36 100644
Binary files a/src/assets/fonts/tgico.ttf and b/src/assets/fonts/tgico.ttf differ
diff --git a/src/assets/fonts/tgico.woff b/src/assets/fonts/tgico.woff
index ee8dd3ce..c5d66f39 100644
Binary files a/src/assets/fonts/tgico.woff and b/src/assets/fonts/tgico.woff differ
diff --git a/src/components/wrappers.ts b/src/components/wrappers.ts
index 32c20eb3..907ed0ac 100644
--- a/src/components/wrappers.ts
+++ b/src/components/wrappers.ts
@@ -628,7 +628,7 @@ function wrapMediaWithTail(photo: any, message: {mid: number, message: string},
return img;
}
-export function wrapPhoto(photoID: string, message: any, container: HTMLDivElement, boxWidth = 380, boxHeight = 380, withTail = true, isOut = false, lazyLoadQueue: LazyLoadQueue, middleware: () => boolean, size: MTPhotoSize = null) {
+export function wrapPhoto(photoID: string, message: any, container: HTMLDivElement, boxWidth = 480, boxHeight = 480, withTail = true, isOut = false, lazyLoadQueue: LazyLoadQueue, middleware: () => boolean, size: MTPhotoSize = null) {
let photo = appPhotosManager.getPhoto(photoID);
let image: HTMLImageElement;
@@ -940,7 +940,7 @@ export function wrapAlbum({groupID, attachmentDiv, middleware, uploading, lazyLo
let m = appMessagesManager.getMessage(+mid);
let media = m.media.photo || m.media.document;
- let size: any = media._ == 'photo' ? appPhotosManager.choosePhotoSize(media, 380, 380) : {w: media.w, h: media.h};
+ let size: any = media._ == 'photo' ? appPhotosManager.choosePhotoSize(media, 480, 480) : {w: media.w, h: media.h};
items.push({size, media, message: m});
}
diff --git a/src/lib/appManagers/appImManager.ts b/src/lib/appManagers/appImManager.ts
index 62b64374..6347f035 100644
--- a/src/lib/appManagers/appImManager.ts
+++ b/src/lib/appManagers/appImManager.ts
@@ -1722,8 +1722,8 @@ export class AppImManager {
doc,
container: attachmentDiv,
message,
- boxWidth: 380,
- boxHeight: 380,
+ boxWidth: 480,
+ boxHeight: 480,
withTail: doc.type != 'round',
isOut: isOut,
lazyLoadQueue: this.lazyLoadQueue,
@@ -1793,16 +1793,7 @@ export class AppImManager {
let quote = document.createElement('div');
quote.classList.add('quote');
-
- let nameEl = document.createElement('a');
- nameEl.classList.add('name');
-
- let titleDiv = document.createElement('div');
- titleDiv.classList.add('title');
-
- let textDiv = document.createElement('div');
- textDiv.classList.add('text');
-
+
let preview: HTMLDivElement = null;
if(webpage.photo || webpage.document) {
preview = document.createElement('div');
@@ -1820,8 +1811,8 @@ export class AppImManager {
doc,
container: preview,
message,
- boxWidth: 380,
- boxHeight: 300,
+ boxWidth: 480,
+ boxHeight: 400,
lazyLoadQueue: this.lazyLoadQueue,
middleware: this.getMiddleware(),
isOut
@@ -1832,40 +1823,50 @@ export class AppImManager {
}
}
- if(webpage.photo && !doc) {
- bubble.classList.add('photo');
-
- const size = webpage.photo.sizes[webpage.photo.sizes.length - 1];
- if(size.w == size.h) {
- bubble.classList.add('is-square-photo');
- } else if(size.h > size.w) {
- bubble.classList.add('is-vertical-photo');
- }
-
- wrapPhoto(webpage.photo.id, message, preview, 380, 300, false, null, this.lazyLoadQueue, this.getMiddleware());
- }
-
if(preview) {
quote.append(preview);
}
- nameEl.setAttribute('target', '_blank');
- nameEl.href = webpage.url || '#';
- nameEl.innerHTML = webpage.site_name ? RichTextProcessor.wrapEmojiText(webpage.site_name) : '';
-
- if(webpage.description) {
- textDiv.innerHTML = RichTextProcessor.wrapRichText(webpage.description);
+ let quoteTextDiv = document.createElement('div');
+ quoteTextDiv.classList.add('quote-text');
+
+ if(webpage.site_name) {
+ let nameEl = document.createElement('a');
+ nameEl.classList.add('name');
+ nameEl.setAttribute('target', '_blank');
+ nameEl.href = webpage.url || '#';
+ nameEl.innerHTML = RichTextProcessor.wrapEmojiText(webpage.site_name);
+ quoteTextDiv.append(nameEl);
}
-
+
if(webpage.title) {
+ let titleDiv = document.createElement('div');
+ titleDiv.classList.add('title');
titleDiv.innerHTML = RichTextProcessor.wrapRichText(webpage.title);
+ quoteTextDiv.append(titleDiv);
}
- let quoteTextDiv = document.createElement('div');
- quoteTextDiv.classList.add('quote-text');
- quoteTextDiv.append(nameEl, titleDiv, textDiv);
+ if(webpage.description) {
+ let textDiv = document.createElement('div');
+ textDiv.classList.add('text');
+ textDiv.innerHTML = RichTextProcessor.wrapRichText(webpage.description);
+ quoteTextDiv.append(textDiv);
+ }
quote.append(quoteTextDiv);
+
+ if(webpage.photo && !doc) {
+ bubble.classList.add('photo');
+
+ const size = webpage.photo.sizes[webpage.photo.sizes.length - 1];
+ if(size.w == size.h && quoteTextDiv.childElementCount) {
+ bubble.classList.add('is-square-photo');
+ } else if(size.h > size.w) {
+ bubble.classList.add('is-vertical-photo');
+ }
+
+ wrapPhoto(webpage.photo.id, message, preview, 480, 400, false, null, this.lazyLoadQueue, this.getMiddleware());
+ }
box.append(quote);
@@ -1929,8 +1930,8 @@ export class AppImManager {
doc,
container: attachmentDiv,
message,
- boxWidth: 380,
- boxHeight: 380,
+ boxWidth: 480,
+ boxHeight: 480,
withTail: doc.type != 'round',
isOut: isOut,
lazyLoadQueue: this.lazyLoadQueue,
diff --git a/src/lib/appManagers/appPhotosManager.ts b/src/lib/appManagers/appPhotosManager.ts
index 02a70e9b..a4b05971 100644
--- a/src/lib/appManagers/appPhotosManager.ts
+++ b/src/lib/appManagers/appPhotosManager.ts
@@ -231,7 +231,7 @@ export class AppPhotosManager {
}
}
- public setAttachmentSize(photoID: any, element: HTMLElement | SVGForeignObjectElement, boxWidth = 380, boxHeight = 380, isSticker = false) {
+ public setAttachmentSize(photoID: any, element: HTMLElement | SVGForeignObjectElement, boxWidth = 480, boxHeight = 480, isSticker = false) {
let photo: /* MTDocument | MTPhoto */any = null;
if(typeof(photoID) === 'string') {
diff --git a/src/scss/partials/_chatBubble.scss b/src/scss/partials/_chatBubble.scss
index 82a03f00..d7804ce9 100644
--- a/src/scss/partials/_chatBubble.scss
+++ b/src/scss/partials/_chatBubble.scss
@@ -414,8 +414,8 @@
&:not(.sticker) {
.attachment {
- max-width: 380px;
- max-height: 380px;
+ max-width: 480px;
+ max-height: 480px;
width: max-content;
}
@@ -491,8 +491,8 @@
overflow: hidden;
.preview {
- max-height: 300px;
- max-width: 380px;
+ max-height: 400px;
+ max-width: 480px;
/* max-height: 100%;
max-width: 100%; */
border-radius: 4px;
diff --git a/src/scss/partials/_emojiDropdown.scss b/src/scss/partials/_emojiDropdown.scss
index cd69c73c..86c9360f 100644
--- a/src/scss/partials/_emojiDropdown.scss
+++ b/src/scss/partials/_emojiDropdown.scss
@@ -9,7 +9,7 @@
background: #fff;
box-shadow: 0px 5px 10px 5px rgba(16, 35, 47, 0.14);
border-radius: 10px;
- z-index: 2;
+ z-index: 3;
/* display: none; */
display: flex;
overflow: hidden;
diff --git a/src/scss/partials/_fonts.scss b/src/scss/partials/_fonts.scss
index dfa0d3a1..b8d02a4c 100644
--- a/src/scss/partials/_fonts.scss
+++ b/src/scss/partials/_fonts.scss
@@ -35,294 +35,336 @@
.tgico-check:before {
content: $tgico-check;
}
-.tgico-settings:before {
- content: "\e901";
+.tgico-checks:before {
+ content: $tgico-checks;
}
-.tgico-smallscreen:before {
+.tgico-activesessions:before {
content: "\e902";
}
-.tgico-smile:before {
+.tgico-add:before {
content: "\e903";
}
-.tgico-sport:before {
+.tgico-addmember_filled:before {
content: "\e904";
}
-.tgico-stop:before {
+.tgico-adduser:before {
content: "\e905";
}
-.tgico-unarchive:before {
+.tgico-admin:before {
content: "\e906";
}
-.tgico-unlock:before {
+.tgico-animals:before {
content: "\e907";
}
-.tgico-unmute:before {
+.tgico-archive:before {
content: "\e908";
}
-.tgico-unpin:before {
+.tgico-attach:before {
content: "\e909";
}
-.tgico-unread:before {
+.tgico-avatar_archivedchats:before {
content: "\e90a";
}
-.tgico-up:before {
+.tgico-avatar_deletedaccount:before {
content: "\e90b";
}
-.tgico-username:before {
+.tgico-avatar_savedmessages:before {
content: "\e90c";
}
-.tgico-user:before {
+.tgico-back:before {
content: "\e90d";
}
-.tgico-play:before {
+.tgico-bots:before {
content: "\e90e";
}
-.tgico-poll:before {
+.tgico-calendar:before {
content: "\e90f";
}
-.tgico-radiooff:before {
+.tgico-camera:before {
content: "\e910";
}
-.tgico-radioon:before {
+.tgico-cameraadd:before {
content: "\e911";
}
-.tgico-recent:before {
+.tgico-car:before {
content: "\e912";
}
-.tgico-reply:before {
+.tgico-channel:before {
content: "\e913";
}
-.tgico-revote:before {
+.tgico-channelviews:before {
content: "\e914";
}
-.tgico-savedmessages:before {
+.tgico-chatsplaceholder:before {
content: "\e915";
}
-.tgico-search:before {
+.tgico-check1:before {
content: "\e916";
}
-.tgico-send:before {
+.tgico-checkbox:before {
content: "\e917";
}
-.tgico-send2:before {
+.tgico-checkboxblock:before {
content: "\e918";
}
-.tgico-sending:before {
- content: $tgico-sending;
+.tgico-checkboxempty:before {
+ content: "\e919";
}
-.tgico-sendingerror:before {
+.tgico-checkboxon:before {
content: "\e91a";
}
-.tgico-mute:before {
- content: "\e91b";
+.tgico-close:before {
+ content: $tgico-close;
}
-.tgico-newchannel:before {
+.tgico-clouddownload:before {
content: "\e91c";
}
-.tgico-newchat_filled:before {
+.tgico-colorize:before {
content: "\e91d";
}
-.tgico-newgroup:before {
+.tgico-copy:before {
content: "\e91e";
}
-.tgico-newprivate:before {
+.tgico-data:before {
content: "\e91f";
}
-.tgico-next:before {
- content: $tgico-next;
+.tgico-delete:before {
+ content: "\e920";
}
-.tgico-nosound:before {
+.tgico-delete_filled:before {
content: "\e921";
}
-.tgico-pause:before {
+.tgico-deleteleft:before {
content: "\e922";
}
-.tgico-permissions:before {
+.tgico-deleteuser:before {
content: "\e923";
}
-.tgico-phone:before {
+.tgico-document:before {
content: "\e924";
}
-.tgico-photo:before {
+.tgico-down:before {
content: "\e925";
}
-.tgico-pin:before {
+.tgico-download:before {
content: "\e926";
}
-.tgico-pinnedchat:before {
+.tgico-eats:before {
content: "\e927";
}
-.tgico-largepause:before {
+.tgico-edit:before {
content: "\e928";
}
-.tgico-largeplay:before {
+.tgico-eye1:before {
content: "\e929";
}
-.tgico-livelocation:before {
+.tgico-eye2:before {
content: "\e92a";
}
-.tgico-location:before {
+.tgico-favourites:before {
content: "\e92b";
}
-.tgico-lock:before {
+.tgico-flag:before {
content: "\e92c";
}
-.tgico-logout:before {
+.tgico-folder:before {
content: "\e92d";
}
-.tgico-menu:before {
+.tgico-forward:before {
content: "\e92e";
}
-.tgico-message:before {
+.tgico-FullScreen:before {
content: "\e92f";
}
-.tgico-microphone:before {
+.tgico-gifs:before {
content: "\e930";
}
-.tgico-microphone2:before {
+.tgico-group:before {
content: "\e931";
}
-.tgico-minus:before {
+.tgico-help:before {
content: "\e932";
}
-.tgico-more:before {
+.tgico-info:before {
content: "\e933";
}
-.tgico-download:before {
+.tgico-info2:before {
content: "\e934";
}
-.tgico-eats:before {
+.tgico-keyboard:before {
content: "\e935";
}
-.tgico-edit:before {
+.tgico-lamp:before {
content: "\e936";
}
-.tgico-eye1:before {
+.tgico-language:before {
content: "\e937";
}
-.tgico-eye2:before {
+.tgico-largepause:before {
content: "\e938";
}
-.tgico-flag:before {
+.tgico-largeplay:before {
content: "\e939";
}
-.tgico-forward:before {
+.tgico-livelocation:before {
content: "\e93a";
}
-.tgico-fullscreen:before {
+.tgico-location:before {
content: "\e93b";
}
-.tgico-group:before {
+.tgico-lock:before {
content: "\e93c";
}
-.tgico-help:before {
+.tgico-logout:before {
content: "\e93d";
}
-.tgico-info:before {
+.tgico-menu:before {
content: "\e93e";
}
-.tgico-lamp:before {
+.tgico-message:before {
content: "\e93f";
}
-.tgico-language:before {
+.tgico-microphone:before {
content: "\e940";
}
-.tgico-checkboxempty:before {
+.tgico-microphone2:before {
content: "\e941";
}
-.tgico-checkboxon:before {
+.tgico-minus:before {
content: "\e942";
}
-.tgico-close:before {
+.tgico-more:before {
content: "\e943";
}
-.tgico-colorize:before {
+.tgico-mute:before {
content: "\e944";
}
-.tgico-copy:before {
+.tgico-muted:before {
content: "\e945";
}
-.tgico-data:before {
+.tgico-newchannel:before {
content: "\e946";
}
-.tgico-delete_filled:before {
+.tgico-newchat_filled:before {
content: "\e947";
}
-.tgico-delete:before {
+.tgico-newgroup:before {
content: "\e948";
}
-.tgico-deleteuser:before {
+.tgico-newprivate:before {
content: "\e949";
}
-.tgico-document:before {
- content: "\e94a";
+.tgico-next:before {
+ content: $tgico-next;
}
-.tgico-down:before {
+.tgico-noncontacts:before {
content: "\e94b";
}
-.tgico-attach:before {
+.tgico-nosound:before {
content: "\e94c";
}
-.tgico-avatar_archivedchats:before {
+.tgico-pause:before {
content: "\e94d";
}
-.tgico-avatar_deletedaccount:before {
+.tgico-permissions:before {
content: "\e94e";
}
-.tgico-avatar_savedmessages:before {
+.tgico-phone:before {
content: "\e94f";
}
-.tgico-back:before {
+.tgico-photo:before {
content: "\e950";
}
-.tgico-camera:before {
+.tgico-pin:before {
content: "\e951";
}
-.tgico-cameraadd:before {
+.tgico-pinnedchat:before {
content: "\e952";
}
-.tgico-car:before {
+.tgico-play:before {
content: "\e953";
}
-.tgico-channel:before {
+.tgico-poll:before {
content: "\e954";
}
-.tgico-channelviews:before {
+.tgico-radiooff:before {
content: "\e955";
}
-.tgico-chatsplaceholder:before {
+.tgico-radioon:before {
content: "\e956";
}
-.tgico-check1:before {
+.tgico-readchats:before {
content: "\e957";
}
-.tgico-checkbox:before {
+.tgico-recent:before {
content: "\e958";
}
-.tgico-checkboxblock:before {
+.tgico-reply:before {
content: "\e959";
}
-.tgico-checks:before {
- content: $tgico-checks;
+.tgico-revote:before {
+ content: "\e95a";
}
-.tgico-activesessions:before {
+.tgico-savedmessages:before {
content: "\e95b";
}
-.tgico-add:before {
+.tgico-search:before {
content: "\e95c";
}
-.tgico-addmember_filled:before {
+.tgico-send:before {
content: "\e95d";
}
-.tgico-adduser:before {
+.tgico-send2:before {
content: "\e95e";
}
-.tgico-admin:before {
- content: "\e95f";
+.tgico-sending:before {
+ content: $tgico-sending;
}
-.tgico-animals:before {
+.tgico-sendingerror:before {
content: "\e960";
}
-.tgico-archive:before {
+.tgico-settings:before {
content: "\e961";
}
+.tgico-smallscreen:before {
+ content: "\e962";
+}
+.tgico-smile:before {
+ content: "\e963";
+}
+.tgico-sport:before {
+ content: "\e964";
+}
+.tgico-stickers:before {
+ content: "\e965";
+}
+.tgico-stop:before {
+ content: "\e966";
+}
+.tgico-tip:before {
+ content: "\e967";
+}
+.tgico-unarchive:before {
+ content: "\e968";
+}
+.tgico-unlock:before {
+ content: "\e969";
+}
+.tgico-unmute:before {
+ content: "\e96a";
+}
+.tgico-unpin:before {
+ content: "\e96b";
+}
+.tgico-unread:before {
+ content: "\e96c";
+}
+.tgico-up:before {
+ content: "\e96d";
+}
+.tgico-user:before {
+ content: "\e96e";
+}
+.tgico-username:before {
+ content: "\e96f";
+}
diff --git a/src/scss/partials/_ico.scss b/src/scss/partials/_ico.scss
index f5528316..f729b540 100644
--- a/src/scss/partials/_ico.scss
+++ b/src/scss/partials/_ico.scss
@@ -2,7 +2,7 @@ $tgico-font-family: "tgico" !default;
$tgico-font-path: "../../assets/fonts" !default;
$tgico-check: "\e900";
-$tgico-checks: "\e95a";
-$tgico-sending: "\e919";
-$tgico-close: "\e943";
-$tgico-next: "\e920";
+$tgico-checks: "\e901";
+$tgico-sending: "\e95f";
+$tgico-close: "\e91b";
+$tgico-next: "\e94a";