diff --git a/src/components/chat/contextMenu.ts b/src/components/chat/contextMenu.ts index 622c074d..f676ab25 100644 --- a/src/components/chat/contextMenu.ts +++ b/src/components/chat/contextMenu.ts @@ -38,6 +38,7 @@ import contextMenuController from "../../helpers/contextMenuController"; import { attachContextMenuListener } from "../../helpers/dom/attachContextMenuListener"; import filterAsync from "../../helpers/array/filterAsync"; import appDownloadManager from "../../lib/appManagers/appDownloadManager"; +import { SERVICE_PEER_ID } from "../../lib/mtproto/mtproto_config"; export default class ChatContextMenu { private buttons: (ButtonMenuItemOptions & {verify: () => boolean | Promise, notDirect?: () => boolean, withSelection?: true, isSponsored?: true})[]; @@ -171,68 +172,76 @@ export default class ChatContextMenu { this.mid = mid; } - this.isSelected = this.chat.selection.isMidSelected(this.peerId, this.mid); - this.message = await this.chat.getMessage(this.mid); - this.noForwards = !isSponsored && !(await this.managers.appMessagesManager.canForward(this.message)); - this.viewerPeerId = undefined; - this.canOpenReactedList = undefined; - - const initResult = await this.init(); - element = initResult.element; - const {cleanup, destroy, menuPadding, reactionsMenu, reactionsMenuPosition} = initResult; - let isReactionsMenuVisible = false; - if(reactionsMenu) { - const className = 'is-visible'; - isReactionsMenuVisible = reactionsMenu.container.classList.contains(className); - if(isReactionsMenuVisible) reactionsMenu.container.classList.remove(className); - - if(reactionsMenuPosition === 'horizontal') { - const offsetSize = element[/* reactionsMenuPosition === 'vertical' ? 'offsetHeight' : */'offsetWidth']; - // if(reactionsMenu.scrollable.container.scrollWidth > offsetWidth) { - const INNER_CONTAINER_PADDING = 8; - const visibleLength = (offsetSize - INNER_CONTAINER_PADDING) / REACTION_CONTAINER_SIZE; - const nextVisiblePart = visibleLength % 1; - const MIN_NEXT_VISIBLE_PART = 0.65; - if(nextVisiblePart < MIN_NEXT_VISIBLE_PART) { - const minSize = (offsetSize + (MIN_NEXT_VISIBLE_PART - nextVisiblePart) * REACTION_CONTAINER_SIZE) | 0; - element.style[/* reactionsMenuPosition === 'vertical' ? 'minHeight' : */'minWidth'] = minSize + 'px'; - } - // } + this.isSelected = this.chat.selection.isMidSelected(this.peerId, this.mid); + this.message = await this.chat.getMessage(this.mid); + this.noForwards = !isSponsored && !(await this.managers.appMessagesManager.canForward(this.message)); + this.viewerPeerId = undefined; + this.canOpenReactedList = undefined; + + const initResult = await this.init(); + if(!initResult) { + return; } - } - - const side: 'left' | 'right' = bubble.classList.contains('is-in') ? 'left' : 'right'; - //bubble.parentElement.append(element); - //appImManager.log('contextmenu', e, bubble, side); - positionMenu((e as TouchEvent).touches ? (e as TouchEvent).touches[0] : e as MouseEvent, element, side, menuPadding); - - if(reactionsMenu) { - reactionsMenu.widthContainer.style.top = element.style.top; - reactionsMenu.widthContainer.style.left = element.style.left; - reactionsMenu.widthContainer.style.setProperty('--menu-width', element[reactionsMenuPosition === 'vertical' ? 'offsetHeight' : 'offsetWidth'] + 'px'); - element.parentElement.append(reactionsMenu.widthContainer); - if(isReactionsMenuVisible) void reactionsMenu.container.offsetLeft; // reflow - } + + element = initResult.element; + const {cleanup, destroy, menuPadding, reactionsMenu, reactionsMenuPosition} = initResult; + let isReactionsMenuVisible = false; + if(reactionsMenu) { + const className = 'is-visible'; + isReactionsMenuVisible = reactionsMenu.container.classList.contains(className); + if(isReactionsMenuVisible) reactionsMenu.container.classList.remove(className); + + if(reactionsMenuPosition === 'horizontal') { + const offsetSize = element[/* reactionsMenuPosition === 'vertical' ? 'offsetHeight' : */'offsetWidth']; + // if(reactionsMenu.scrollable.container.scrollWidth > offsetWidth) { + const INNER_CONTAINER_PADDING = 8; + const visibleLength = (offsetSize - INNER_CONTAINER_PADDING) / REACTION_CONTAINER_SIZE; + const nextVisiblePart = visibleLength % 1; + const MIN_NEXT_VISIBLE_PART = 0.65; + if(nextVisiblePart < MIN_NEXT_VISIBLE_PART) { + const minSize = (offsetSize + (MIN_NEXT_VISIBLE_PART - nextVisiblePart) * REACTION_CONTAINER_SIZE) | 0; + element.style[/* reactionsMenuPosition === 'vertical' ? 'minHeight' : */'minWidth'] = minSize + 'px'; + } + // } + } + } + + const side: 'left' | 'right' = bubble.classList.contains('is-in') ? 'left' : 'right'; + //bubble.parentElement.append(element); + //appImManager.log('contextmenu', e, bubble, side); + positionMenu((e as TouchEvent).touches ? (e as TouchEvent).touches[0] : e as MouseEvent, element, side, menuPadding); - openBtnMenu(element, () => { if(reactionsMenu) { - reactionsMenu.container.classList.remove('is-visible'); + reactionsMenu.widthContainer.style.top = element.style.top; + reactionsMenu.widthContainer.style.left = element.style.left; + reactionsMenu.widthContainer.style.setProperty('--menu-width', element[reactionsMenuPosition === 'vertical' ? 'offsetHeight' : 'offsetWidth'] + 'px'); + element.parentElement.append(reactionsMenu.widthContainer); + if(isReactionsMenuVisible) void reactionsMenu.container.offsetLeft; // reflow } - this.mid = 0; - this.peerId = undefined; - this.target = null; - this.viewerPeerId = undefined; - this.canOpenReactedList = undefined; + contextMenuController.openBtnMenu(element, () => { + if(reactionsMenu) { + reactionsMenu.container.classList.remove('is-visible'); + } - setTimeout(() => { - destroy(); - }, 300); - }); + this.mid = 0; + this.peerId = undefined; + this.target = null; + this.viewerPeerId = undefined; + this.canOpenReactedList = undefined; + cleanup(); - if(isReactionsMenuVisible) { - reactionsMenu.container.classList.add('is-visible'); - } + setTimeout(() => { + destroy(); + }, 300); + }); + + if(isReactionsMenuVisible) { + reactionsMenu.container.classList.add('is-visible'); + } + }; + + r(); }; public cleanup() { @@ -425,7 +434,7 @@ export default class ChatContextMenu { icon: 'forward', text: 'Forward', onClick: this.onForwardClick, // let forward the message if it's outgoing but not ours (like a changelog) - verify: () => !this.noForwards && this.chat.type !== 'scheduled' && (!this.message.pFlags.is_outgoing || !this.message.pFlags.out) && this.message._ !== 'messageService' + verify: () => !this.noForwards && this.chat.type !== 'scheduled' && (!this.message.pFlags.is_outgoing || this.message.fromId === SERVICE_PEER_ID) && this.message._ !== 'messageService' }, { icon: 'forward', text: 'Message.Context.Selection.Forward', @@ -500,6 +509,10 @@ export default class ChatContextMenu { this.setButtons(); const filteredButtons = await this.filterButtons(this.buttons); + if(!filteredButtons.length) { + return; + } + const element = this.element = ButtonMenu(filteredButtons, this.listenerSetter); element.id = 'bubble-contextmenu'; element.classList.add('contextmenu'); @@ -540,8 +553,9 @@ export default class ChatContextMenu { fakeText.classList.add('btn-menu-item-text-fake'); viewsButton.element.append(fakeText); + const AVATAR_SIZE = 22; const MAX_AVATARS = 3; - const PADDING_PER_AVATAR = .875; + const PADDING_PER_AVATAR = 1.125; i18nElem.element.style.visibility = 'hidden'; i18nElem.element.style.paddingRight = isViewingReactions ? PADDING_PER_AVATAR * Math.min(MAX_AVATARS, recentReactions.length) + 'rem' : '1rem'; const middleware = this.middleware.get(); @@ -595,7 +609,7 @@ export default class ChatContextMenu { } if(reactions.length) { - const avatars = new StackedAvatars({avatarSize: 24}); + const avatars = new StackedAvatars({avatarSize: AVATAR_SIZE}); avatars.render(recentReactions ? recentReactions.map((r) => getPeerId(r.peer_id)) : reactions.map((reaction) => reaction.peerId)); viewsButton.element.append(avatars.container); @@ -645,7 +659,7 @@ export default class ChatContextMenu { }, destroy: () => { element.remove(); - reactionsMenu.widthContainer.remove(); + reactionsMenu && reactionsMenu.widthContainer.remove(); }, menuPadding, reactionsMenu, diff --git a/src/components/chat/input.ts b/src/components/chat/input.ts index 79ee5b48..c830f103 100644 --- a/src/components/chat/input.ts +++ b/src/components/chat/input.ts @@ -92,6 +92,7 @@ import contextMenuController from "../../helpers/contextMenuController"; import { emojiFromCodePoints } from "../../vendor/emoji"; import { modifyAckedPromise } from "../../helpers/modifyAckedResult"; import ChatSendAs from "./sendAs"; +import filterAsync from "../../helpers/array/filterAsync"; const RECORD_MIN_TIME = 500; const POSTING_MEDIA_NOT_ALLOWED = 'Posting media content isn\'t allowed in this group.'; @@ -1211,7 +1212,17 @@ export default class ChatInput { const previousSendAs = this.sendAs; const sendAs = this.createSendAs(); - const [isBroadcast, canPinMessage, isBot, canSend, neededFakeContainer, ackedPeerFull, ackedScheduledMids, setSendAsCallback] = await Promise.all([ + const [ + isBroadcast, + canPinMessage, + isBot, + canSend, + neededFakeContainer, + ackedPeerFull, + ackedScheduledMids, + setSendAsCallback, + filteredAttachMenuButtons + ] = await Promise.all([ this.managers.appPeersManager.isBroadcast(peerId), this.managers.appPeersManager.canPinMessage(peerId), this.managers.appPeersManager.isBot(peerId), @@ -1219,7 +1230,8 @@ export default class ChatInput { this.getNeededFakeContainer(), modifyAckedPromise(this.managers.acknowledged.appProfileManager.getProfileByPeerId(peerId)), btnScheduled ? modifyAckedPromise(this.managers.acknowledged.appMessagesManager.getScheduledMessages(peerId)) : undefined, - sendAs ? (sendAs.setPeerId(this.chat.peerId), sendAs.updateManual(true)) : undefined + sendAs ? (sendAs.setPeerId(this.chat.peerId), sendAs.updateManual(true)) : undefined, + this.filterAttachMenuButtons() ]); const placeholderKey = this.messageInput ? await this.getPlaceholderKey() : undefined; @@ -1291,7 +1303,7 @@ export default class ChatInput { } if(this.messageInput) { - this.updateMessageInput(canSend, placeholderKey); + this.updateMessageInput(canSend, placeholderKey, filteredAttachMenuButtons); } else if(this.pinnedControlBtn) { this.pinnedControlBtn.append(i18n(canPinMessage ? 'Chat.Input.UnpinAll' : 'Chat.Pinned.DontShow')); } @@ -1373,7 +1385,14 @@ export default class ChatInput { i.compareAndUpdate({key}); } - public updateMessageInput(canSend: boolean, placeholderKey: LangPackKey) { + private filterAttachMenuButtons() { + const {peerId, threadId} = this.chat; + return filterAsync(this.attachMenuButtons, (button) => { + return button.verify(peerId, threadId); + }); + } + + public updateMessageInput(canSend: boolean, placeholderKey: LangPackKey, visible: ChatInput['attachMenuButtons']) { const {chatInput, attachMenu, messageInput} = this; const {peerId, threadId} = this.chat; const isHidden = chatInput.classList.contains('is-hidden'); @@ -1387,10 +1406,8 @@ export default class ChatInput { this.updateMessageInputPlaceholder(placeholderKey); - const visible = this.attachMenuButtons.filter((button) => { - const good = button.verify(peerId, threadId); - button.element.classList.toggle('hide', !good); - return good; + this.attachMenuButtons.forEach((button) => { + button.element.classList.toggle('hide', !visible.includes(button)); }); if(!canSend) { diff --git a/src/components/chat/selection.ts b/src/components/chat/selection.ts index f34c6fd8..c89a05f0 100644 --- a/src/components/chat/selection.ts +++ b/src/components/chat/selection.ts @@ -333,6 +333,7 @@ class AppSelection extends EventListenerBase<{ this.appendCheckbox(element, checkboxField); } else if(hasCheckbox) { this.getCheckboxInputFromElement(element).parentElement.remove(); + SetTransition(element, 'is-selected', false, 200); } return true; @@ -976,6 +977,7 @@ export default class ChatSelection extends AppSelection { }; protected onCancelSelection = async() => { + return; const promises: Promise[] = []; for(const [peerId, mids] of this.selectedMids) { for(const mid of mids) { diff --git a/src/components/chat/sendAs.ts b/src/components/chat/sendAs.ts index 01303eb5..431e545a 100644 --- a/src/components/chat/sendAs.ts +++ b/src/components/chat/sendAs.ts @@ -141,7 +141,7 @@ export default class ChatSendAs { buttons.forEach((button, idx) => { const peerId = peerIds[idx]; const avatar = new AvatarElement(); - avatar.classList.add('avatar-32', 'btn-menu-item-icon'); + avatar.classList.add('avatar-26', 'btn-menu-item-icon'); avatar.updateWithOptions({peerId}); if(!idx) { diff --git a/src/components/poll.ts b/src/components/poll.ts index 88ab1f64..e3bb5641 100644 --- a/src/components/poll.ts +++ b/src/components/poll.ts @@ -294,7 +294,7 @@ export default class PollElement extends HTMLElement { setInnerHTML(this.firstElementChild, wrapEmojiText(poll.question)); Array.from(this.querySelectorAll('.poll-answer-text')).forEach((el, idx) => { - setInnerHTML(el, RichTextProcessor.wrapEmojiText(poll.answers[idx].text)); + setInnerHTML(el, wrapEmojiText(poll.answers[idx].text)); }); this.descDiv = this.firstElementChild.nextElementSibling as HTMLElement; diff --git a/src/components/wrappers/reply.ts b/src/components/wrappers/reply.ts index b04a6592..228b7cb2 100644 --- a/src/components/wrappers/reply.ts +++ b/src/components/wrappers/reply.ts @@ -4,6 +4,7 @@ * https://github.com/morethanwords/tweb/blob/master/LICENSE */ +import { hexToRgb } from "../../helpers/color"; import { Message } from "../../layer"; import getPeerColorById from "../../lib/appManagers/utils/peers/getPeerColorById"; import ReplyContainer from "../chat/replyContainer"; @@ -19,8 +20,11 @@ export default function wrapReply( if(setColorPeerId) { const hex = getPeerColorById(setColorPeerId, false); - replyContainer.border.style.backgroundColor = hex; - replyContainer.title.style.color = hex; + const [r, g, b] = hexToRgb(hex); + replyContainer.container.style.setProperty('--override-color', `${r}, ${g}, ${b}`); + replyContainer.container.classList.add('is-overriding-color'); + // replyContainer.border.style.backgroundColor = hex; + // replyContainer.title.style.color = hex; } return {container: replyContainer.container, fillPromise}; diff --git a/src/index.ts b/src/index.ts index 9e1e669f..e4b60d95 100644 --- a/src/index.ts +++ b/src/index.ts @@ -22,7 +22,6 @@ import I18n from './lib/langPack'; import './helpers/peerIdPolyfill'; import './lib/polyfill'; import apiManagerProxy from './lib/mtproto/mtprotoworker'; -import loadState from './lib/appManagers/utils/state/loadState'; import getProxiedManagers from './lib/appManagers/getProxiedManagers'; import themeController from './helpers/themeController'; import overlayCounter from './helpers/overlayCounter'; @@ -32,7 +31,6 @@ document.addEventListener('DOMContentLoaded', async() => { toggleAttributePolyfill(); rootScope.managers = getProxiedManagers(); - apiManagerProxy; singleInstance.start(); @@ -193,7 +191,8 @@ document.addEventListener('DOMContentLoaded', async() => { const langPromise = I18n.getCacheLangPack(); const [stateResult, langPack] = await Promise.all([ - loadState(), + // loadState(), + apiManagerProxy.sendState().then(([stateResult]) => stateResult), langPromise ]); I18n.setTimeFormat(stateResult.state.settings.timeFormat); diff --git a/src/lib/appManagers/appImManager.ts b/src/lib/appManagers/appImManager.ts index 03a8258d..25b2a8b6 100644 --- a/src/lib/appManagers/appImManager.ts +++ b/src/lib/appManagers/appImManager.ts @@ -1842,6 +1842,19 @@ export class AppImManager extends EventListenerBase<{ return; } + let peerTitlePromise: Promise; + let args: any[]; + if(peerId.isAnyChat()) { + const peerTitle = new PeerTitle(); + peerTitlePromise = peerTitle.update({peerId: typing.userId.toPeerId(false), onlyFirstName: true}); + args = [ + peerTitle.element, + typings.length - 1 + ]; + + await peerTitlePromise; + } + if(!container) { container = document.createElement('span'); container.classList.add('online', 'peer-typing-container'); @@ -1859,17 +1872,6 @@ export class AppImManager extends EventListenerBase<{ } } - let peerTitlePromise: Promise; - let args: any[]; - if(peerId.isAnyChat()) { - const peerTitle = new PeerTitle(); - peerTitlePromise = peerTitle.update({peerId: typing.userId.toPeerId(false), onlyFirstName: true}); - args = [ - peerTitle.element, - typings.length - 1 - ]; - } - if(action._ === 'sendMessageEmojiInteractionSeen') { if(args) { args.pop(); @@ -1886,10 +1888,6 @@ export class AppImManager extends EventListenerBase<{ if(container.childElementCount > 1) container.lastElementChild.replaceWith(descriptionElement); else container.append(descriptionElement); - - if(peerTitlePromise) { - await peerTitlePromise; - } // log('returning typing'); return container; diff --git a/src/lib/appManagers/appManagersManager.ts b/src/lib/appManagers/appManagersManager.ts index bfe0318d..7f1b94e9 100644 --- a/src/lib/appManagers/appManagersManager.ts +++ b/src/lib/appManagers/appManagersManager.ts @@ -54,6 +54,7 @@ export class AppManagersManager { const appStoragesManager = new AppStoragesManager(); await Promise.all([ + // new Promise(() => {}), appStoragesManager.loadStorages(), this.cryptoPortPromise ]); diff --git a/src/lib/idb.ts b/src/lib/idb.ts index d7033b48..e6ba5a1c 100644 --- a/src/lib/idb.ts +++ b/src/lib/idb.ts @@ -369,6 +369,10 @@ export default class IDBStorage, StoreName extends strin entryName = [].concat(entryName); } + if(!entryName.length) { + return Promise.resolve([]) as any; + } + return this.getObjectStore('readonly', (objectStore) => { return (entryName as string[]).map((entryName) => objectStore.get(entryName)); }, DEBUG ? 'get: ' + entryName.join(', ') : '', storeName); @@ -421,7 +425,7 @@ export default class IDBStorage, StoreName extends strin // transaction.oncomplete = () => onComplete('transaction'); const timeout = setTimeout(() => { - this.log.error('transaction not finished', transaction); + this.log.error('transaction not finished', transaction, log); }, 10000); /* transaction.addEventListener('abort', (e) => { diff --git a/src/lib/mtproto/mtproto.worker.ts b/src/lib/mtproto/mtproto.worker.ts index 8e246984..73c3323f 100644 --- a/src/lib/mtproto/mtproto.worker.ts +++ b/src/lib/mtproto/mtproto.worker.ts @@ -31,11 +31,6 @@ port.addMultipleEventsListeners({ transportController.waitForWebSocket(); }, - // windowSize: ({width, height}) => { - // windowSize.width = width; - // windowSize.height = height; - // }, - crypto: ({method, args}) => { return cryptoWorker.invokeCrypto(method as any, ...args as any); }, diff --git a/src/lib/mtproto/mtprotoMessagePort.ts b/src/lib/mtproto/mtprotoMessagePort.ts index da15df73..fa3a236e 100644 --- a/src/lib/mtproto/mtprotoMessagePort.ts +++ b/src/lib/mtproto/mtprotoMessagePort.ts @@ -21,7 +21,6 @@ type MTProtoBroadcastEvent = { export default class MTProtoMessagePort extends SuperMessagePort<{ environment: (environment: ReturnType) => void, - // windowSize: (payload: {width: number, height: number}) => void, crypto: (payload: {method: string, args: any[]}) => Promise, state: (payload: {userId: UserId} & Awaited> & {storagesResults?: StoragesResults}) => void, manager: (payload: MTProtoManagerTaskPayload) => any, diff --git a/src/lib/mtproto/mtprotoworker.ts b/src/lib/mtproto/mtprotoworker.ts index ab784f37..225a08e9 100644 --- a/src/lib/mtproto/mtprotoworker.ts +++ b/src/lib/mtproto/mtprotoworker.ts @@ -172,10 +172,7 @@ class ApiManagerProxy extends MTProtoMessagePort { this.log('Passing environment:', ENVIRONMENT); this.invoke('environment', ENVIRONMENT); - this.sendState(); - // setTimeout(() => { - // this.getConfig(); - // }, 5000); + // this.sendState(); } private registerServiceWorker() { @@ -318,61 +315,38 @@ class ApiManagerProxy extends MTProtoMessagePort { } } - // protected s() { - // const originalPostMessage = this.postMessage; - // const postQueue: any[] = []; - // this.postMessage = (source, task) => { - // if(task.type === 'invoke' && task.payload.type === 'state') { - // this.postMessage = originalPostMessage; - // postQueue.unshift(task); - // postQueue.forEach((task) => this.postMessage(undefined, task)); - // postQueue.length = 0; - // } else { - // postQueue.push(task); - // } - // }; - // } - private onWorkerFirstMessage(worker: any) { this.log('set webWorker'); - // return; this.worker = worker; /// #if MTPROTO_SW this.attachSendPort(worker); /// #else this.attachWorkerToPort(worker, this, 'mtproto'); - // this.s(); - // port.addEventListener('message', () => { - // this.registerServiceWorker(); - // }, {once: true}); /// #endif - - // this.startSendingWindowSize(); } public addServiceWorkerTaskListener(name: keyof ApiManagerProxy['taskListenersSW'], callback: ApiManagerProxy['taskListenersSW'][typeof name]) { this.taskListenersSW[name] = callback; } - // private startSendingWindowSize() { - // const sendWindowSize = () => { - // this.invoke('windowSize', {width: windowSize.width, height: windowSize.height}); - // }; - - // mediaSizes.addEventListener('resize', sendWindowSize); - // sendWindowSize(); - // } - - private sendState() { + private loadState() { return Promise.all([ - loadState(), + loadState().then((stateResult) => { + this.newVersion = stateResult.newVersion; + this.oldVersion = stateResult.oldVersion; + this.mirrors['state'] = stateResult.state; + return stateResult; + }), // loadStorages(createStorages()), - ]).then(([stateResult/* , storagesResults */]) => { - this.newVersion = stateResult.newVersion; - this.oldVersion = stateResult.oldVersion; - this.mirrors['state'] = stateResult.state; + ]); + } + + public sendState() { + return this.loadState().then((result) => { + const [stateResult] = result; this.invoke('state', {...stateResult, userId: rootScope.myId.toUserId()}); + return result; }); } diff --git a/src/lib/richTextProcessor/wrapRichText.ts b/src/lib/richTextProcessor/wrapRichText.ts index 4c39ca8d..dce1e11e 100644 --- a/src/lib/richTextProcessor/wrapRichText.ts +++ b/src/lib/richTextProcessor/wrapRichText.ts @@ -304,8 +304,8 @@ export default function wrapRichText(text: string, options: Partial<{ } const href = (currentContext || typeof electronHelpers === 'undefined') - ? encodeEntities(url) - : `javascript:electronHelpers.openExternal('${encodeEntities(url)}');`; + ? url + : `javascript:electronHelpers.openExternal('${url}');`; element = document.createElement('a'); element.className = 'anchor-url'; diff --git a/src/scss/partials/_avatar.scss b/src/scss/partials/_avatar.scss index 5ceace6b..9bf59033 100644 --- a/src/scss/partials/_avatar.scss +++ b/src/scss/partials/_avatar.scss @@ -219,6 +219,11 @@ avatar-element { --multiplier: 2.25; } + &.avatar-22 { + --size: 22px; + --multiplier: 2.454545; + } + &.avatar-18 { --size: 18px; --multiplier: 3; diff --git a/src/scss/partials/_button.scss b/src/scss/partials/_button.scss index e651c577..1dd0f435 100644 --- a/src/scss/partials/_button.scss +++ b/src/scss/partials/_button.scss @@ -296,7 +296,7 @@ .stacked-avatars { --margin-right: -.6875rem; flex: 0 0 auto; - right: 1rem; + right: .5rem; // margin-right: -1.5rem; // margin-left: 1rem; position: absolute; diff --git a/src/scss/partials/_chatBubble.scss b/src/scss/partials/_chatBubble.scss index 98adb3ec..a34f6339 100644 --- a/src/scss/partials/_chatBubble.scss +++ b/src/scss/partials/_chatBubble.scss @@ -2359,6 +2359,20 @@ $bubble-beside-button-width: 38px; code { color: var(--monospace-text-color); } + + .reply.is-overriding-color { + .reply-border { + background-color: rgb(var(--override-color)); + } + + .reply-title { + color: rgb(var(--override-color)); + } + + @include hover() { + background-color: rgba(var(--override-color), #{$hover-alpha}); + } + } } .bubble.is-out { diff --git a/src/scss/partials/_scrollable.scss b/src/scss/partials/_scrollable.scss index 63e5ceee..c3555904 100644 --- a/src/scss/partials/_scrollable.scss +++ b/src/scss/partials/_scrollable.scss @@ -94,9 +94,12 @@ html:not(.is-safari):not(.is-ios) { overflow-y: overlay; scrollbar-width: thin; // Firefox only scrollbar-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0); - transition: scrollbar-color .3s ease; -ms-overflow-style: none; transform: translateZ(0); + + // html.is-firefox & { + // transition: scrollbar-color .3s ease; + // } /* html.is-safari & { overflow-y: scroll;