diff --git a/src/client/app/common/views/components/misskey-flavored-markdown.ts b/src/client/app/common/views/components/misskey-flavored-markdown.ts index 1480c0325c..096ffcbf8a 100644 --- a/src/client/app/common/views/components/misskey-flavored-markdown.ts +++ b/src/client/app/common/views/components/misskey-flavored-markdown.ts @@ -56,7 +56,18 @@ export default Vue.component('misskey-flavored-markdown', { } case 'bold': - return createElement('strong', token.bold); + return createElement('b', token.bold); + + case 'big': + return (createElement as any)('strong', { + attrs: { + style: 'display: inline-block; font-size: 200%;' + }, + directives: [{ + name: 'animate-css', + value: { classes: 'tada', iteration: 'infinite' } + }] + }, token.big); case 'url': return createElement(MkUrl, { diff --git a/src/mfm/html.ts b/src/mfm/html.ts index 71b4739476..eeaa4d8136 100644 --- a/src/mfm/html.ts +++ b/src/mfm/html.ts @@ -11,6 +11,12 @@ const handlers: { [key: string]: (window: any, token: any, mentionedRemoteUsers: document.body.appendChild(b); }, + big({ document }, { big }) { + const b = document.createElement('strong'); + b.textContent = big; + document.body.appendChild(b); + }, + code({ document }, { code }) { const pre = document.createElement('pre'); const inner = document.createElement('code'); diff --git a/src/mfm/parse/elements/big.ts b/src/mfm/parse/elements/big.ts new file mode 100644 index 0000000000..ca798986e9 --- /dev/null +++ b/src/mfm/parse/elements/big.ts @@ -0,0 +1,20 @@ +/** + * Bold + */ + +export type TextElementBig = { + type: 'big' + content: string + big: string +}; + +export default function(text: string) { + const match = text.match(/^\*\*\*(.+?)\*\*\*/); + if (!match) return null; + const big = match[0]; + return { + type: 'big', + content: big, + big: match[1] + } as TextElementBig; +} diff --git a/src/mfm/parse/index.ts b/src/mfm/parse/index.ts index 8d71409e58..066c062559 100644 --- a/src/mfm/parse/index.ts +++ b/src/mfm/parse/index.ts @@ -3,6 +3,7 @@ */ import { TextElementBold } from './elements/bold'; +import { TextElementBig } from './elements/big'; import { TextElementCode } from './elements/code'; import { TextElementEmoji } from './elements/emoji'; import { TextElementHashtag } from './elements/hashtag'; @@ -15,6 +16,7 @@ import { TextElementTitle } from './elements/title'; import { TextElementUrl } from './elements/url'; const elements = [ + require('./elements/big'), require('./elements/bold'), require('./elements/title'), require('./elements/url'), @@ -30,6 +32,7 @@ const elements = [ export type TextElement = { type: 'text', content: string } | TextElementBold + | TextElementBig | TextElementCode | TextElementEmoji | TextElementHashtag diff --git a/test/mfm.ts b/test/mfm.ts index df0f0be045..1a22e1491b 100644 --- a/test/mfm.ts +++ b/test/mfm.ts @@ -31,6 +31,14 @@ describe('Text', () => { ], tokens); }); + it('big', () => { + const tokens = analyze('***Strawberry*** Pasta'); + assert.deepEqual([ + { type: 'big', content: '***Strawberry***', bold: 'Strawberry' }, + { type: 'text', content: ' Pasta' } + ], tokens); + }); + it('mention', () => { const tokens = analyze('@himawari お腹ペコい'); assert.deepEqual([