diff --git a/src/components/chat/input.ts b/src/components/chat/input.ts index 99311503..c24e0a03 100644 --- a/src/components/chat/input.ts +++ b/src/components/chat/input.ts @@ -1632,8 +1632,8 @@ export default class ChatInput { }; */ executed.push(document.execCommand('styleWithCSS', false, 'true')); - - if(type === 'monospace' || type === 'spoiler') { + + const checkType = (type: MarkdownType) => { let haveThisType = false; //executed.push(document.execCommand('styleWithCSS', false, 'true')); @@ -1648,14 +1648,30 @@ export default class ChatInput { } } - //executed.push(document.execCommand('removeFormat', false, null)); + return haveThisType; + }; + + // * monospace can't be combined with different types + if(type === 'monospace' || type === 'spoiler') { + // executed.push(document.execCommand('styleWithCSS', false, 'true')); + + const haveThisType = checkType(type); + // executed.push(document.execCommand('removeFormat', false, null)); if(haveThisType) { - executed.push(this.resetCurrentFormatting()); + executed.push(this.resetCurrentFontFormatting()); } else { + if(type === 'monospace' || checkType('monospace')) { + executed.push(this.resetCurrentFormatting()); + } + executed.push(typeof(command) === 'function' ? command() : document.execCommand(command, false, null)); } } else { + if(checkType('monospace')) { + executed.push(this.resetCurrentFormatting()); + } + executed.push(typeof(command) === 'function' ? command() : document.execCommand(command, false, null)); } @@ -1671,6 +1687,10 @@ export default class ChatInput { } private resetCurrentFormatting() { + return document.execCommand('removeFormat', false, null); + } + + private resetCurrentFontFormatting() { return document.execCommand('fontName', false, 'Roboto'); } @@ -1823,7 +1843,7 @@ export default class ChatInput { // document.execCommand('styleWithCSS', false, 'true'); setTimeout(() => { if(document.activeElement === this.messageInput) { - this.resetCurrentFormatting(); + this.resetCurrentFontFormatting(); } }, 0); // document.execCommand('styleWithCSS', false, 'false'); diff --git a/src/scss/fonts/_roboto.scss b/src/scss/fonts/_roboto.scss index 41a73dd2..fe3b886c 100644 --- a/src/scss/fonts/_roboto.scss +++ b/src/scss/fonts/_roboto.scss @@ -57,3 +57,35 @@ src: local('Roboto Medium'), local('Roboto-Medium'), url(assets/fonts/KFOlCnqEu92Fr1MmEU9fBBc4AMP6lQ.woff2) format('woff2'); unicode-range:U + 0000-00FF, U + 0131, U + 0152-0153, U + 02BB-02BC, U + 02C6, U + 02DA, U + 02DC, U + 2000-206F, U + 2074, U + 20AC, U + 2122, U + 2191, U + 2193, U + 2212, U + 2215, U + FEFF, U + FFFD } + +// * fix bold formatting + +/* cyrillic */ +@font-face { + font-family: 'Roboto'; + font-style: normal; + font-weight: 600; + font-display: swap; + src: local('Roboto Medium'), local('Roboto-Medium'), url(assets/fonts/KFOlCnqEu92Fr1MmEU9fABc4AMP6lbBP.woff2) format('woff2'); + unicode-range:U + 0400-045F, U + 0490-0491, U + 04B0-04B1, U + 2116 +} + +/* latin-ext */ +@font-face { + font-family: 'Roboto'; + font-style: normal; + font-weight: 600; + font-display: swap; + src: local('Roboto Medium'), local('Roboto-Medium'), url(assets/fonts/KFOlCnqEu92Fr1MmEU9fChc4AMP6lbBP.woff2) format('woff2'); + unicode-range:U + 0100-024F, U + 0259, U + 1E00-1EFF, U + 2020, U + 20A0-20AB, U + 20AD-20CF, U + 2113, U + 2C60-2C7F, U + A720-A7FF +} + +/* latin */ +@font-face { + font-family: 'Roboto'; + font-style: normal; + font-weight: 600; + font-display: swap; + src: local('Roboto Medium'), local('Roboto-Medium'), url(assets/fonts/KFOlCnqEu92Fr1MmEU9fBBc4AMP6lQ.woff2) format('woff2'); + unicode-range:U + 0000-00FF, U + 0131, U + 0152-0153, U + 02BB-02BC, U + 02C6, U + 02DA, U + 02DC, U + 2000-206F, U + 2074, U + 20AC, U + 2122, U + 2191, U + 2193, U + 2212, U + 2215, U + FEFF, U + FFFD +} diff --git a/src/scss/style.scss b/src/scss/style.scss index e4d2545d..e94dbac2 100644 --- a/src/scss/style.scss +++ b/src/scss/style.scss @@ -541,9 +541,9 @@ input, [contenteditable=true] { background-color: transparent; } -[contenteditable] [style*="bold"] { - font-weight: var(--font-weight-bold) !important; -} +// [contenteditable] [style*="bold"] { +// font-weight: var(--font-weight-bold) !important; +// } input, textarea { -webkit-appearance: none;