Fix several avatars

Fix pinned unpin all button
Fix hiding pinned messages after unpin all

src/components/chat/bubbles.ts

@@ -1894,7 +1894,7 @@ export default class ChatBubbles {
 
           const avatarElem = new AvatarElement();
           avatarElem.setAttribute('peer', '' + message.media.user_id);
-          avatarElem.classList.add('contact-avatar');
+          avatarElem.classList.add('contact-avatar', 'avatar-54');
 
           contactDiv.prepend(avatarElem);
 
@@ -2019,7 +2019,7 @@ export default class ChatBubbles {
       if((!our && this.peerId < 0 && (!this.appPeersManager.isChannel(this.peerId) || this.appPeersManager.isMegagroup(this.peerId))) 
         || (this.peerId == rootScope.myId && !message.reply_to_mid)) {
         let avatarElem = new AvatarElement();
-        avatarElem.classList.add('user-avatar');
+        avatarElem.classList.add('user-avatar', 'avatar-40');
 
         if(!message.fwdFromId && message.fwd_from && message.fwd_from.from_name) {
           avatarElem.setAttribute('peer-title', /* '🔥 FF 🔥' */message.fwd_from.from_name);

src/components/chat/input.ts

@@ -347,6 +347,12 @@ export default class ChatInput {
 
       promise.then(() => {
         this.chat.appImManager.setPeer(0); // * close tab
+
+        // ! костыль, это скроет закреплённые сообщения сразу, вместо того, чтобы ждать пока анимация перехода закончится
+        const originalChat = this.chat.appImManager.chat;
+        if(originalChat.topbar.pinnedMessage) {
+          originalChat.topbar.pinnedMessage.pinnedMessageContainer.toggle(true);
+        }
       });
     });
 
@@ -409,6 +415,10 @@ export default class ChatInput {
       this.setUnreadCount();
     }
 
+    if(this.chat.type == 'pinned') {
+      this.chatInput.classList.toggle('can-pin', this.appPeersManager.canPinMessage(peerId));
+    }
+
     if(this.messageInput) {
       const canWrite = this.appMessagesManager.canWriteToPeer(peerId);
       this.chatInput.classList.add('no-transition');

src/components/popupPeer.ts

@@ -13,7 +13,7 @@ export default class PopupPeer extends PopupElement {
     let avatarEl = new AvatarElement();
     avatarEl.setAttribute('dialog', '1');
     avatarEl.setAttribute('peer', '' + options.peerId);
-    avatarEl.classList.add('peer-avatar');
+    avatarEl.classList.add('avatar-32');
 
     this.title.innerText = options.title || '';
     this.header.prepend(avatarEl);

src/lib/appManagers/appImManager.ts

@@ -121,6 +121,11 @@ export class AppImManager {
     this.chatsContainer.classList.add('chats-container', 'tabs-container');
 
     this.chatsSelectTab = TransitionSlider(this.chatsContainer, 'navigation', 250, (id) => {
+      const topbar = this.chat.topbar;
+      if(topbar.pinnedMessage) { // * буду молиться богам, чтобы это ничего не сломало, но это исправляет получение пиннеда после анимации
+        topbar.pinnedMessage.setCorrectIndex(0);
+      }
+
       apiManager.setQueueId(this.chat.bubbles.lazyLoadQueue.queueId);
     });
     

src/lib/mtproto/apiFileManager.ts

@@ -122,7 +122,7 @@ export class ApiFileManager {
   }
 
   public setQueueId(queueId: number) {
-    this.log.error('setQueueId', queueId);
+    //this.log.error('setQueueId', queueId);
     this.queueId = queueId;
   }
 

src/scss/partials/_avatar.scss

@@ -75,7 +75,12 @@ avatar-element {
   } */
   &.avatar-120 {
     --size: 120px;
-    --multiplier: 0.45;
+    --multiplier: .45;
+  }
+
+  &.avatar-100 {
+    --size: 100px;
+    --multiplier: .54;
   }
 
   &.avatar-48 {

src/scss/partials/_chat.scss

@@ -469,6 +469,10 @@ $chat-helper-size: 39px;
 		width: 17.125rem;
 	}
 
+	.chat-input.type-pinned.can-pin & {
+		width: 13.125rem;
+	}
+
 	&.is-centering {
 		html:not(.is-safari) & {
 			transition: width .2s, border-bottom-right-radius .1s, transform .2s;
@@ -723,6 +727,10 @@ $chat-helper-size: 39px;
 	.pinned-container {
 		width: 17.125rem;
 
+		.chat-input.can-pin & {
+			width: 13.125rem;
+		}
+
 		&-button {
 			height: 2.5rem;
 			padding: 0;

src/scss/partials/_chatBubble.scss

@@ -278,10 +278,6 @@ $bubble-margin: .25rem;
       position: absolute;
       margin-left: -45px;
       //left: -3rem; # DO JS3
-      width: 40px;
-      height: 40px;
-      line-height: 40px;
-      font-size: 1rem;
       cursor: pointer;
 
       .bubbles.is-selecting & {

src/scss/partials/_input.scss

@@ -201,7 +201,8 @@ input:focus, button:focus {
     background-color: var(--color-gray-hover);
     padding: 0px calc(42px - var(--border-width));
     height: var(--height);
-    max-height: var(--height);
+    min-height: var(--height) !important;
+    max-height: var(--height) !important;
     //line-height: calc(var(--height) + 2px - var(--border-width) * 2);
     border-radius: 22px;
     transition: background-color .2s ease-in-out, border-color .2s ease-in-out;

src/scss/partials/_rightSidebar.scss

@@ -226,8 +226,8 @@
 
     @include respond-to(handhelds) {
       margin: 0 auto 10px;
-      width: 100px;
-      height: 100px;
+      --size: 100px;
+      --multiplier: .54;
     }
   }
 

src/scss/partials/popups/_peer.scss

@@ -44,10 +44,4 @@
       }
     }
   }
-
-  .peer-avatar {
-    height: 2rem;
-    width: 2rem;
-    font-size: .875rem;
-  }
 }